Xamarin.Forms: лучший способ поймать нажатие на кнопку, когда есть объекты сверху (например, метка и другое изображение)

Question

в моем приложении у меня есть следующий макет:

Это грапчи c, онтоп - это метка, а онтоп - еще один график c (также с другой этикеткой). Теперь я все еще хочу, чтобы люди могли нажимать кнопку. Это уже вызвало выданный ярлык. Если вы нажмете на ярлык вместо кнопки позади, ничего не произойдет. Я обошел эту проблему, просто добавив обработчик двух кликов: один на кнопку, а другой на ярлык. Это был по крайней мере обходной путь. Но теперь я столкнулся с еще большей проблемой:

Вы можете видеть, что эти макеты находятся друг над другом. На данный момент невозможно нажать на кнопку, потому что есть две сетки, сшитые поверх eacher (одна, содержащая кнопку, другая, содержащая уведомление).

Только после удаления уведомления можно снова нажать кнопку. Но это c не вариант. Как сделать так, чтобы кнопка в фоновом режиме была кликабельной, даже если сверху есть что-то?

Это xaml:

<!--Grid for Button-->
        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="4*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <ImageButton
                     Aspect="AspectFit"
                     Grid.Column="1"
                     x:Name="btn_mymatches_mainmenu"
                     Source="btn_emptydummy.png" BackgroundColor="#00000000"/>
            <Label
                    Grid.Column="1"
                    FontFamily="arial"
                    TextColor="#272727"
                    Text="Meine Matches" 
                    HorizontalOptions="Center" 
                    VerticalOptions="Center"/>

        </Grid>

        <!--Top Level Grid for Notifybutton-->
        <Grid Grid.Row="1" >
            <Grid.RowDefinitions>
                <RowDefinition Height="0.5*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="2*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="4.5*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>


            <Image
                Aspect="AspectFit"
                Grid.Column="1"
                Grid.Row="1"
                Source="img_notify.png" />
            <Label
                    x:Name="label_notify_nr"
                    Grid.Column="1"
                    Grid.Row="1"
                    FontSize="16"
                    FontFamily="arial"
                    TextColor="#ffff"
                    Text="1" 
                    HorizontalOptions="Center" 
                    VerticalOptions="Center"/>

        </Grid>

Спасибо:)

Answer 1

Поскольку вы две кнопки в одной и той же ячейке, кнопка уведомления будет охватывать все пространство сетки.

В вашем случае было бы лучше использовать AbsoluteLayout

<StackLayout VerticalOptions="CenterAndExpand" HorizontalOptions="FillAndExpand">

        <AbsoluteLayout  AbsoluteLayout.LayoutBounds="1,1,1,.50" AbsoluteLayout.LayoutFlags="All"  Margin="10,10,10,10">
            <Frame Padding="0" Margin="20,20,20,20" BackgroundColor="Transparent" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="1,1,1,1">
                <Grid Grid.Row="1" >

                    <Grid.RowDefinitions>
                        <RowDefinition Height="60" />
                    </Grid.RowDefinitions>

                    <Frame Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" BackgroundColor="White" Padding="0" CornerRadius="30">

                        <Button Text="11111" Clicked="Button_Clicked"  BackgroundColor="LightBlue"/>

                    </Frame>


                </Grid>
            </Frame>

            <Frame   AbsoluteLayout.LayoutFlags="PositionProportional"  AbsoluteLayout.LayoutBounds=".8,-.2,50,50" Grid.Row="0" Grid.Column="2"   BackgroundColor="White" Padding="0" CornerRadius="30">

                <Button Text="1" Clicked="Button_Clicked_1"  BackgroundColor="Red" TextColor="White"/>

            </Frame>



        </AbsoluteLayout>



    </StackLayout>