WPF Grid as ItemsPanel用于动态绑定到ItemsControl的列表

Dir*_*aus 13 data-binding wpf grid mvvm

我使用Grid作为ItemsPanel来动态绑定到ItemsControl的列表.下面的代码正在工作 - 还有一个问题:我找不到动态初始化网格的ColumnDefinitions和RowDefinitions的方法.因此,所有值都放在彼此之上.

<ItemsControl ItemsSource="{Binding Cells}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Grid.Row" Value="{Binding RowIndex}"/>
            <Setter Property="Grid.Column" Value="{Binding ColumnIndex}"/>
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Value}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
Run Code Online (Sandbox Code Playgroud)

请注意,我正在根据MVVM模式搜索答案.因此,子类和后面的代码只是解决方法,但没有解决方案.

Rac*_*hel 22

您需要一些方法来告诉Grid它有多少行/列.也许在每个Item加载时,您可以检查和的值,RowIndexColumnIndex在需要时将Rows/Columns添加到Grid.

作为另一种选择,也许你可以公开RowCountColumnCount在您的视图模型返回的最大特性RowIndexColumnIndex,并在网格的Loaded事件添加所需然而,许多列/行.

我发现在MVVM中使用代码隐藏是完全可以接受的,因为代码只与UI相关.

另一个想法是将您的代码后面的项目安排到2D网格中,然后再将其返回到View,然后将该Grid绑定到DataGrid AutoGenerateColumns=True并删除标题

更新

我目前解决这个问题的方法是使用一组AttachedPropertiesGrid,允许你绑定RowCountColumnCount性能属性上的视图模型

你可以找到我的版本我的博客上的附加属性的代码在这里,他们可以这样使用:

<ItemsPanelTemplate>
    <Grid local:GridHelpers.RowCount="{Binding RowCount}"
          local:GridHelpers.ColumnCount="{Binding ColumnCount}" />
</ItemsPanelTemplate>
Run Code Online (Sandbox Code Playgroud)


Wal*_*mer 5

您的网格的行和列为零,因此所有内容都将显示在彼此的顶部。做下面的事情,它会起作用。

<ItemsControl ItemsSource="{Binding Cells}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Grid.Row" Value="{Binding RowIndex}" />
            <Setter Property="Grid.Column" Value="{Binding ColumnIndex}" />
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Value}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
Run Code Online (Sandbox Code Playgroud)

  • 我知道这一点。但是我的网格的列和行数量在动态增长。我不能使用上述静态方案。 (3认同)