c# - 在 UWP 应用程序上滚动时禁用枢轴滑动

Question

我正在 Windows 10 平台上开发通用窗口应用程序，我的页面如下例所示:

主页包含一个枢轴控件，其中有 4 个枢轴项(PAGE 1、PAGE 2，...)。第 1 页包含一个红色堆栈面板，其中包含一个带水平滚动的 ListView 。

我的问题是，当我想水平滚动我的红色 ListView 时，我的轴滑动到下一页。我想在 ListView 滚动期间禁用枢轴滑动(但仅在 ListView 滚动期间)。

我尝试从 listview 获取 scrollviewer 并从 scrollviewer 监听 viewChange 以禁用 pivot 滑动但没有成功。一切正常，但将 IsHitTestVisible 设置为 false 似乎不起作用。这是我的代码:

ScrollViewer scrollViewer = ListViewHelper.GetScrollViewer(myListView);
scrollViewer.ViewChanged += scrollview_ViewChanged;

private void scrollview_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
    {
        var scrollviewer = sender as ScrollViewer;

        if (e.IsIntermediate)
        {
            mainPivot.IsHitTestVisible = false;
        } else
        {
            mainPivot.IsHitTestVisible = true;
        }
    }

还有我的 ListViewHelper 类:

public static class ListViewHelper
{
    public static ScrollViewer GetScrollViewer(this DependencyObject element)
    {
        if (element is ScrollViewer)
        {
            return (ScrollViewer)element;
        }

        for (int i = 0; i < VisualTreeHelper.GetChildrenCount(element); i++)
        {
            var child = VisualTreeHelper.GetChild(element, i);

            var result = GetScrollViewer(child);
            if (result == null)
            {
                continue;
            }
            else
            {
                return result;
            }
        }

        return null;
    }
}

还有我的 xaml 代码:

<Pivot  x:Name="mainPivot">

        <PivotItem x:Name="pivot1">

            <!-- Header -->
            <PivotItem.Header>
                <controls:TabHeader x:Uid="pivot1HeaderTitle"
                                    Label=""
                                    Glyph="&#xea34;"/>
            </PivotItem.Header>

            <!-- Content -->
            <Grid>

                <Grid.RowDefinitions>
                    <RowDefinition Height="110" />
                    <RowDefinition Height="30" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>

                <StackPanel     x:Name="localeEditionsFavory"
                                Grid.Row="0">

                    [...]

                    <!-- HERE is my listview -->
                    <ListView   x:Name="localeEditionsFavoryList"
                                Height="80"
                                ItemsSource="{Binding FavoritesItems}"
                               ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                ScrollViewer.HorizontalScrollMode="Enabled">

                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal">
                                </StackPanel>
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>

                        <ListView.ItemContainerStyle>
                            <Style TargetType="ListViewItem">
                                <Setter Property="Padding" Value="0,0,0,0" />
                                <Setter Property="Margin" Value="10" />
                                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                            </Style>
                        </ListView.ItemContainerStyle>

                        <ListView.ItemTemplate>
                            <DataTemplate>

                                <Grid   x:Name="favoryList">

                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="90" />
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="55" />
                                    </Grid.RowDefinitions>

                                    <Rectangle  x:Name="strokedasharray" 
                                                Grid.Column="0"
                                                Grid.Row="0"
                                                Fill="White"
                                                Opacity="0.2"
                                                RadiusX="5"
                                                RadiusY="5"/>

                                    <TextBlock  Grid.Column="0"
                                                Grid.Row="0"
                                                Text="{Binding FavoriteItem.EditionKey}" 
                                                TextWrapping="WrapWholeWords" 
                                                Height="auto"
                                                Foreground="White"
                                                FontSize="14"
                                                Margin="2" 
                                                HorizontalAlignment="Center"
                                                VerticalAlignment="Center" 
                                                TextTrimming="CharacterEllipsis" 
                                                TextAlignment="Center"/>

                                </Grid>

                            </DataTemplate>
                        </ListView.ItemTemplate>

                    </ListView>

                </StackPanel>

                [...]

                <ScrollViewer VerticalScrollMode="Auto" 
                              VerticalScrollBarVisibility="Auto"
                              Grid.Row="3">

                    <controls:NewsItemControl   x:Name="NewsListControl"
                                                Visibility="{Binding Busy, Converter={StaticResource InverseBoolToVisibilityConverter}}"/>

                </ScrollViewer>

            </Grid>

        </PivotItem>

        [...]

有没有人有解决这个问题的想法？

Answer 1

您看到的不良行为是滚动链接的结果。 ListView 和 Pivot 在它们的控件模板中都包含 ScrollViewers，这使得这是一个嵌套的 ScrollViewer 情况。当您有一个包含在另一个树中的 ScrollViewer 并尝试通过触摸滚动超出内部 ScrollViewer 的范围时，外部 ScrollViewer 会参与并开始滚动。

在禁用链接的情况下，您只能通过在外部 ScrollViewer 的可 HitTest 区域开始操作来滚动外部 ScrollViewer。默认情况下，ScrollViewer 启用链接，因此当您尝试滚动到列表末尾时，链接将启动并被 Pivot 识别为尝试“滚动”到下一个 pivot 项目。

通过设置 ScrollViewer.IsHorizo​​ntalScrollChainingEnabled="False" 附加属性禁用 ListView 的 ScrollViewer 上的链接(并删除代码后面的 ListViewHelper 内容):

                <!-- HERE is my listview -->
                <ListView   x:Name="localeEditionsFavoryList"
                            Height="80"
                            ItemsSource="{Binding FavoritesItems}"
                            ScrollViewer.IsHorizontalScrollChainingEnabled="False"
                            ScrollViewer.HorizontalScrollBarVisibility="Auto"
                            ScrollViewer.HorizontalScrollMode="Enabled">