Question

我希望在启动情节提要时滚动GridView中的内容。现在，情节提要的目标是gridview，而不是内容。如何使其在gridview中滚动？

这是我的情节提要和数据模板的外观：

<Page.Resources    
 <Storyboard x:Key="CarouselStoryboard">
        <DoubleAnimation
            Storyboard.TargetName="CarouselTransform" 
            Storyboard.TargetProperty="X"/>
 </Storyboard>

    <DataTemplate x:Key="CatTemplate">
        <Grid>
            <StackPanel Margin="30,0,30,0" Background="Red">

        </StackPanel>
        </Grid>
    </DataTemplate>

  <DataTemplate x:Key="DogTemplate">
        <Grid>
            <StackPanel Margin="30,0,30,0" Background="Green">

        </StackPanel>
        </Grid>
    </DataTemplate>
</Page.Resources>

这就是我的Griview的样子：

<GridView x:Name="myGridView" ItemTemplateSelector="{StaticResource MyDataTemplateSelector}"
            ScrollViewer.HorizontalScrollBarVisibility="Hidden"
      ScrollViewer.HorizontalScrollMode="Auto"
      ScrollViewer.VerticalScrollBarVisibility="Disabled"
      ScrollViewer.VerticalScrollMode="Disabled">

        <GridView.RenderTransform>
            <TranslateTransform x:Name="CarouselTransform" />
        </GridView.RenderTransform>
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid Orientation="Vertical"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>

</GridView>
<Button Click="Left_Click" Content="Left" Background="Blue" HorizontalAlignment="Left"Width="405"/>

这就是我使用某些C＃开始故事板的方式

  private int currentElement = 0;

    private void Left_Click(object sender, RoutedEventArgs e)
    {
        if (currentElement < 100)
        {
            currentElement++;
            AnimateCarousel();
        }
    }
    private void AnimateCarousel()
    {
        Storyboard storyboard =  (this.Resources["CarouselStoryboard"] as Storyboard);
        DoubleAnimation animation = storyboard.Children.First() as DoubleAnimation;
        animation.To = -200 * currentElement;
        storyboard.Begin();
    }

Answer 1

首先，由于我们缺乏合理的内置附加属性，因此无法直接对附加属性进行动画处理

什么是scrollview in control template：

ScrollViewer控件通常作为其他控件的组合部分存在。 ScrollViewer部件以及用于支持的ScrollContentPresenter类将仅在限制主机控件的布局空间小于扩展内容大小时显示视口以及滚动条。列表通常是这种情况，因此 ，因此ListView和GridView模板始终包含ScrollViewer 。

为影响ScrollViewer部分中的某些行为和属性，ScrollViewer定义了许多XAML附加属性：
- ScrollViewer.BringIntoViewOnFocusChange
- ScrollViewer.HorizontalScrollBarVisibility
- ScrollViewer.HorizontalScrollMode
- ScrollViewer.IsDeferredScrollingEnabled
- ScrollViewer.IsHorizontalRailEnabled
- ScrollViewer.IsHorizontalScrollChainingEnabled
- ScrollViewer.IsScrollInertiaEnabled
- ScrollViewer.IsVerticalRailEnabled
- ScrollViewer.IsVerticalScrollChainingEnabled
- ScrollViewer.IsZoomChainingEnabled
- ScrollViewer.IsZoomInertiaEnabled
- ScrollViewer.VerticalScrollBarVisibility
- ScrollViewer.VerticalScrollMode
- ScrollViewer.ZoomMode
Animating XAML attached properties：我们只能为内置的附加属性设置动画。

因此，除了上面的想法，我们需要首先将ScrollView嵌入GridView：

创建自己的GridView

public class MyGridView:GridView
{
 private ScrollViewer myscrollviewer;

 public ScrollViewer MyScrollViewer
 {
    get { return myscrollviewer; }
    set { myscrollviewer = value; }
 }

 protected override void OnApplyTemplate()
 {
    base.OnApplyTemplate();
    ScrollViewer testscrollviewer = GetTemplateChild("ScrollViewer") as ScrollViewer;
    myscrollviewer = testscrollviewer;
 }
}

在您的XAML中使用它：
```
<local:MyGridView x:Name="mygv".../>
```
在这里，由于VerticalOffset是只读的，因此我无法使用DoubleAnimation为滚动视图设置动画。感谢Justin 他分享了此workaround 。借助ScrollView.ChangeView，我们可以制作一些动画。还有一种更简单的方法，如果您不需要动画：
```
 mygv.ScrollIntoView(mygv.Items[10], ScrollIntoViewAlignment.Leading);
```

如何创建自动动画轮播，以便带有DataTemplates的GridView中的内容开始使用C＃或XAML滚动？

1 个答案: