Silverlight WrapPanel子项

Question

在silverlight中将孩子添加到WrapPanel的最佳方法是什么？我正在使用C#，并且我正在读入一个JSON对象，其中包含带有缩略图的图像和相关信息。

最终目标是拥有一个缩略图网格(13个拇指水平横跨950px乘以6个拇指垂直)。

Answer 1

当你在代码中添加项目时，通常有一种更好的方法。

如何创建一个ListBox并将其ItemsSource设置为您的列表(或将其绑定到DataContext)。创建一个DataTemplate来显示您的缩略图+信息，然后(这是重要的部分)使用WrapPanel创建一个ItemsPanelTemplate。

<Grid x:Name="ImageThumbnails">
    <ListBox 
        ItemsSource="{Binding}" 
        Width="950"
        ScrollViewer.HorizontalScrollBarVisibility="Disabled"
        >
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <Image Source="{Binding Thumbnail}" Width="80" Height="60"/>
                    <TextBlock Text="{Binding ImageName}"/>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
     </ListBox>
</Grid>

然后在您的代码中，一旦您从JSON调用中获得数据：

this.ImageThumbnails.DataContext = thumbnailListFromJSON;

现在，如果您的列表是一个ObservableCollection，那么对列表所做的任何更改都将自动反映在您的UI中。

(上面的代码应该被视为伪代码-显然，您必须更改它以反映您的数据结构)

编辑:在ListBox中添加ScrollViewer.HorizontalScrollBarVisibility="Disabled“。这一点很重要，因为它阻止了滚动查看器在水平方向上无限地扩展。没有这个，WrapPanel就变成了一个单行的列表框。

Answer 2

控件是从面板派生的，所以你可以只使用Children.Add( WrapPanel )。WrapPanel将负责所有的布局，这是它的工作。

Answer 3

对于这种情况，UniformGrid将是完美的选择。不幸的是，它不是Silverlight框架的一部分。但是，有一些WPF版本的端口可用。

http://www.jeff.wilcox.name/2009/01/uniform-grid/