Search code examples
winrt-xamlwindows-8.1windows-10-universalwindows-8.1-universal

W8.1 xaml - is it possible to animate listview / gridview's default scrollviewer using storyboard


I have a list of items inside windows 8.1 listview what I wanted to do is, on a button click I like to auto scroll the items inside list view.

I was able to achieve this if I add those items inside stackpanel and wrapped it within scrollviewer control. But I was unable to animate the inbuilt scrollviewer of the listview.

So Is it possible to animate listview / gridview's default scrollviewer using storyboard in W8.1 store app.

<ListView x:Name="OnboardPanel" HorizontalAlignment="Stretch" ScrollViewer.VerticalScrollBarVisibility="Hidden">
            <ListView>
                <ItemsPanelTemplate>
                    <ItemsWrapGrid x:Name="OnboardWrapGrid" MaximumRowsOrColumns="6" Orientation="Horizontal" HorizontalAlignment="Stretch" Background="Red"/>
                </ItemsPanelTemplate>
            </ListView>
            <ListView>
                <DataTemplate>
                    <Image Source="{Binding ImageName}" Margin="1" Stretch="UniformToFill"/>
                </DataTemplate>
            </ListView>
        </ListView>



private void Button_Click(object sender, RoutedEventArgs e)
        {
            //myStoryboard.Begin();
            Storyboard storyboard1 = new Storyboard();
            DoubleAnimation verticalScrollOffsetAnimation = new DoubleAnimation
            {
                From = 0,
                To = 1000,
                Duration = new TimeSpan(0, 0, 0, 3, 0),
                EnableDependentAnimation = true
            };

            storyboard1.Children.Add(verticalScrollOffsetAnimation);
            Storyboard.SetTarget(verticalScrollOffsetAnimation, OnboardPanel.GetScrollViewer());
            Storyboard.SetTargetProperty(verticalScrollOffsetAnimation, "VerticalOffset");
            //storyboard1.FillBehavior = FillBehavior.Stop;
            //storyboard1.RepeatBehavior = RepeatBehavior.Forever;
            storyboard1.Begin();
        }

Solution

  • I used below as a sample and did some code changes to add storyboard animation to animate scrollviewer in listview.

    Animate (smoothly) ScrollViewer programmatically