All geek questions in one place

Strange scroll behavior

In my application, I have a very strange scroll behavior: the bottom scroll bar changes its size randomly when scrolling. I use GridView with a lot of items (short code):

<GridView Margin="0,-3,0,0" Padding="116,0,40,46"> <GridView.ItemsPanel> <ItemsPanelTemplate> <VirtualizingStackPanel Orientation="Horizontal"/> </ItemsPanelTemplate> </GridView.ItemsPanel> <GridView.GroupStyle> <GroupStyle> <GroupStyle.HeaderTemplate> <DataTemplate> <!-- Data Template here --> </DataTemplate> </GroupStyle.HeaderTemplate> <GroupStyle.Panel> <ItemsPanelTemplate> <VariableSizedWrapGrid ItemWidth="250" ItemHeight="250" Orientation="Vertical" Margin="0,0,80,0" MaximumRowsOrColumns="4"/> </ItemsPanelTemplate> </GroupStyle.Panel> </GroupStyle> </GridView.GroupStyle> </GridView>

I also found out that the behavior disappears if I remove the add-on. I can set paddings as fields, but then the scrollbar also has a margin that looks really ugly ...

How can i change this? - I noticed that some other applications have this problem ...

Thank you for your help!

+4
source share
3 answers

What you see ("random scrollbar size changes") is a consequence of the virtualization of elements within the grid (actually in VirtualisingStackPanel). Because the virtualized container in your grid view loads more elements to display, the scroll viewer resizes to fit its contents.

If the behavior is causing problems, try overriding the toolbox template and specifying a container without virtualization for your elements.

+3
source

I think you should put the Grid in the ScrollViewer tag.

 <ScrollViewer Height="200" Width="200" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> <GridView Margin="0,-3,0,0" Padding="116,0,40,46"> <GridView.ItemsPanel> <ItemsPanelTemplate> <VirtualizingStackPanel Orientation="Horizontal"/> </ItemsPanelTemplate> </GridView.ItemsPanel> <GridView.GroupStyle> <GroupStyle> <GroupStyle.HeaderTemplate> <DataTemplate> <!-- Data Template here --> </DataTemplate> </GroupStyle.HeaderTemplate> <GroupStyle.Panel> <ItemsPanelTemplate> <VariableSizedWrapGrid ItemWidth="250" ItemHeight="250" Orientation="Vertical" Margin="0,0,80,0" MaximumRowsOrColumns="4"/> </ItemsPanelTemplate> </GroupStyle.Panel> </GroupStyle> </GridView.GroupStyle> </GridView> </ScrollViewer>

Try customizing it to suit your application. See ScrollViewer for properties and events here . Do something new here .

0
source

What @ZombieSheep explained was really correct, but this scenario only happens when you use incremental loading of gridview / listview, however in your particular case the scrollbar changes size due to the gridview layout property, if you can set the correct and remaining padding values ​​(Padding = " 116 , 0, 40 , 46") to zero or something less than you can see the difference, it may not be necessary to place the gridview inside the scrollviewer

0
source

Source: https://habr.com/ru/post/1441061/

More articles:


All Articles