TapGestureRecognizer 超出范围不起作用

Question

我正在尝试实现一个带有 5 个标签的小 GridView：

• “设置 1”
• “设置 2”
• “更多设置”
• “设置 4”
• “设置 5”

每个标签都附加到 TapGestureRecognizer。

一开始你看不到设置 4 和 5，它们在屏幕下方。

如果您按下"More settings" 标签/按钮，则通过使用“LayoutTo”向上推动整个 Grid，最后两个设置变得可见。

• “设置 1”
• “设置 2”
• “设置 4”
• “设置 5”

现在我的问题是最后两个标签的最后两个 TapGestureRecognizer 不起作用。 我在这里找到了有类似问题的人： https://forums.xamarin.com/discussion/36094/offscreen-tapgesturerecognizer-not-firing。

我尝试了这篇文章中的所有内容，我将主布局更改为 AbsoluteLayout 并使用 LayoutTo 而不是 TranslateTo，但它仍然不起作用。

如果有人知道如何让这些TapGestureRecognizers 工作，或者如何解决我的问题，即用一点动画“拖出”我的 GridView 条目但不必依赖于将内容置于屏幕边界之外，我会很开心。

这是我的一些 xaml 代码：

<AbsoluteLayout x:Name="rellay">
<Grid x:Name="MainGrid" 
        AbsoluteLayout.LayoutBounds="0, 0, 1, .9" AbsoluteLayout.LayoutFlags="SizeProportional">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition x:Name="MapRow" Height="*" />
        <RowDefinition x:Name="DataRow" />
    </Grid.RowDefinitions>
    <maps:Map x:Name="map" Grid.Row="0" />
    <Grid RowSpacing="0" ColumnSpacing="0" x:Name="SecondGrid" Grid.Row="1">
        <Grid.RowDefinitions>
            <RowDefinition Height="62" x:Name="StartRow" />
            <RowDefinition Height="62" x:Name="DestRow" />
            <RowDefinition Height="62" x:Name="OptRow" />
            <RowDefinition Height="62" x:Name="NameRow" />
            <RowDefinition Height="62" x:Name="PhoneRow" />
            <RowDefinition Height="62" x:Name="ZeitRow" />
            <RowDefinition Height="62" x:Name="DetailsRow" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="40" />
            <ColumnDefinition Width="1" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="40" />
        </Grid.ColumnDefinitions>

... (labels and TapGestureRecognizers)

页面构造器：

DataRow.Height = 3 * 62;

“拖出按钮”：

OptRow.Height = 0;
rellay.LayoutTo(new Rectangle(0, -3 * 62, rellay.Width, rellay.Height), 250, Easing.Linear);

我还尝试将诸如条目之类的东西直接放入边界之外的 AbsoluteLayout（没有网格）中，然后使用 LayoutTo 将其向上推，但它也不起作用，在这种情况下，条目是“死的”。

Answer 1

您的最后两个标签放置在 MainGrid 中，但您将其 LayoutBounds 的高度设置为 0.9。这可能会让这两个标签在MainGrid 之外。即使在LayoutTo()AbsoluteLayout 时可以看到它们，但无法控制底部区域。这就是为什么你把它改成entry，也不能动。

您可以尝试扩大rellay 的高度：rellay.LayoutTo(new Rectangle(0, -3 * 62, rellay.Width, rellay.Height + 3 * 62), 250, Easing.Linear); 以让这两个标签接触。但我真的建议你使用ScrollView。

创建自定义滚动视图：

public class MyScrollView : ScrollView
{
}

然后使用这个控件包装AbsoluteLayout

<local:MyScrollView x:Name="MyScroll">
    ...put your other controls here
</local:MyScrollView>

当你想显示标签时，使用：

MyScroll.ScrollToAsync(0, 62 * 3, true);

最后，如果你想在触摸和拖动时禁用它的滚动，创建一个Custom Renderer来实现这个：

[assembly: ExportRenderer(typeof(MyScrollView), typeof(MyScrollRenderer))]
namespace ExpandLayoutDemo.iOS
{
    public class MyScrollRenderer : ScrollViewRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            ScrollEnabled = false;
        }
    }
}