В Xamarin.Forms все мои события щелчка перестали работать после того, как я добавил ScrollView на страницу. ScrollView перехватывает щелчки?

Question

Вот соответствующий код:

XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Name="ContentPage_MainPage"
             x:Class="OpenBacon.MainPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem x:Name="ToolbarItem_Subreddits" Order="Primary" Priority="10" Text="Initializing...." Clicked="ToolbarItemSubreddits_Clicked" />
        <ToolbarItem x:Name="ToolbarItem_Spacer" Order="Primary" Priority="20" Text="     " />
        <ToolbarItem Order="Primary" Priority="30" Clicked="ToolbarItemSearch_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconSearch" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem x:Name="ToolbarItem_Mail" Order="Primary" Priority="40" Clicked="ToolbarItemMail_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconMail" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem Order="Primary" Priority="50" Clicked="ToolbarItemBaconButton_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconBaconButton" />
            </ToolbarItem.Icon>
        </ToolbarItem>
    </ContentPage.ToolbarItems>
    <ContentPage.Content>
        <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <ScrollView x:FieldModifier="public" x:Name="ScrollView_Main" Orientation="Vertical">
                <StackLayout x:Name="StackLayout_Main">
                    <!-- Sort bar. -->
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid Grid.Row="0" VerticalOptions="Start" BackgroundColor="LightGray" RowSpacing="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="2*" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Label Grid.Column="0" Text="" FontSize="Small" VerticalOptions="End" Margin="2" x:Name="Label_PostsSinceLastRefresh" />
                            <Button x:Name="ButtonSort" Grid.Column="1" Text="" FontSize="Small" Clicked="ButtonSort_Clicked" />
                        </Grid>
                    </Grid>
                    <!-- Posts list goes here (generated). -->
                    <StackLayout VerticalOptions="StartAndExpand" x:Name="StackLayout_Posts">

                    </StackLayout>
                </StackLayout>
            </ScrollView>

C #:

(в конструкторе для MainPage)

Content = ScrollView_Main;

Если я закомментирую строку «Content =», ScrollView исчезнет, ​​но все элементы панели инструментов смогут снова получать события нажатия. Без комментариев прокрутка работает отлично, но я не могу ничего нажать на странице.

Я не могу найти упоминаний о каких-либо опциях, чтобы исправить это поведение. Это ошибка Xamarin.Forms или я что-то упустил?

РЕДАКТИРОВАТЬ: Вот полный XAML:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Name="ContentPage_MainPage"
             x:Class="OpenBacon.MainPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem x:Name="ToolbarItem_Subreddits" Order="Primary" Priority="10" Text="Initializing...." Clicked="ToolbarItemSubreddits_Clicked" />
        <ToolbarItem x:Name="ToolbarItem_Spacer" Order="Primary" Priority="20" Text="     " />
        <ToolbarItem Order="Primary" Priority="30" Clicked="ToolbarItemSearch_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconSearch" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem x:Name="ToolbarItem_Mail" Order="Primary" Priority="40" Clicked="ToolbarItemMail_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconMail" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem Order="Primary" Priority="50" Clicked="ToolbarItemBaconButton_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconBaconButton" />
            </ToolbarItem.Icon>
        </ToolbarItem>
    </ContentPage.ToolbarItems>
    <ContentPage.Content>
        <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <ScrollView x:FieldModifier="public" x:Name="ScrollView_Main" Orientation="Vertical">
                <StackLayout x:Name="StackLayout_Main">
                    <!-- Sort bar. -->
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid Grid.Row="0" VerticalOptions="Start" BackgroundColor="LightGray" RowSpacing="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="2*" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Label Grid.Column="0" Text="" FontSize="Small" VerticalOptions="End" Margin="2" x:Name="Label_PostsSinceLastRefresh" />
                            <Button x:Name="ButtonSort" Grid.Column="1" Text="" FontSize="Small" Clicked="ButtonSort_Clicked" />
                        </Grid>
                    </Grid>
                    <!-- Posts list goes here (generated). -->
                    <StackLayout VerticalOptions="StartAndExpand" x:Name="StackLayout_Posts">

                    </StackLayout>
                </StackLayout>
            </ScrollView>

            <ContentView x:Name="Popup_Subreddits" BackgroundColor="DimGray" Padding="10, 10" IsVisible="False" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All">
                <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                    <StackLayout Orientation="Vertical" HeightRequest="400" WidthRequest="300" BackgroundColor="White">
                        <ListView x:Name="ListView_Subreddits" ItemTapped="ListView_Subreddits_ItemTapped">
                            <ListView.ItemsSource>
                                <x:Array Type="{x:Type x:String}"></x:Array>
                            </ListView.ItemsSource>
                        </ListView>
                    </StackLayout>
                </StackLayout>
                <ContentView.GestureRecognizers>
                    <TapGestureRecognizer Tapped="Popup_Subreddits_OutClick" />
                </ContentView.GestureRecognizers>
            </ContentView>
            <ContentView x:Name="Popup_BaconButton" BackgroundColor="#446"  Padding="75, 0, 0, 75" IsVisible="False" AbsoluteLayout.LayoutBounds="1, 0, .9, .9" AbsoluteLayout.LayoutFlags="All">
                <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                    <StackLayout Orientation="Vertical" HeightRequest="600" WidthRequest="300" BackgroundColor="#0079D3">
                        <ListView x:Name="ListView_BaconButton" ItemTapped="ListView_BaconButton_ItemTapped">
                            <ListView.ItemTemplate>
                                <DataTemplate>
                                    <ImageCell Text="{Binding Name}" Detail="{Binding Detail}" ImageSource="{Binding ImageSrc}" TextColor="White" DetailColor="WhiteSmoke" />
                                </DataTemplate>
                            </ListView.ItemTemplate>
                        </ListView>
                    </StackLayout>
                </StackLayout>
                <ContentView.GestureRecognizers>
                    <TapGestureRecognizer Tapped="Popup_BaconButton_OutClick" />
                </ContentView.GestureRecognizers>
            </ContentView>
        </AbsoluteLayout>
    </ContentPage.Content>

