GridView如何设置组的样式

时间:2014-10-23 15:00:09

标签: xaml gridview windows-store-apps

我的工作GridView有一个分组的项目。

<GridView x:Name="ItemsGridView" 
      ItemsSource="{Binding Source={StaticResource itemsViewSource}}" 
      SelectionMode="None" ItemClick="ItemsGridView_ItemClick" IsItemClickEnabled="True">
<GridView.ItemTemplate>
    <DataTemplate>
        <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Width="400" >
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <TextBlock x:Name="title" Text="{Binding Name}" TextWrapping="NoWrap" Grid.ColumnSpan="1" Grid.Column="0" Padding="5,0,0,0" HorizontalAlignment="Left"/>
        </Grid>
    </DataTemplate>
</GridView.ItemTemplate>

<GridView.GroupStyle>
    <GroupStyle>
        <GroupStyle.HeaderTemplate>
            <DataTemplate>
                <Border Width="130" Background="{StaticResource CommonBlueBackground}" >
                    <TextBlock TextWrapping="Wrap" Text="{Binding Key}" Style="{StaticResource GroupHeader}" Margin="0"/>
                </Border>
            </DataTemplate>
        </GroupStyle.HeaderTemplate>
    </GroupStyle>
</GridView.GroupStyle>

每个小组都是这样的。

No group Styling

但我希望它看起来像这样。

Styled group

如何设置每个组的样式以在左侧显示一条线?如图所示?

1 个答案:

答案 0 :(得分:0)

GridView中的群组不是实际控件,而是ItemsPanel中列出的项目容器和标题控件的集合,如下所示。

Groups visual tree

最简单的解决方案是通过ItemContainerStyle的更新在每个项目的左侧添加一行。

相关问题