Question

我无法让以下工作：我有一个水平滚动视图，其中放置了一个网格。我希望网格接收平移手势。

我的XAML：

<ScrollView Orientation="Horizontal" VerticalOptions="Center">
        <Grid RowSpacing="3" VerticalOptions="Center" BackgroundColor="Red" Padding="10">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="30" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100" />
                        <ColumnDefinition Width="30" />
                        <ColumnDefinition Width="100" />
                        <ColumnDefinition Width="30" />
                        <ColumnDefinition Width="100" />
                        <ColumnDefinition Width="30" />
                        <ColumnDefinition Width="100" />
                        <ColumnDefinition Width="30" />
                        <ColumnDefinition Width="100" />
                        <ColumnDefinition Width="30" />
                        <ColumnDefinition Width="100" />
                    </Grid.ColumnDefinitions>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="party.png" Grid.Row="0" Grid.Column="0" WidthRequest="30" HeightRequest="30"></Image>
                    <Label Grid.Row="1" Grid.Column="0" HorizontalTextAlignment="Center" FontAttributes="Bold" Text="AUSGEHEN" TextColor="#646464" />

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sep.png" Grid.RowSpan="2" Grid.Column="1" WidthRequest="1" HeightRequest="10"></Image>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="contacts.png" Grid.Row="0" Grid.Column="2"  WidthRequest="30" HeightRequest="30"></Image>
                    <Label VerticalTextAlignment="Start" HorizontalTextAlignment="Center" FontAttributes="Bold" Grid.Row="1" Grid.Column="2" Text="KONTAKTE" TextColor="#646464" />

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sep.png" Grid.RowSpan="2" Grid.Column="3" WidthRequest="1" HeightRequest="10"></Image>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sports.png" Grid.Row="0" Grid.Column="4"  WidthRequest="30" HeightRequest="30"></Image>
                    <Label VerticalTextAlignment="Start" HorizontalTextAlignment="Center" FontAttributes="Bold" Grid.Row="1" Grid.Column="4" Text="SPORT" TextColor="#646464" />

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sep.png" Grid.RowSpan="2" Grid.Column="5" WidthRequest="1" HeightRequest="10"></Image>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="dating.png" Grid.Row="0" Grid.Column="6"  WidthRequest="30" HeightRequest="30"></Image>
                    <Label VerticalTextAlignment="Start" HorizontalTextAlignment="Center" FontAttributes="Bold" Grid.Row="1" Grid.Column="6" Text="DATING" TextColor="#646464" />

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sep.png" Grid.RowSpan="2" Grid.Column="7" WidthRequest="1" HeightRequest="10"></Image>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="culture.png" Grid.Row="0" Grid.Column="8"  WidthRequest="30" HeightRequest="30"></Image>
                    <Label VerticalTextAlignment="Start" HorizontalTextAlignment="Center" FontAttributes="Bold" Grid.Row="1" Grid.Column="8" Text="KULTUR" TextColor="#646464" />

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="sep.png" Grid.RowSpan="2" Grid.Column="9" WidthRequest="1" HeightRequest="10"></Image>

                    <Image Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Source="food.png" Grid.Row="0" Grid.Column="10"  WidthRequest="30" HeightRequest="30"></Image>
                    <Label VerticalTextAlignment="Start" HorizontalTextAlignment="Center" FontAttributes="Bold" Grid.Row="1" Grid.Column="10" Text="ESSEN" TextColor="#646464" />
                    <Grid.GestureRecognizers>
                        <PanGestureRecognizer PanUpdated="OnPanUpdated" />
                    </Grid.GestureRecognizers>
                </Grid>
            </ScrollView>

问题是滚动视图＆＃34;吞下＆＃34;垂直滑动手势。这意味着＆＃34; OnPanUpdated＆＃34;滚动视图水平滚动时不调用。如果我小心地向上/向下滑动而不水平移动滚动视图，＆＃34; OnPanUpdated＆＃34;被称为。

我基本上想要实现的是，如果我在滚动视图内的网格上向上或向下滑动＆＃34; OnPunUpdated＆＃34;应该叫。如果我水平滑动，我希望滚动视图正常水平滚动。如果两者都被称为＆＃34; OnPunUpdated＆＃34;我都不会在意。我一刷过它就打电话。

我为Android尝试了几个自定义渲染器，但没有运气。

如果有人找到时间帮助我解决问题，我将非常感激。

注意：仅在Android上测试过。

Answer 1

有一个水平滚动视图，我想用平移手势向上滑动。当用户向左或向右滑动时，应触发滚动视图以及向上或向下滑动

您可以create a Pan Container并将ScrollView放入此Container：

public class PanContainer : ContentView
{
    double x, y;

    public PanContainer()
    {
        // Set PanGestureRecognizer.TouchPoints to control the 
        // number of touch points needed to pan
        var panGesture = new PanGestureRecognizer();
        panGesture.PanUpdated += OnPanUpdated;
        GestureRecognizers.Add(panGesture);
    }

    void OnPanUpdated(object sender, PanUpdatedEventArgs e)
    {
        switch (e.StatusType)
        {

            case GestureStatus.Running:
                // Translate and ensure we don't pan beyond the wrapped user interface element bounds.
                Content.TranslationX = Math.Max(Math.Min(0, x + e.TotalX), -Math.Abs(Content.Width - App.ScreenWidth));
                Content.TranslationY = Math.Max(Math.Min(0, y + e.TotalY), -Math.Abs(Content.Height - App.ScreenHeight));
                break;

            case GestureStatus.Completed:
                // Store the translation applied during the pan
                x = Content.TranslationX;
                y = Content.TranslationY;
                break;
        }
    }
}

在.xaml：

中

<ContentPage.Content>
    <local:PanContainer>
        <ScrollView Orientation="Horizontal" VerticalOptions="Center">
            ...

        </ScrollView>
    </local:PanContainer>
</ContentPage.Content>

Effect

Xamarin：Scrollview内部的PanGestureRecognizer（Android）

1 个答案: