使用虚拟面板和水平项目控制滚动垂直项目控制，虚拟面板作为行子项

本文介绍了使用虚拟面板和水平项目控制滚动垂直项目控制，虚拟面板作为行子项的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我写了一个自定义虚拟固定高度自定义面板。效果很棒！但是我的行数很多，包含大量数据。所以我也必须虚拟化行。我不确定将水平滚动事件转发到子虚拟面板的最佳方式。

父垂直模板

< ItemsControl x：Name =" PART_DataRowItemsControl" VirtualizingStackPanel.VirtualizationMode =" Recycling" VirtualizingStackPanel.IsVirtualizing =" True" ClipToBounds =" True" ItemsSource =" {TemplateBinding RowData}" ScrollViewer.CanContentScroll =" True"> < ItemsControl.ItemsPanel> < ItemsPanelTemplate> < ganttChart：FixedHeightVirtualItemsPanel TimeLineIncrementType =" {Binding TimeLineIncrementType}" StartTime =" {Binding StartTime}" EndTime =" {Binding EndTime}" PixelsBetweenTimeIncrements =" {Binding PixelsBetweenTimeIncrements}" RowHeight =" {Binding DataContext.RowHeight，ElementName = PART_DataRowItemsControl}" /> < / ItemsPanelTemplate> < /ItemsControl.ItemsPanel> < ItemsControl.Template> < ControlTemplate> < Border BorderThickness =" {TemplateBinding Border.BorderThickness}" Padding =" {TemplateBinding Control.Padding}" BorderBrush =" {TemplateBinding Border.BorderBrush}" Background =" {TemplateBinding Panel.Background}" SnapsToDevicePixels =" True"> < ScrollViewer Horizo​​ntalScrollBarVisibility =" Auto" VerticalScrollBarVisibility =" Auto" Padding =" {TemplateBinding Control.Padding}" Focusable =" False"> < ItemsPresenter SnapsToDevicePixels =" {TemplateBinding UIElement.SnapsToDevicePixels}" /> < / ScrollViewer> < / Border> < / ControlTemplate> < /ItemsControl.Template> < / ItemsControl>

水平模板

< ; ganttChart：GanttRowItemDisplay Visibility =" {Binding DisplayDetails，Converter = {StaticResource InvertedBooleanToVisibilityConverter}}" NumRows =" {Binding NumRows}" StartTime =" {Binding StartTime}" EndTime =" {Binding EndTime}" ItemsSource =" {Binding RowItems}"> < ganttChart：GanttRowItemDisplay.ItemsPanel> < ItemsPanelTemplate> < ganttChart：GanttRowItemPanel RowHeight =" {Binding RowHeight}" TimeLineIncrementType =" {Binding TimeLineIncrementType}" StartTime =" {Binding StartTime}" EndTime =" {Binding EndTime}" PixelsBetweenTimeIncrements =" {Binding PixelsBetweenTimeIncrements}" /> < / ItemsPanelTemplate> < / ganttChart：GanttRowItemDisplay.ItemsPanel> < / ganttChart：GanttRowItemDisplay>

自定义项控件用于拖放。垂直也有一个，但我把它作为测试的标准项目控件。

此控件的上一次迭代没有水平行的虚拟化，所以父级的水平滚动不是问题，但现在由于面板控制滚动我没有办法显示超过视口宽度而不知道如何告诉子面板可以水平滚动。我使用从网上某处抓取的行为来实现此目的，以便将行标题保持在单独的位置。项目列控制同步，但模板位于单独的文件中。我猜测有一种方法可以从顶部面板中的setHorizo​​ntal偏移处理程序转发滚动事件，但不知道如何做到这一点。请帮助！

解决方案

在IScrollInfo.SetHorizo​​ntalOffset实现中的父自定义项控件中，我循环访问子项的面板，然后调用SetHorizo​​ntalOffset。这似乎有效，但希望有一个更好的内置方式来做到这一点。 希望有人能在自定义控件中获得更好的答案。实际上我所做的一切都应该是一个内置功能......

I wrote a custom virtual fixed height custom panel. Works great! However I have very wide rows with a lot of data. So I'm having to virtualize the rows as well. I'm not sure the best way to forward horizontal scroll events to the child virtual panel.

Parent Vertical template

<ItemsControl x:Name="PART_DataRowItemsControl" VirtualizingStackPanel.VirtualizationMode="Recycling" VirtualizingStackPanel.IsVirtualizing="True" ClipToBounds="True" ItemsSource="{TemplateBinding RowData}" ScrollViewer.CanContentScroll="True"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <ganttChart:FixedHeightVirtualItemsPanel TimeLineIncrementType="{Binding TimeLineIncrementType}" StartTime="{Binding StartTime}" EndTime="{Binding EndTime}" PixelsBetweenTimeIncrements="{Binding PixelsBetweenTimeIncrements}" RowHeight="{Binding DataContext.RowHeight, ElementName=PART_DataRowItemsControl}" /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.Template> <ControlTemplate> <Border BorderThickness="{TemplateBinding Border.BorderThickness}" Padding="{TemplateBinding Control.Padding}" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" SnapsToDevicePixels="True"> <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Padding="{TemplateBinding Control.Padding}" Focusable="False"> <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" /> </ScrollViewer> </Border> </ControlTemplate> </ItemsControl.Template> </ItemsControl>

Horizontal Template

<ganttChart:GanttRowItemDisplay Visibility="{Binding DisplayDetails, Converter={StaticResource InvertedBooleanToVisibilityConverter}}" NumRows="{Binding NumRows}" StartTime="{Binding StartTime}" EndTime="{Binding EndTime}" ItemsSource="{Binding RowItems}"> <ganttChart:GanttRowItemDisplay.ItemsPanel> <ItemsPanelTemplate> <ganttChart:GanttRowItemPanel RowHeight="{Binding RowHeight}" TimeLineIncrementType="{Binding TimeLineIncrementType}" StartTime="{Binding StartTime}" EndTime="{Binding EndTime}" PixelsBetweenTimeIncrements="{Binding PixelsBetweenTimeIncrements}" /> </ItemsPanelTemplate> </ganttChart:GanttRowItemDisplay.ItemsPanel> </ganttChart:GanttRowItemDisplay>

The custom items controls are for drag and drop. The vertical has one as well, but I made it a standard items control for testing.

The previous iteration of this control didn't have virtualization of the horizontal rows so the horizontal scrolling of the parent wasn't a problem, but now since the panels are in control of scrolling I have no way of showing more than the viewport width without somehow telling the child panels to scroll horizontal. I've achieved this using a behavior I grabbed from somewhere off the web for keeping the row headers in separate columns of items controls sync'ed but the templates are in separate files for this. I'm guessing there's a way to forward scroll events from the setHorizontal offset handler in the top panel, but not sure how to do that. Please help!

解决方案

In the parent custom items control in the implementation of IScrollInfo.SetHorizontalOffset I cycled through the children's panels and then called SetHorizontalOffset. This seems to work, but wish there was a better built in way to do this. Was hoping someone would have a better answer than having to do this in a custom control. Actually everything I'm doing should be a built in feature.....