Мотыга, чтобы сделать ImageButton с ярлыком на верхней части кликабельной

Question

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

Это здесь для isntance происходит из этого кода (частично):

<!--Grid for button-->
<Grid Grid.Row="1" >
      <ImageButton
           x:Name="btn_register_mainpage"
           Source="btn_emptydummy.png" BackgroundColor="#00000000"/>
      <Label
          FontFamily="arial"
          TextColor="#272727"
          Text="Profil erstellen" 
          HorizontalOptions="Center" 
          VerticalOptions="Center"/>
</Grid>

Теперь, это работает просто отлично, если только вы не хотите щелкнуть по нему. Как вы можете видеть, я дал кнопке имя, теперь я могу поймать это имя в коде и передать ему клик:

btn_register_mainpage.Clicked += async delegate
{
      await Navigation.PushAsync(new Screen_EditInformation());
};

Однако, это работает только тогда, когда пользователь нажимает кнопку - но НЕ на ярлыке, поскольку он находится сверху и ему не назначен щелчок.

Итак, я мог бы просто назначить одно и то же событие щелчка обоим объектам (метке и кнопке изображения), но это выглядит довольно необычно.

Каков наилучший способ создания настраиваемого изображения в виде кнопки с надписью, которую можно нажимать?

Answer 1

Вы можете добавить GestureRecognizers к любому элементу управления в Xamarin.Forms. В вашем случае вы можете добавить один в макет Grid

YourView.xaml

<Grid Grid.Row="1" >
    <Grid.GestureRecognizers>
        <TapGestureRecognizer
            Tapped="OnTapGestureRecognizerTapped"
            NumberOfTapsRequired="1" />
    </Grid.GestureRecognizers>
    <ImageButton
        x:Name="btn_register_mainpage"
        Source="btn_emptydummy.png" BackgroundColor="#00000000"/>
    <Label
        FontFamily="arial"
        TextColor="#272727"
        Text="Profil erstellen" 
        HorizontalOptions="Center" 
        VerticalOptions="Center"/>
</Grid>

YourView.xaml.cs

private void OnTapGestureRecognizerTapped(object sender, EventArgs e)
{
    Navigation.PushAsync(new Screen_EditInformation());
}

Answer 2

Вы можете добавить TapGestureRecognizer на этикетке.

<Grid Grid.Row="1" >

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>

            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="40"/>
            </Grid.RowDefinitions>

            <ImageButton
                Clicked="Button_Clicked"
                Grid.Row="0"
                        x:Name="btn_register_mainpage"
                         BackgroundColor="LightBlue"/>
            <Label
                Grid.Row="0"
                        FontFamily="arial"
                        TextColor="#272727"
                        Text="Profil erstellen" 
                        HorizontalOptions="Center" 
                        VerticalOptions="Center">

                <Label.GestureRecognizers>
                    <TapGestureRecognizer
            Tapped="Button_Clicked"
            NumberOfTapsRequired="1" />
                </Label.GestureRecognizers>

            </Label>
        </Grid>