WPF流体布局和列表框

我正在研究如何在我的WPF 4.0应用程序中产生效果，我有一个列表框，可以通过动画（而不是跳转）从列表视图（即我自己项目的垂直堆栈）切换到网格视图（从左到右平铺列表）

我一直在研究Blend 4中的流体布局，并对其进行了修改，但运气不太好

有人对我如何创建一个视觉状态有什么想法吗？它可以通过一个漂亮的动画将列表框的布局更改为网格（也可以将项目模板更改为更小的缩略图版本）

我知道这听起来很多，但这将是一个伟大的影响，在我的应用程序

非常感谢您提供的任何帮助，如果我找到任何东西，我会发回：）

---

标记

创建您想要的两种视觉状态，并使用Width=0之类的值来“隐藏”您不想在给定状态下显示的列表框或网格。然后，只需添加一个过渡到您的状态，这应该给它一个相当流畅的动画。您可能还需要使用其他尺寸和位置选项。在这种情况下，透视图是一个很好的选择。

我上传了一个简单的版本，您可以在这里下载：

这显示了带有转换的两个自定义状态。以下是我所做工作的概要：

创建两个ListBox控件并将它们绑定到同一数据源。您可以为每个模板创建所需的任何数据模板，我的示例只是一个图像列表

为了使其成为网格视图效果，我使用自定义模板覆盖了GridList的ItemsPanel。我所做的就是用UniformGrid替换StackPanel

转到“状态”面板并创建新的自定义状态组。在其中，创建两个自定义状态：

A.垂直状态-此状态将栅格面板的宽度设置为0，垂直列表的宽度设置为175

B.GridState-此状态与此相反，并将网格面板的宽度设置为300，列表设置为0

要提供动画效果，请设置默认过渡时间。我用了2秒钟，只是为了让你能真正看到它的发生

为了触发状态，我只使用了一个ToggleButton和GoToState行为。选中该按钮时，我转到GridState，未选中时，我转到VerticalState

一旦状态之间的转换生效，我就将GridPanel的默认宽度设置为0（在设置之后，我必须在GridState中重置它的宽度）

这是一个简单的例子，所以一如既往，YMMV。您需要使用大小和其他属性才能获得最终效果。当然，你也可以在你的过渡中添加广告

---

不幸的是，查看一个已完成的解决方案并不能真正向您展示如何在Blend中实现这一点。几周后，我会尝试展示类似的东西。现在，这将有希望让你走得更远。

是的，我知道这个理论，但这是我遇到麻烦的混合的相当微妙的性质，你有没有尝试过你的解决方案？如果是这样的话，你认为你可以采取更循序渐进的方法，或者给我发电子邮件给我一个简化的解决方案吗？谢谢你花时间为我做这件事，我很感激，但我真正想要的是一个完全不同的过渡，基本上我是在过渡之后，当垂直列表中的每个项目在相关位置动画化为网格时，网格将水平对齐。我想举个例子，Pivot（www.getpivot.com）是我能想到的最好的，当瓷砖从垂直堆叠到水平网格时。这有意义吗？（+1表示努力）对不起，我现在明白你想要什么了。不幸的是，我不知道从哪里开始：我认为这将是一个相当复杂的任务，很可能是一个编程解决方案。您不仅希望转换元素的位置，还希望实际更改所涉及的布局容器的类型和ItemTemplate。我相信有办法做到这一点。我推荐杰夫·帕里斯的书