2015-08-18 116 views
0

SOF部落Windows手机8.1流动容器,动态按钮

我有一个流容器,其中我可以倒的动态创建XAML按钮不确定数目的标识的请求。所述按钮应该尽可能地包装文本(我认为我有一个这样的模板)。但按钮应该像gridview一样包装,但像堆栈面板一样运行。有谁知道一个容器可以让我完成图像所描绘的内容?

目前,对于下面的现有图像,我使用的是gridview,但gridview设置了特定的宽度但流量不均匀。一个堆栈面板具有理想的端对端风格,但不会包装。那么,有什么想法?

Auto wrapping flow container

回答

2

有所谓由Greg斯托尔作出的UniversalWrapPanel。所以,这是我将要采取的方向。然而,现在我已经有了最后一点需要解决的问题了。如何获得绑定数据以尊重父容器的内容包装能力,而不是将其堆叠在垂直列中。

下面的XAML给我下面的图像结果,这是不是我想要的。静态添加的按钮对UniversalWrapPanel工作得很好。但试图获得一个绑定和ItemsSource的工作,好吧,这是目前超出我的。

enter image description here

<support:UniversalWrapPanel Orientation="Horizontal" Background="White"> 
    <ItemsControl x:Name="GridViewRecipients" ItemsSource="{Binding}"> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Button Style="{StaticResource ButtonLozengeStyle}" Content="{Binding FullName}"/> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 
</support:UniversalWrapPanel> 

好了,更多的搜索,我发现这一点:

http://www.visuallylocated.com/post/2015/02/20/Creating-a-WrapPanel-for-your-Windows-Runtime-apps.aspx

,因此这里是ItemsControl的范围内引用UniversalWrapPanel正确的方法:

<ItemsControl x:Name="GridViewRecipients" ItemsSource="{Binding}"> 
    <ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <support:UniversalWrapPanel Orientation="Horizontal" Background="DodgerBlue"/> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Button Style="{StaticResource ButtonLozengeStyle}" Content="{Binding FullName}"/> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

结果为:

enter image description here