</ContentPage>

Answer 1

Вы можете использовать RelativeLayout для достижения этой цели.

Я создал простую демонстрацию для имитации вашей функции, и для того, чтобы ее было легче понять, я сделал фон желтым. Основной код:

 <ContentPage.ToolbarItems>
    <ToolbarItem x:Name="ToolbarItem_Subreddits" Order="Primary" Priority="10" Text="Initializing...." Clicked="ToolbarItemSubreddits_Clicked"/>
    <ToolbarItem x:Name="ToolbarItem_Spacer" Order="Primary" Priority="20" Text="     " />
    <ToolbarItem Order="Primary" Priority="30" Clicked="ToolbarItemSearch_Clicked">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconSearch" />
        </ToolbarItem.Icon>
    </ToolbarItem>
    <ToolbarItem x:Name="ToolbarItem_Mail" Order="Primary" Priority="40" Clicked="ToolbarItemMail_Clicked">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconMail" />
        </ToolbarItem.Icon>
    </ToolbarItem>
    <ToolbarItem Order="Primary" Priority="50" Clicked="ToolbarItemBaconButton_Clicked">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconBaconButton" />
        </ToolbarItem.Icon>
    </ToolbarItem>
</ContentPage.ToolbarItems>
<ContentPage.Content>
        <ScrollView x:FieldModifier="public" x:Name="ScrollView_Main" Orientation="Vertical">   
       <!--attention here-->
        <RelativeLayout BackgroundColor="Yellow" HeightRequest="800" WidthRequest="800" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <StackLayout x:Name="StackLayout_Main"  HorizontalOptions="Fill" VerticalOptions="Fill"
                RelativeLayout.XConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width, Factor = 0}"
                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor = 0}" >
                <!-- Sort bar. -->
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="0" VerticalOptions="Start" BackgroundColor="LightGray" RowSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="2*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Label Grid.Column="0" Text="test" FontSize="Small" VerticalOptions="End" Margin="2" x:Name="Label_PostsSinceLastRefresh" />
                        <Button x:Name="ButtonSort" Grid.Column="1" Text="Button_Sort" FontSize="Small" Clicked="ButtonSort_Clicked" />
                    </Grid>
                </Grid>
                <!-- Posts list goes here (generated). -->
                <StackLayout VerticalOptions="StartAndExpand" x:Name="StackLayout_Posts">

                </StackLayout>
            </StackLayout>

        <ContentView x:Name="Popup_Subreddits" BackgroundColor="DimGray" Padding="10, 10" IsVisible="True" 
                     RelativeLayout.XConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width, Factor = 0}"
                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor = 0.06}"
                     >
            <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                <StackLayout Orientation="Vertical" HeightRequest="400" WidthRequest="300" BackgroundColor="White">
                    <ListView x:Name="ListView_Subreddits" ItemTapped="ListView_Subreddits_ItemTapped">
                        <ListView.ItemsSource>
                            <x:Array Type="{x:Type x:String}">
                            <x:String>mono</x:String>
                            <x:String>monodroid</x:String>
                            <x:String>monotouch</x:String>
                            <x:String>monorail</x:String>
                            <x:String>monodevelop</x:String>
                            <x:String>monotone</x:String>
                            <x:String>monopoly</x:String>
                            <x:String>monomodal</x:String>
                            <x:String>mononucleosis</x:String>
                           </x:Array>
                        </ListView.ItemsSource>
                    </ListView>
                </StackLayout>
            </StackLayout>
            <ContentView.GestureRecognizers>
                <TapGestureRecognizer Tapped="Popup_Subreddits_OutClick" />
            </ContentView.GestureRecognizers>
        </ContentView>
         <ContentView x:Name="Popup_BaconButton" BackgroundColor="#446"  Padding="0, 0, 0, 0" IsVisible="False" 
                      RelativeLayout.XConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width, Factor = 0}"
                      RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor = 0.06}"
                      >
            <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                <StackLayout Orientation="Vertical" HeightRequest="600" WidthRequest="300" BackgroundColor="#0079D3">
                    <ListView x:Name="listView" ItemTapped="ListView_BaconButton_ItemTapped"> 
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <ImageCell Text="{Binding Name}" Detail="{Binding Comment}"  ImageSource="{Binding Image}" TextColor="White" DetailColor="WhiteSmoke" />
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </StackLayout>
            </StackLayout>
            <ContentView.GestureRecognizers>
                <TapGestureRecognizer Tapped="Popup_BaconButton_OutClick" />
            </ContentView.GestureRecognizers>
        </ContentView>
        </RelativeLayout>
    </ScrollView>
