0

我正在使用 ModernUI 界面创建 WPF 应用程序。它是一种照片库。图像存储在某个文件夹中，并根据数据库中的适当记录进行检索。所以我的 ViewModel 从数据库中获取信息并将“URI”列绑定到 Image 的 Source 属性。

我需要做的是将这些图像定位到网格中的视图。图像的宽度和高度是恒定的。这里的挑战是在运行之前我不知道我有多少元素，所以应该动态创建 Grid。如果根据网格的宽度自动计算列数，我会更好。例如，图像宽度是 200，右边距是 50，所以如果网格（或父元素，没关系）宽度是 800，所以我们有 3 列。但我可以明确设置列数；最重要的是定位图像，使其看起来像一个网格。

ViewModel 返回 ObservableCollection 元素（可以更改为任何必要的结构）。我非常感谢定义了模板的 XAML 代码。

4

2 回答 2

2

也许您可以尝试动态设置 grid.column 和 grid.row 属性。检查网格的可能宽度和高度以指定可以放置的图片数量。然后定义网格的行和列并添加图像。

         for(amount of images) // define rows and colums
         {
            ColumnDefinition colDef = new ColumnDefinition();
            colDef.Width = new GridLength(specifiedwidth);
            yourgrid.ColumnDefinitions.Add(colDef);

            RowDefinition rowDef = new RowDefinition();
            rowDef.Height = new GridLength(specifiedheight);
            yourgrid.RowDefinition.Add(rowDef);
         }

         for(amount of images) // add your images to the grid
         {
            yourgrid.Children.Add(yourimage);

            Grid.SetColumn(yourimage, index); //set column index
            Grid.SetRow(yourimage, index); // set row index
         }
于 2013-11-19T07:55:44.240 回答
1

您可以将它们显示在ListBox具有ItemsPanelTemplate类型的 a 中WrapPanel：

<ListBox ItemsSource="{Binding ImageUrls}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        <Image Source="{Binding}" Stretch="None" />
    </ListBox.ItemTemplate>
</ListBox>

这应该Image水平添加控件，直到没有更多空间，然后它将它们包装到下一行，依此类推。如果Image尺寸如您所说是恒定的，那么这应该会给您您所追求的外观。当然，您需要Image在集合中以正确的格式保存您的资源。

于 2013-11-19T09:10:14.557 回答