Question

I want to add a Grid as ItemPanelTemplate of an ItemsControl in WPF.

I know that there are lots of similar questions. But all of them I have seen so far are talking about dynamically adding rows and columns and they haven't covered it in a good way (in my point of view).

So the thing I want might be the simplest form But I don't know how to do it.

Of course I know that it is not going to work. But it's just for the sake of showing my idea.

<ItemsControl>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock  Text="{Binding ArticleName}" Grid.Row="0" Grid.Column="0" />
            <TextBlock  Text="{Binding ArticleTradeName}" Grid.Row="0" Grid.Column="1" />
            <ListView Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3">
                .
                .
                .
            </ListView>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
  ----------------------------------------
  | #1 name     |  #1 trade name         |
  ---------------------------------------
  | GridView                             |
  |     Row1                             |
  |    Row2                              |
  |    .                                 |
  |    .                                 |
  |     RowN                             |  
  ----------------------------------------
  | #2 name     |  #2 trade name         |
  ----------------------------------------
  | GridView                             |
  |    Row1                              |
  |    Row2                              |
  |    .                                 |
  |    .                                 |
  |     RowN                             | 
  ----------------------------------------
  ...
Was it helpful?

Solution

There's no need to change the ItemsPanel from its default (StackPanel). Simply put the Grid inside the ItemTemplate itself. Like this:

<ItemsControl>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>                
                <TextBlock  Text="{Binding ArticleName}" Grid.Row="0" Grid.Column="0" />
                <TextBlock  Text="{Binding ArticleTradeName}" Grid.Row="0" Grid.Column="1" />
                <ListView ItemsSource="{Binding Samples}" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3">
                    <ListView.View>
                        <GridView>
                            .
                            .
                            .
                        <GridView>
                    </ListView.View>
                </ListView>
            </Grid>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top