DataTemplate for Grid的ItemTemplate以列显示其内容

时间:2010-07-15 14:24:03

标签: wpf xaml datatemplate itemtemplate

我有HeaderedItemsControl其中ItemsSource绑定到ObservableCollection<Person>。我想显示它的内容,如:

*Name*       Müller      Schmid    Weber
*FirstName*  Peter       Hans      Willhelm
*Age*        32          56        78
*Country*    Switzerland Austria   Liechtenstein

到目前为止我的xaml-Code:

<HeaderedItemsControl ItemsSource="{Binding Path=PersonCollection}">
        <HeaderedItemsControl.Template>
            <ControlTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition />
                        <RowDefinition />
                        <RowDefinition />
                        <RowDefinition />
                     </Grid.RowDefinitions>
                    <TextBlock Grid.Column="0" Grid.Row="0" Text="Name"/>
                    <TextBlock Grid.Column="0" Grid.Row="1" Text="FirstName"/>
                    <TextBlock Grid.Column="0" Grid.Row="2" Text="Age"/>
                    <TextBlock Grid.Column="0" Grid.Row="3" Text="Country"/>
                    <StackPanel Grid.RowSpan="4" Grid.Column="1" Orientation="Horizontal">
                        <ItemsPresenter/>
                    </StackPanel>
                </Grid>
            </ControlTemplate>
        </HeaderedItemsControl.Template>
        <HeaderedItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition />
                            <RowDefinition />
                            <RowDefinition />
                    </Grid.RowDefinitions>
                        <Label Grid.Row="0" Content="{Binding Path=Name}" />
                        <Label Grid.Row="1" Content="{Binding Path=FirstName}" />
                        <Label Grid.Row="2" Content="{Binding Path=Age}" />
                        <Label Grid.Row="3" Content="{Binding Path=Country}"/>
                </StackPanel>
            </DataTemplate>
        </HeaderedItemsControl.ItemTemplate>
    </HeaderedItemsControl>

这给了我类似的东西:

*Name*       Müller
             Schmid
             Weber
*FirstName*  Peter
             Hans
             Willhelm
*Age*        32
             56 
             78
*Country*    Switzerland
             Austria
             Liechtenstein

有没有办法让这些项目出现在一列中?

2 个答案:

答案 0 :(得分:1)

在你的ControlTemplate中,你已经将ItemsPresenter包装在StackPanel中,在这种情况下,它没有任何作用,因为它只有一个子项:ItemsPresenter。你真正想要的是ItemsPresenter使用StackPanel来完成你的内部布局,你可以使用ItemsControl.ItemsPanel来定义一个面板的模板,该面板将托管控件生成的项目:

<HeaderedItemsControl.ItemsPanel>
  <ItemsPanelTemplate>
    <StackPanel Orientation="Horizontal"/>
  </ItemsPanelTemplate>
</HeaderedItemsControl.ItemsPanel>

您还需要将ItemTemplate中的StackPanel声明更改为Grid,以便将每个项目布局为Rows。

答案 1 :(得分:0)

ItemTemplate内,您正在设置标签行而不是列,因此您的内容将垂直堆叠。此外,您将标签放在StackPanel垂直方向,这将使它们显示在一列中。我猜你正在为你的ItemTemplate寻找这样的布局。

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>
  <Label Grid.Column="0" Content="{Binding Path=Name}" />
  <Label Grid.Column="1" Content="{Binding Path=FirstName}" />
  <Label Grid.Column="2" Content="{Binding Path=Age}" />
  <Label Grid.Column="3" Content="{Binding Path=Country}"/>
</Grid>