Wpf 在 Grid 中绘制对象集合

Question

在我的 wpf 应用程序中，我想创建填充数据的网格视图。这个集合是对象的 Observable 集合

public class BindableProfileData : BindableBase
{

    private ProfileItem _profileModel;
    private BindableDPDataItem _dataModel;

    private int row;
    public int column;
    private int rowSpan;
    private int columnSpan;
    public int Row

    {
        get { return row; }
        set { SetProperty(ref row, value); }
    }

    public int Column
    {
        get { return column; }
        set { SetProperty(ref column, value); }
    }

    public int RowSpan
    {
        get { return rowSpan; }
        set { SetProperty(ref rowSpan, value); }
    }

    public int ColumnSpan
    {
        get { return columnSpan; }
        set { SetProperty(ref columnSpan, value); }
    }



    public string Name
    {
        get
        {
            return "STRING";
        }
    }
}

这是测试对象，但它已经包含了关于控件应该出现在哪一行和哪一列以及应该占用多少 columnSpan 和 rowSpac 的信息。更重要的是，每个对象都应该选择 dataTemplate 来使用 ObservableCollection 元素的绑定上下文来绘制自己。

所以实际上 ObservableCollection 将包含从 BindableProfileData 扩展的对象。

TextBoxCotainer : BindableProfileData {}
RangeBarContainer : BindableProfileData {}

到目前为止我还没有写那些模板，但我发现了一些东西。

为了清楚起见，我希望能够画出类似 this

的东西

现在我正在尝试使用这种方法： `

<ItemsControl ItemsSource="{Binding SelectedCategory}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Grid helper:GridHelpers.RowCount="100"
                          helper:GridHelpers.ColumnCount="3"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Column}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>

`

但是所有元素都绘制在视图中的同一位置：image

你能告诉我我做错了什么吗，或者也许有更好的方法来解决这个问题。任何建议都会有所帮助。谢谢。

Answer 1

像这样声明一个ItemContainerStyle：

<ItemsControl ItemsSource="{Binding SelectedCategory}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid helper:GridHelpers.RowCount="100"
                  helper:GridHelpers.ColumnCount="3"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Column}"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>

    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Grid.Column" Value="{Binding Column}"/>
            <Setter Property="Grid.ColumnSpan" Value="{Binding ColumnSpan}"/>
            <Setter Property="Grid.Row" Value="{Binding Row}"/>
            <Setter Property="Grid.RowSpan" Value="{Binding RowSpan}"/>
        </Style>
    </ItemsControl.ItemContainerStyle>
</ItemsControl>

Wpf 在 Grid 中绘制对象集合

Wpf draw collection of objects inside Grid

c#

wpf

grid

itemscontrol

mvvm