</ContentPage.Content>

Примечание:

1.use RelativeLayout в качестве родительского макета. И установите свойство ContentView так, как это:

<ContentView x:Name="Popup_Subreddits" BackgroundColor="DimGray" Padding="10, 10" IsVisible="True" 
                     RelativeLayout.XConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width, Factor = 0}"
                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor = 0.06}"
                     >
 </ContentView>

И

  <ContentView x:Name="Popup_BaconButton" BackgroundColor="#446"  Padding="0, 0, 0, 0" IsVisible="False" 
                      RelativeLayout.XConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width, Factor = 0}"
                      RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor = 0.06}"
                      >
</ContentView>

Конечно, вы можете настроить значение Factor в соответствии с вашими требованиями.

Результат демонстрации:

введите описание изображения здесь

Answer 2

Я наконец нашел решение проблемы здесь:

https://forums.xamarin.com/discussion/comment/373736/#Comment_373736

Очевидно, все, что мне нужно было сделать, это добавить следующее в определение ScrollView:

AbsoluteLayout.LayoutBounds = "0, 0, 1, 1"

AbsoluteLayout.LayoutFlags = "Все"

Т.е.

<ScrollView 
    x:FieldModifier="public" 
    x:Name="ScrollView_Main" 
    Orientation="Vertical" 
    AbsoluteLayout.LayoutBounds="0, 0, 1, 1" 
    AbsoluteLayout.LayoutFlags="All">

