如何在UWP中自动滚动ListView？

Question

I am creating a UWP for my Raspberry Pi. My app displays some data to the screen using a ListView . But, the screen is not connected to the mouse or keyboard, so I can't scroll to see the whole data. Is there any way I can auto-scroll the list view and when it reaches the end, it goes to the beginning of the list again?

<local:AlternatingRowListView>
    <local:AlternatingRowListView.ItemTemplate>
        <DataTemplate>
            <Grid Width="{Binding ActualWidth, ElementName=TableData}" Padding="10">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="1.5*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="3*"/>
                    <RowDefinition Height="1*"/>
                </Grid.RowDefinitions>
                <TextBlock Text="{Binding UpperDescription}" FontSize="24" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="4" Margin="2" HorizontalAlignment="Left" Foreground="Black"/>
                <TextBlock Text="{Binding Title}" FontSize="76" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="4" Margin="2" HorizontalAlignment="Left" Foreground="Black"/>
                <TextBlock Text="{Binding LowerDescription}" FontSize="24" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="4" Margin="2"  HorizontalAlignment="Left" Foreground="Black"/>
                <!--<TextBlock Text="{Binding Deadline}" FontSize="24" Grid.Row="1" Grid.Column="3" Margin="2"  HorizontalAlignment="Center" Foreground="Black"/>
                <TextBlock Text="{Binding State}" FontSize="24" Grid.Row="1" Grid.Column="4" Margin="2"  HorizontalAlignment="Center" Foreground="Black"/>-->
            </Grid>
        </DataTemplate>
    </local:AlternatingRowListView.ItemTemplate>
</local:AlternatingRowListView>

Answer 1

If you want to scroll to a specific item in the list, you can use ScrollToView method:

listView.ScrollIntoView(item);

If you need more granular control (like listening to the embedded ScrollViewer events) you first need to get access to the embedded control:

The following helper method will return the first ScrollViewer within a given DependencyObject :

public static ScrollViewer GetScrollViewer(DependencyObject dependencyObject)
{
    if (dependencyObject is ScrollViewer scroller) return scroller;

    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(dependencyObject); i++)
    {
        var child = VisualTreeHelper.GetChild(dependencyObject, i);

        var result = GetScrollViewer(child);
        if (result != null) return result;
    }
    return null;
}

So now you can access the ScrollViewer like this:

var scrollViewer = GetScrollViewer(listView);

Answer 2

Is there any way I can auto-scroll the list view and when it reaches the end, it goes to the beginning of the list again?

I noted that you're making a custom AlternatingRowListView by yourself, it's a good start. If you want to make your ListView auto-scroll, you could try to add a timer in your custom AlternatingRowListView . For example, the DispatcherTimer , you could start the timer when it's loaded. Then, in its Tick event handler, you could use the ScrollViewer to scroll the list.

About how to get the ScrollViewer? I believe you've overrided the OnApplyTemplate method in your custom control class, you could call this.GetTemplateChild("ScrollViewer") as ScrollViewer to get the ScrollViwer in it.

You could refer to the Bottom-up list (XAML) sample for details.

Then, you need to manually calculate if it reaches the end. Once it reaches the end, you could stop the timer and scroll to the top of the list. The above sample also involves part of the calculation, you could check it.