UWP：在列表内滚动时如何防止页面级滚动反弹效果？答案

【问题标题】：UWP: how to prevent page-level scroll bounce effect when scrolling inside a list?UWP：在列表内滚动时如何防止页面级滚动反弹效果？
【发布时间】：2017-12-06 14:05:14
【问题描述】：

我有以下简单的 XAML 页面设置：

<Page ...>
    <ScrollViewer>
        <StackPanel>
            <Border Height="100">
                <TextBlock Text="Block 1" />
            </Border>
            <ListView Height="200">
                <ListViewItem Content="Lorem" />
                <ListViewItem Content="Ipsum" />
                <ListViewItem Content="Lorem" />
                <ListViewItem Content="Ipsum" />
                <ListViewItem Content="Lorem" />
                <ListViewItem Content="Ipsum" />
            </ListView>
            <Border Height="800">
                <TextBlock Text="Block 2" />
            </Border>
        </StackPanel>
    </ScrollViewer>
</Page>

通常情况下，当用户滚动到页面的顶部/底部时，顶级ScrollViewer 提供的滚动“反弹”效果通常让我很满意。但是，当在 ListView 内滚动时，我得到一个 double-bounce;即，ListView 和 ScrollViewer 都提供弹性拉伸。我觉得发生这种情况是一种奇怪的用户体验。

有什么方法可以保持 ListView 的反弹，同时防止它传递到父滚动容器？

【问题讨论】：

标签： user-interface uwp

【解决方案1】：

这种情况只发生在触摸输入上而不是鼠标输入上，可能有很多方法，但它是最快和简单的方法。

这会起作用

XAML

<ScrollViewer Name="sv"> <!-- Name added -->
    <StackPanel>
        <Border Height="100">
            <TextBlock Text="Block 1" />
        </Border>
        <ListView Name="lv" Height="200"> <!-- Name added -->
            <ListViewItem Content="Lorem" />
            <ListViewItem Content="Ipsum" />
            <ListViewItem Content="Lorem" />
            <ListViewItem Content="Ipsum" />
            <ListViewItem Content="Lorem" />
            <ListViewItem Content="Ipsum" />
        </ListView>
        <Border Height="800">
            <TextBlock Text="Block 2" />
        </Border>
    </StackPanel>
</ScrollViewer>

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
        //Add this two event handlers and you can add this event handler from xaml also.
        lv.AddHandler(UIElement.PointerEnteredEvent, new PointerEventHandler(OnPointerEntered), true);
        lv.AddHandler(UIElement.PointerExitedEvent, new PointerEventHandler(OnPointerExited), true);            
    }

    private void OnPointerEntered(object sender, PointerRoutedEventArgs e)
    {
        sv.VerticalScrollMode = ScrollMode.Disabled;
    }

    private void OnPointerExited(object sender, PointerRoutedEventArgs e)
    {
        sv.VerticalScrollMode = ScrollMode.Enabled;
    }
}

【讨论】：

这只有一半有效。 PointerEntered 事件被调用，但PointerExited 未被调用。我做了一些测试，没有调用 PointerReleased 和 PointerCanceled 事件。我还尝试了各种ManipulationXxx 事件，但它们没有被调用。有什么想法吗？
@BCA 这是因为如果你滑动或滚动列表，指针永远不会退出离开你的手指或指针，简而言之，直到你没有点击任何项目，这个事件不会触发，但你可以找到另一种方法重新启用滚动模式
我不会无限期地把手指留在名单上。但是当我松开手指滚动列表时，不会触发 PointerXxx 事件。