来自数据绑定的WPF MVVM表布局 [英] WPF MVVM table layout from data binding

问题描述

假设我有以下模型:

public class PageModel  //INotifyPropertyChanged...
{
    public int RowCount { get; set; }
    public int ColumnCount { get; set; }
    public ObservableCollection<BaseItemModel> PageItems { get; set; }
}

public abstract class BaseItemModel  //INotifyPropertyChanged...
{
    public string Name { get; set; }
    public int Row { get; set; }
    public int Column { get; set; }
}

public class ConcreteItem1 : BaseItemModel
{
    public bool Value { get; set; }
}

public class ConcreteItem2 : BaseItemModel
{
    public float Value { get; set; }
}

我想在WPF中做的事情(在后面的代码中不必做太多事情)是以表/网格格式布置ConcreteItem1和ConcreteItem2的控件.问题是我不知道如何从数据绑定的角度来解决这个问题.

What I would like to do in WPF (without doing too much in the code-behind) is lay out the controls for the ConcreteItem1 and ConcreteItem2 in a table/grid format. The problem is I don't know how to approach this from a data binding standpoint.

在我看来，

It seems to me that UniformGrid would be the control of choice, but somehow embedding that as the layout for an items control?

我的目标是这样的:

行/列固定的地方，控件缩放以填充可用空间.

Where the Rows/Columns is fixed and the controls scale to fill the available space.

那么，如何布置具有固定行/列的表/网格格式的绑定到模型的控件数据?

So, how can I lay out controls data bound to a model in a table/grid format with fixed rows/columns?

推荐答案

将ItemsPanel属性设置为具有指定列数的UniformGrid的ItemsPanelTemplate:

Set the ItemsPanel property to an ItemsPanelTemplate with a UniformGrid that specifies the number of columns:

<ItemsControl ItemsSource="{Binding Items}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="3" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

行数取决于ItemsSource中的项目数.

The number of rows are dependant on the number of items in the ItemsSource.

这篇关于来自数据绑定的WPF MVVM表布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！