Итак, полный XAML теперь выглядит следующим образом:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Name="ContentPage_MainPage"
             x:Class="OpenBacon.MainPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem x:Name="ToolbarItem_Subreddits" Order="Primary" Priority="10" Text="Initializing...." Clicked="ToolbarItemSubreddits_Clicked" />
        <ToolbarItem x:Name="ToolbarItem_Spacer" Order="Primary" Priority="20" Text="     " />
        <ToolbarItem Order="Primary" Priority="30" Clicked="ToolbarItemSearch_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconSearch" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem x:Name="ToolbarItem_Mail" Order="Primary" Priority="40" Clicked="ToolbarItemMail_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconMail" />
            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem Order="Primary" Priority="50" Clicked="ToolbarItemBaconButton_Clicked">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"  Android="OpenBaconBaconButton" />
            </ToolbarItem.Icon>
        </ToolbarItem>
    </ContentPage.ToolbarItems>
    <ContentPage.Content>
        <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <ScrollView x:FieldModifier="public" x:Name="ScrollView_Main" Orientation="Vertical" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All">
                <StackLayout x:Name="StackLayout_Main">
                    <!-- Sort bar. -->
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid Grid.Row="0" VerticalOptions="Start" BackgroundColor="LightGray" RowSpacing="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="2*" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Label Grid.Column="0" Text="" FontSize="Small" VerticalOptions="End" Margin="2" x:Name="Label_PostsSinceLastRefresh" />
                            <Button x:Name="ButtonSort" Grid.Column="1" Text="" FontSize="Small" Clicked="ButtonSort_Clicked" />
                        </Grid>
                    </Grid>
                    <!-- Posts list goes here (generated). -->
                    <StackLayout VerticalOptions="StartAndExpand" x:Name="StackLayout_Posts">

                    </StackLayout>
                </StackLayout>
            </ScrollView>

            <ContentView x:Name="Popup_Subreddits" BackgroundColor="DimGray" Padding="10, 10" IsVisible="False" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All">
                <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                    <StackLayout Orientation="Vertical" HeightRequest="400" WidthRequest="300" BackgroundColor="White">
                        <ListView x:Name="ListView_Subreddits" ItemTapped="ListView_Subreddits_ItemTapped">
                            <ListView.ItemsSource>
                                <x:Array Type="{x:Type x:String}"></x:Array>
                            </ListView.ItemsSource>
                        </ListView>
                    </StackLayout>
                </StackLayout>
                <ContentView.GestureRecognizers>
                    <TapGestureRecognizer Tapped="Popup_Subreddits_OutClick" />
                </ContentView.GestureRecognizers>
            </ContentView>
            <ContentView x:Name="Popup_BaconButton" BackgroundColor="#446"  Padding="75, 0, 0, 75" IsVisible="False" AbsoluteLayout.LayoutBounds="1, 0, .9, .9" AbsoluteLayout.LayoutFlags="All">
                <StackLayout VerticalOptions="Start"  HorizontalOptions="Center">
                    <StackLayout Orientation="Vertical" HeightRequest="600" WidthRequest="300" BackgroundColor="#0079D3">
                        <ListView x:Name="ListView_BaconButton" ItemTapped="ListView_BaconButton_ItemTapped">
                            <ListView.ItemTemplate>
                                <DataTemplate>
                                    <ImageCell Text="{Binding Name}" Detail="{Binding Detail}" ImageSource="{Binding ImageSrc}" TextColor="White" DetailColor="WhiteSmoke" />
                                </DataTemplate>
                            </ListView.ItemTemplate>
                        </ListView>
                    </StackLayout>
                </StackLayout>
                <ContentView.GestureRecognizers>
                    <TapGestureRecognizer Tapped="Popup_BaconButton_OutClick" />
                </ContentView.GestureRecognizers>
            </ContentView>
        </AbsoluteLayout>
    </ContentPage.Content>

</ContentPage>

Как вы можете видеть, он идентичен коду в моем вопросе, за исключением тех двух атрибутов, которые добавляются в определение ScrollView. Это все исправило.

Вот несколько скриншотов того, как это выглядит сейчас:

Answer 3

Что ж, проблема в том, что AbsoluteLayout выше ваших ScrollView.

Когда не задано никаких LayoutFlags и LayoutOptions, оно занимает все доступное пространство, которое заставляет его занимать весь экран,Когда вы добавляете ScrollView, он занимает весь экран, который как-то перехватывает события. Я хотел бы предложить вам удалить это AbsoluteLayout, так как я все равно не вижу в нем особого смысла, поэтому ваш макет будет выглядеть примерно так:

<ScrollView x:FieldModifier="public" x:Name="ScrollView_Main" Orientation="Vertical">
            <StackLayout x:Name="StackLayout_Main">
                <!-- Sort bar. -->
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="0" VerticalOptions="Start" BackgroundColor="LightGray" RowSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="2*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Label Grid.Column="0" Text="" FontSize="Small" VerticalOptions="End" Margin="2" x:Name="Label_PostsSinceLastRefresh" />
                        <Button x:Name="ButtonSort" Grid.Column="1" Text="" FontSize="Small" Clicked="ButtonSort_Clicked" />
                    </Grid>
                </Grid>
                <!-- Posts list goes here (generated). -->
                <StackLayout VerticalOptions="StartAndExpand" x:Name="StackLayout_Posts">

                </StackLayout>
            </StackLayout>
        </ScrollView>