您可以使用设置为 a或的ItemsControl来显示您的集合。我这里有一些示例可能会对您有所帮助,因为我认为 MDSN 的示例没有多大帮助。ItemsPanel
Grid
UniformGrid
ItemsControl
如果UniformGrid
您可以将您的Rows
和Columns
属性绑定到您ViewModel
的.Rows
Columns
<ItemsControl ItemsSource="{Binding MyCollection}">
<!-- ItemsPanelTemplate -->
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="{Binding ColumnCount}"
Rows="{Binding RowCount}" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
如果这对您不起作用,您可以使用 a作为Grid
theItemsPanel
并在.Grid.Row
Grid.Column
ItemContainerStyle
这将要求您在每个单元格对象上都有属性,ObservableCollection
以说明该单元格所在的行/列,但是我怀疑您无论如何都需要这些属性来确定单击命令中的相邻单元格之类的内容。
此外,没有内置的方法来绑定你的行数/列数Grid
,所以我倾向于使用一些自定义附加属性,这些属性将动态构建网格RowDefinitions
并ColumnDefinitions
基于绑定值。
因此,如果您使用 Grid,您的最终结果可能如下所示:
<ItemsControl ItemsSource="{Binding Cells}">
<!-- ItemsPanelTemplate -->
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<!-- This is assuming you use the attached properties linked above -->
<Grid local:GridHelpers.RowCount="{Binding Height}"
local:GridHelpers.ColumnCount="{Binding Width}" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<!-- ItemContainerStyle -->
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Grid.Column"
Value="{Binding ColumnIndex}" />
<Setter Property="Grid.Row"
Value="{Binding RowIndex}" />
</Style>
</ItemsControl.ItemContainerStyle>
</ItemsControl>
模型/视图模型看起来像这样
public class GameViewModel
{
// These should be full properties w/ property change notification
// but leaving that out for simplicity right now
public int Height;
public int Width;
public ObservableCollection<CellModel> Cells;
}
public class CellModel
{
// Same thing, full properties w/ property change notification
public int ColumnIndex;
public int RowIndex;
public bool IsVisible;
public bool IsMine;
public int NumberAdjacentMines;
}