WPF嵌套的ScrollViewer具有不同的PanningModes？

Question

我正在尝试创建一个类似于macOS Finder的列视图的触摸屏界面，该列视图是一系列水平堆叠的列表，其中每个列表都可以单独（垂直）滚动，整个内容可以水平滚动，如下所示：< / p>

这是我的.NET 4.6.1“最小可行代码示例”，以演示我在做什么：

前端：

<Window x:Class="TestNestedScroll.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestNestedScroll"
    Title="MainWindow" Height="500" Width="800"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">

    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled" PanningMode="HorizontalOnly">
        <ItemsControl ItemsSource="{Binding Columns}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" PanningMode="VerticalOnly">
                        <ItemsControl ItemsSource="{Binding Rows}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Rectangle Width="300" Height="100" Fill="Purple" Margin="20"/>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </ScrollViewer>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>

    </ScrollViewer>
</Window>

后端：

using System.Collections.Generic;
using System.Linq;
using System.Windows;

namespace TestNestedScroll
{
    public partial class MainWindow : Window
    {
        public class Row {}

        public class Column { public List<Row> Rows { get; } = Enumerable.Repeat( new Row(), 20 ).ToList(); }

        public List<Column> Columns { get; } = Enumerable.Repeat( new Column(), 10 ).ToList();

        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

现在，我只能使它以一种方式工作-在内部滚动查看器上关闭PanningMode，然后向左右滚动外部ScrollViewer，或者设置{{内部滚动查看器上的1}}（或PanningMode="VerticalOnly"或Both无关紧要），它们可以分别垂直滚动，但是水平VerticalFirst停止工作。

有没有办法使这项工作有效？也许内部ScrollViewer上的水平触摸事件必须被捕获，并以某种方式手动冒泡到父ScrollViewers上-我该怎么做？

Answer 1

我为您提供了一个小错误的解决方案。您必须“触摸向上”才能切换@ViewChild('userTable') userTable: PaginatedTableComponent; // NOT @ViewChild('PaginatedTableComponent') 。 也许您可以找到无需再次执行“ Touch Up”就可以运行的错误。

---

更改父级PanningMode的{​​{1}}之后，PanningMode事件不再路由到内部子级ScrollViewer。因此，我还尝试将触摸事件路由回父Touch。也许我的逻辑上有一个错误。

ScrollViewer

---

ScrollViewer

预览