Home > Blockchain >  When zoomed, UWP ListView stops centering content
When zoomed, UWP ListView stops centering content

Time:12-23

I have a ListView populated with InkCanvases, each representing a page. I've set the ListView to be scrollable like so:

<ListView Grid.Row="1"
    x:Name="canvases"
    SelectionMode="None"
    ScrollViewer.ZoomMode="Enabled"
    ScrollViewer.HorizontalScrollBarVisibility="Auto"
    ScrollViewer.HorizontalScrollMode="Enabled"
    HorizontalContentAlignment="Center">

And the ListView is populated in a corresponding c# file:


for (int i = 0; i < 120; i  )
{
    InkCanvas canvas = new InkCanvas();
    canvas.Width = 720;
    canvas.Height = 1080;
    Grid grid = new Grid();
    grid.Width = canvas.Width;
    grid.Height = canvas.Height;
    grid.Children.Add(canvas);
    grid.Background = new SolidColorBrush(Windows.UI.Colors.White);

    ListViewItem item = new ListViewItem();
    item.Content = grid;
    item.Width = canvas.Width;
    item.Height = canvas.Height;
    canvases.Items.Add(item);

    addCanvas(canvas);
}

Now, when I run the program the view is initially centered, but when I scroll out it shifts left:

enter image description here

enter image description here

CodePudding user response:

In the end all it took was to wrap the ListView in a separate ScrollViewer with a Viewbox.

<ScrollViewer ZoomMode="Enabled" MinZoomFactor="0.25">
    <Viewbox>
        <ListView SelectionMode="None">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <InkCanvas/>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Viewbox>
</ScrollViewer>
  • Related