none
Scrolling vertical Items Control with Virtual Panel and horizontal items control with virtual panel as a row child

    Question

  • 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!

    Friday, September 21, 2018 4:05 PM

All replies

  • 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.....
    Friday, September 21, 2018 9:03 PM
  • Hi VasicDev2,

    About your issue, I don't find the better way to do this, If you have a better way, please share your solution here.

    Thanks for your understanding.

    Best Regards,

    Cherry


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Thursday, September 27, 2018 8:10 AM
    Moderator
  • I've redone this solution with inheritable dependency properties.  However the issue with this is that I can't initialize the scrollviewer to a position.  I was having the same issue with the above and hoped the new solution would fix it.  I'm stuck!

    When the dependency property gets updated by a coerce in the loaded event I set the horizontal offset and nothing happens.  I have a custom virtualized panel that implements SetHorizontalOffset and I have a breakpoint there.  It never gets reached until I tell the thing to scroll manually by pressing a button on the screen.  The user control that contains the scrollviewer is collapsed.  This could have something to do with it.  However, when I hit the breakpoint where I call ScrollToHorizontalOffset the control says it's visible.  Not sure how....  Any help would be appriciated.


    • Edited by VasicDev2 Thursday, December 6, 2018 7:24 PM
    Thursday, December 6, 2018 7:19 PM
  • I've made it visible by default and it's still not scrolling.....
    Thursday, December 6, 2018 7:30 PM
  • Is there not anyone in this community that's knowledgeable about custom controls?  How is this possible?
    Friday, December 7, 2018 9:21 PM