WPF动画:在网格单元中移动图像

本文关键字:移动 图像 单元 网格 动画 WPF | 更新日期: 2023-09-27 18:03:53

我是WPF的初学者,我有一个数组图像要在网格中显示,然后有这个按钮,左边和右边,这样当我点击左边时,我会将图像移动到左边,从数组中显示另一组图像。同样,也可以使用右键将图像移动到右侧。就像在www.yahoo.com主页上浏览当天的头条新闻一样。在WPF中如何做到这一点?谢谢!

WPF动画:在网格单元中移动图像

这样做的一种方法是在网格中的每个单元格中放置一个Canvas,然后将图像放在Canvas中。这样你就可以将图像的画布做成动画。Left属性将其向左移动&正确的。一个需要注意的问题(从经验来看!)是在动画中获得正确的绑定…对于附加属性,绑定语法需要像这样的括号…

<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" ...etc...

更新:实际上我想我误解了你想要的-也许这更像是你需要的?它讨论了不使用滚动条的ScrollViewer的动画

您可以使用itemscontrol并更改按钮上的项目来源…

看看下面的示例,在这个示例中,我使用stackpanel作为itemshost的项目控件…数据模板中的图像....

点击左键或右键,你可以改变itemssource的itemscontrol…

  <ItemsControl ItemsSource="{Binding Images}" >
                                            <ItemsControl.ItemTemplate>
                                                <DataTemplate>
                                                    <Image Source={Binding}></Image>
                                                </DataTemplate>
                                            </ItemsControl.ItemTemplate>
                                            <ItemsControl.ItemsPanel>
                                                <ItemsPanelTemplate>
                                                    <Stackpanle Orientation="Horizontal" IsItemsHost="True" />
                                                </ItemsPanelTemplate>
                                            </ItemsControl.ItemsPanel>
                                        </ItemsControl>
编辑:

在更改数据上下文之前,您可以为itemscontrol添加动画并更改数据上下文并将其带入…