Xamarin Forms 增加图像的命中区域

Posted

技术标签:

【中文标题】Xamarin Forms 增加图像的命中区域【英文标题】:Xamarin Forms Increase Hit Area of Image 【发布时间】:2016-04-14 19:13:01 【问题描述】:

我正在开发一个Xamarin.Forms 应用程序,其中我使用图像作为可点击图标来关闭弹出窗口。我通过TapGestureRecognizer 使图片可点击,如下所示:

<Image Source="x-icon.png" HeightRequest="15" WidthRequest="15">
  <Image.GestureRecognizers>
    <TapGestureRecognizer Tapped="OnClosePopupTapped"/>
  </Image.GestureRecognizers>
</Image>

xaml.cs 中的 OnClosePopupTapped 函数被正确命中。

我的问题是只有图片的左上角触发了这个功能(图片的命中区域不是全图)。

有谁知道将点击区域增加到完整图像而不是仅仅左上角的解决方案?

【问题讨论】:

【参考方案1】:

实现更大的点击框的一种简单方法是将图像包装在另一个控件中,例如&lt;StackLayout&gt;&lt;Frame&gt;,并为父级应用适当的填充。然后,将您的手势识别器应用于父级并将您的图像设置为 InputTransparent

应该是这样的:

  <Frame Padding="10">
    <Frame.GestureRecognizers>
      <TapGestureRecognizer Tapped="OnClosePopupTapped"/>
    </Frame.GestureRecognizers>

    <Image Source="x-icon.png" HeightRequest="15" WidthRequest="15" InputTransparent="True"/>
  </Frame>

InputTransparent 设置为 true 时会将输入传递给下面的元素,在本例中为 Frame

另外,我还没有亲自尝试过,但我认为最新的 Xamarin.Forms 支持图像按钮,这可能也是一个简单的解决方案:

<Button Image="x-icon.png" Command="OnClosePopopCommand"/>

【讨论】:

以上是关于Xamarin Forms 增加图像的命中区域的主要内容,如果未能解决你的问题,请参考以下文章

在 Xamarin Forms 自定义标签渲染器中,增加边界的大小

Xamarin.Forms ImageButton 不起作用,单击不起作用,调试断点仅在 iOS 上根本不会被命中

Xamarin.Forms - 创建新页面时 InitializeComponent 不存在

使用 Xamarin.Forms 应用程序填充 iPhone X 屏幕

使用Xamarin.Forms应用程序填充iPhone X屏幕

如何在内容页面中添加按钮以使用自定义渲染器 - 视图捕获图像