时间戳

首页 > 解决方案 > 如何使 ScrollView 在 UWP 应用中支持鼠标滚动？

c# - 如何使 ScrollView 在 UWP 应用中支持鼠标滚动？

问题描述

我在我的 UWP 应用程序中使用 ScrollView。它支持触摸滚动，但不支持鼠标wheel scroll and drag scroll。

经过一些研究，我发现通过定义一个PointerWheelChanged事件，它可能会起作用。

XAML 代码：

 PointerWheelChanged="ScrollViewer_PointerWheelChanged"

C#代码： 

private void ScrollViewer_PointerWheelChanged(object sender, PointerRoutedEventArgs e)
{
    var scv = (ScrollViewer)sender;
    scv.ScrollToHorizontalOffset(scv.HorizontalOffset - e.Delta);
    e.Handled = true;
}

但我收到了一些错误信息：

PointerRoutedEventArgs'不包含'Delta'的定义，并且找不到接受'PointerRoutedEventArgs'类型的第一个参数的可访问扩展方法'Delta'

如何解决？谢谢！

我附上了所有 XAML 和 C# 代码供您参考，任何人都可以在您的 VS 中对其进行测试。

我可以看到水平滚动条并拖动它来移动按钮。我可以使用触摸来拖动按钮移动。但我不能使用鼠标滚轮或用鼠标拖动按钮。

<Page
x:Class="App1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

<Grid>
    <Canvas>
        <ScrollViewer  
        Width="400" 
        Height="150" 
        PointerWheelChanged="ScrollViewer_PointerWheelChanged"
        HorizontalScrollMode="Enabled" 
        HorizontalScrollBarVisibility="Visible" 
        VerticalScrollBarVisibility="Hidden">
            <StackPanel Orientation="Horizontal">
                <Button Width="200">Data 1
                </Button>
                <Button Width="200">Data 2
                </Button>
                <Button Width="200">Data 3
                </Button>
                <Button Width="200">Data 4
                </Button>
                <Button Width="200">Data 5
                </Button>
                <Button Width="200">Data 6
                </Button>
                <Button Width="200">Data 7
                </Button>
                <Button Width="200">Data 8
                </Button>
                <Button Width="200">Data 9
                </Button>
                <Button Width="200">Data 10
                </Button>
            </StackPanel>
        </ScrollViewer>
        <Rectangle  
        Width="200" 
        Height="135" 
        Canvas.Left="200" 
        Fill="Transparent" 
        Stroke="Red" 
        StrokeThickness="2"/>
    </Canvas>
</Grid>

C#代码：

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace App1
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private void ScrollViewer_PointerWheelChanged(object sender, PointerRoutedEventArgs e)
        {
            //ScrollViewer scv = (ScrollViewer)sender;
            //scv.ScrollToHorizontalOffset(scv.HorizontalOffset - e.Delta);
            //e.Handled = true;
            Debug.WriteLine("wheel changed................");
        }
    }
}

标签： c#xamluwp

解决方案

我在我的 UWP 应用程序中使用 ScrollView。并且它支持触摸滚动，但不支持鼠标滚轮滚动和拖动滚动。

UWPScrollViewer允许您使用鼠标滚轮滚动内容。我在上面测试了你的代码，它运行良好。使用鼠标滚轮时，请将光标悬停在ScrollViewer（矩形上方会覆盖部分ScrollViewer）。如果您只想水平滚动，则需要禁用垂直滚动。并且drag scroll行为仅适用于触摸设备。

<ScrollViewer
    Width="400"
    Height="150"
    HorizontalScrollBarVisibility="Visible"
    HorizontalScrollMode="Enabled"
    VerticalScrollBarVisibility="Hidden"
    VerticalScrollMode="Disabled"
    >

推荐阅读