TapGestureRecognizer 在 xamarin 表单中没有响应

Question

我遇到了一个非常奇怪的问题，试图首先捕捉屏幕上某些图像的点击，这是我的 xaml 代码，用于实现为视图的弹出窗口：

<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="NumbersRaceXamarin.YesNoPopupMessages">
  <ContentView.Content>
    <RelativeLayout HeightRequest="190" WidthRequest="280">
      <Image x:Name="bg" Source="compbar_01.png" Aspect="Fill" HeightRequest="190" WidthRequest="330" Opacity="0.9" InputTransparent ="true"/>
      <StackLayout WidthRequest="280" Spacing="0" RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width , Factor=0.1,Constant=0}" RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height , Factor=0.02,Constant=0}">
        <Label x:Name="message" FontSize="15"></Label>
        <StackLayout WidthRequest="70" HeightRequest="30" Orientation="Horizontal" HorizontalOptions="Center"> 
          <RelativeLayout WidthRequest="30" HeightRequest="30" VerticalOptions="Center">
            <Image x:Name="minus" Source="startbottuns_01.png" Aspect="Fill" HeightRequest="30" WidthRequest="30"/>
            <Label  x:Name="minusTB" Text="-" FontSize="16" HeightRequest="30" WidthRequest="30" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"></Label>
          </RelativeLayout>
          <Label  x:Name="qtyTB" Text="1" FontSize="8" HeightRequest="30" WidthRequest="30" BackgroundColor="White" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"></Label>
          <RelativeLayout WidthRequest="30" HeightRequest="30" VerticalOptions="Center">
            <Image x:Name="plus" Source="startbottuns_01.png" Aspect="Fill" HeightRequest="30" WidthRequest="30" IsEnabled="true"/>

            <Label  x:Name="plusTB" Text="+" FontSize="16" HeightRequest="30" WidthRequest="30" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"></Label>
          </RelativeLayout>
        </StackLayout>
        <StackLayout x:Name="coinAmountSeg" HeightRequest="40" WidthRequest="90" Orientation="Horizontal"  HorizontalOptions="Center" IsVisible="true">
            <Label x:Name="coinsAmountTB"  Text="1200"  HeightRequest="35" WidthRequest="40" VerticalTextAlignment="Center" HorizontalTextAlignment="End"/>
            <Image x:Name="coinsPackIM" Source="coins_01.png"  HeightRequest="35" WidthRequest="25"/>

          </StackLayout>
           <StackLayout x:Name="yesNoBtSeg" HeightRequest="32" WidthRequest="150" Orientation="Horizontal"  HorizontalOptions="Center" IsVisible="true">
                <RelativeLayout  HorizontalOptions="Center" >   
                     <Image x:Name="yesBt" x:Uid="yesBt" Source="startbottuns_01.png" Aspect="Fill" HeightRequest="32" WidthRequest="80"></Image>
                     <Label  x:Name="yesTB" Text="OK" FontSize="20" HeightRequest="32" TextColor="Yellow" WidthRequest="80" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"></Label>
                </RelativeLayout >

                <RelativeLayout HorizontalOptions="Center" >   
                     <Image x:Name="noBt" x:Uid="noBt" Source="startbottuns_01.png" Aspect="Fill" HeightRequest="32" WidthRequest="80"></Image>
                     <Label  x:Name="noTB" Text="CANCEL" FontSize="20" HeightRequest="32" TextColor="Yellow" WidthRequest="80" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"></Label>
                </RelativeLayout>

          </StackLayout>
      </StackLayout>
    </RelativeLayout>
  </ContentView.Content>
</ContentView>

以下是我尝试从 plus 和 minus ok 中捕获事件并取消图像的方法：

    var minusTap = new TapGestureRecognizer();
    var plusTap = new TapGestureRecognizer();
    var okTap = new TapGestureRecognizer();
    var cancelTap = new TapGestureRecognizer();

    minusTap.Tapped += minusBtn_Click;
    plusTap.Tapped += plusBtn_Click;
    okTap.Tapped += okBtn_Click;
    cancelTap.Tapped += cancelBtn_Click;
    noBt.GestureRecognizers.Add(cancelTap);
    plus.GestureRecognizers.Add(plusTap);
    minus.GestureRecognizers.Add(minusTap);
    yesBt.GestureRecognizers.Add(okTap);
private void okBtn_Click(object sender, EventArgs e)
{
    tcs.SetResult(1);
}
private void cancelBtn_Click(object sender, EventArgs e)
{
    tcs.SetResult(0);
}
private void minusBtn_Click(object sender, EventArgs e)
{
    if (int.Parse(qtyTB.Text) > 1)
    {
        coinsAmountTB.Text = "" + (int.Parse(coinsAmountTB.Text) - itemCost);
        qtyTB.Text = (int.Parse(qtyTB.Text) - 1) + "";
    }
}
private void plusBtn_Click(object sender, EventArgs e)
{
    if (int.Parse(qtyTB.Text) < max)
    {
        coinsAmountTB.Text = "" + (int.Parse(coinsAmountTB.Text) + itemCost);
        qtyTB.Text = (int.Parse(qtyTB.Text) + 1) + "";
    }
}

问题真的很奇怪，点击事件在确定取消和减号按钮上工作正常，但由于某种原因在点击加号图像时不会触发。

我认为某些东西重叠并“窃取”了加号按钮上的点击，但我找不到类似的东西。 顺便说一句，我在 android 上尝试这个，而不是在其他设备上尝试。 有人知道这是如何发生的以及为什么会发生吗？

Answer 1

好的，所以我发现了一个愚蠢的问题，以为我会分享我的解决方案，以防万一有人遇到同样的问题。 问题是包含按钮的堆栈布局的宽度小于它包含的元素，因此在这种情况下，最后一个元素加号超出了堆栈布局的范围，导致它无法获得点击手势

<StackLayout WidthRequest="70" HeightRequest="30" Orientation="Horizontal" HorizontalOptions="Center"> 
         <RelativeLayout WidthRequest="30" HeightRequest="30" VerticalOptions="Center">

这里我只是将 WidthRequest 更改为 100 而不是 70，因为它有 3 个元素，每个元素宽度为 30。

希望这对某人有所帮助

Answer 2

我遇到了同样的问题，也是由于父元素的大小小于启用点击的子元素。

就我而言，我在另一个绝对布局 (Outer) 中有一个绝对布局 (Inner)。然后，我以编程方式将支持点击的子元素添加到代码隐藏中的Inner。

<AbsoluteLayout x:Name="Outer">
    <AbsoluteLayout x:Name="Inner" />
</AbsoluteLayout>

因为Inner 没有指定AbsoluteLayout.LayoutBounds，所以交互循环似乎忽略了孩子。这对我来说并不明显，因为子元素是可见的。

这行得通：

<AbsoluteLayout x:Name="Outer">
    <AbsoluteLayout x:Name="Inner"
                    AbsoluteLayout.LayoutBounds="0, 0, 1, 1"
                    AbsoluteLayout.LayoutFlags="All" />
</AbsoluteLayout>

但是，我最终将点击目标元素放在了 Outer 容器中，这也解决了问题，因为 Outer 被 ContentPage 包围。