如何在 UWP 的滚动查看器中启用水平滚动和禁用垂直滚动？答案

【问题标题】：How do I enable horizontal scroll and disable vertical scroll within a scrollviewer in UWP?如何在 UWP 的滚动查看器中启用水平滚动和禁用垂直滚动？
【发布时间】：2019-09-27 04:13:44
【问题描述】：

这是我开始使用的 XAML：

<ScrollViewer Height="500"
              Width="500"
              Name="parentScrollViewer">
        <StackPanel>
            <Grid Height="300"
                  Background="Red" />

            <ScrollViewer Width="500"
                          HorizontalScrollBarVisibility="Auto"
                          Name="childScrollViewer">
                <Grid Height="300"
                      Width="600"
                      Background="Green"/>
            </ScrollViewer>
            <Grid Height="300"
                  Background="Blue" />        
        </StackPanel>
</ScrollViewer>

基本上，如果我禁用 childScrollViewer 上的所有滚动，我会得到我想要的垂直效果（parentScrollViewer 可以滚动浏览所有内容），但如果我启用 childScrollViewer 上的水平滚动（以获得正确的水平效果），我会失去我想要的垂直效果。

我真的不在乎是否必须让每个人都使用滚动条才能水平滚动，但如果我不必这样做，那将是一个奖励。

我找到了this 帖子，这似乎是我正在寻找的，但我无法找出 UWP 等效项（也许将 PointerWheelChanged 事件重定向到 parentScrollViewer？）

另外，我研究了当且仅当滚动条被触摸（或鼠标按下）时才启用水平滚动，但我找不到要监听的正确事件。

【问题讨论】：

标签： uwp-xaml

【解决方案1】：

我找到了一个我感觉很好的解决方案，但我不会标记它（至少暂时），希望有人有更好的解决方案。

我刚刚添加了一个高度刚好足以显示滚动条的滚动查看器，并在触摸时启用了 childScrollViewer。

这是我的 XAML：

<ScrollViewer Height="500"
                  Width="500"
                  Name="parentScrollViewer">
        <StackPanel>
            <Grid Height="300"
                  Background="Red" />
            <ScrollViewer Width="500"
                          HorizontalScrollMode="Disabled"
                          HorizontalScrollBarVisibility="Hidden"
                          Name="childScrollViewer"
                          PointerPressed="ChildScrollViewer_PointerPressed"
                          PointerReleased="ChildScrollViewer_PointerReleased"
                          PointerExited="ChildScrollViewer_PointerReleased"
                          >

                <Grid Height="300"
                      Width="600"
                      Background="Green">
                    <TextBlock Text="left"
                               HorizontalTextAlignment="Left" />
                    <TextBlock Text="right"
                               HorizontalTextAlignment="Right" />

                </Grid>
            </ScrollViewer>
            <ScrollViewer Width="500"
                          HorizontalScrollBarVisibility="Auto"
                          Name="childScrollViewer2"
                          ViewChanged="ScrollViewer_ViewChanged">

                <Grid Height="16"
                      Width="600"
                      Background="Green">

                </Grid>
            </ScrollViewer>
            <Grid Height="300"
                  Background="Blue" />
        </StackPanel>
    </ScrollViewer>

这是我的 c#：

        private void ChildScrollViewer_PointerPressed(object sender, PointerRoutedEventArgs e)
        {
            childScrollViewer.HorizontalScrollMode = ScrollMode.Enabled;
        }

        private void ChildScrollViewer_PointerReleased(object sender, PointerRoutedEventArgs e)
        {
            childScrollViewer.HorizontalScrollMode = ScrollMode.Disabled;
        }

        private void ScrollViewer_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
        {
            if (!(sender is ScrollViewer s))
            {
                return;
            }
            childScrollViewer.HorizontalScrollMode = ScrollMode.Enabled;
            childScrollViewer.ChangeView(s.HorizontalOffset, null, null);
            childScrollViewer.HorizontalScrollMode = ScrollMode.Disabled;
        }

【讨论】：