Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF ItemsControl scrollbar

Using ItemsControl to display a collection of items on a Canvas. Probelm is that I can't see all the items on my screen (need to use Scrollbars), I've checked this post out and tried the same but it doesn't work for me, the Scrollbar is shown but disabled. My XAML:

<Grid>
    <DockPanel>
        <ScrollViewer>
            <ItemsControl ItemsSource={Binding MyCollection}>
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <Canvas />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        ....
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </DockPanel>
</Grid>
like image 882
Stacked Avatar asked Mar 13 '26 09:03

Stacked


1 Answers

ItemsControl by default doesn't have ScrollViewer in it's Template unlike ListBox.

Get rid of the outer scrollViewer and set the Template of ItemsControl to contain ScrollViewer. Also, I don't see any usage of DockPanel when you already wrap ItemsControl inside Grid.

Change layout something like this:

<Grid>
    <ItemsControl ItemsSource={Binding MyCollection}>
        <ItemsControl.Template>
            <ControlTemplate>
                <Border
                    BorderThickness="{TemplateBinding Border.BorderThickness}"
                    Padding="{TemplateBinding Control.Padding}"
                    BorderBrush="{TemplateBinding Border.BorderBrush}"
                    Background="{TemplateBinding Panel.Background}"
                    SnapsToDevicePixels="True">
                    <ScrollViewer
                        Padding="{TemplateBinding Control.Padding}"
                        Focusable="False">
                        <ItemsPresenter SnapsToDevicePixels="{TemplateBinding 
                                               UIElement.SnapsToDevicePixels}"/>
                    </ScrollViewer>
                </Border>
            </ControlTemplate>
        </ItemsControl.Template>
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                ....
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>
like image 113
Rohit Vats Avatar answered Mar 17 '26 02:03

Rohit Vats