Gridview标题放置

时间:2012-12-21 09:00:39

标签: gridview windows-runtime winrt-xaml

使用分组数据源,HeaderTemplate位于GroupStyle.ContainerStyle下,容器由两行组成,一行用于标题,另一行用于项目。

GridView.HeaderTemplate似乎不是这种情况。标题显示在项目的左侧,如下所示:

标题文字[第1项]

有没有办法将标题文字移到项目列表上方?我认为必须更改GridView模板本身,这似乎不可访问。

这是GridView的XAML。这非常简单:

<GridView x:Name="gridItems" ItemContainerStyle="{StaticResource GridViewListContainerStyle}" ItemsSource="{Binding Items}" SelectionMode="None" AllowDrop="True" CanDragItems="True" VerticalAlignment="Top" HorizontalAlignment="Center"  CanReorderItems="True" Padding="1">
        <GridView.HeaderTemplate>
            <DataTemplate>
                <Grid>
                   <TextBox Text="{Binding Title}" Width="290" MaxLength="20"/>                                                            
                </Grid>
            </DataTemplate>
        </GridView.HeaderTemplate>
        <GridView.ItemTemplate>
            <DataTemplate>
                <local:MyControl DataContext="{Binding}"/>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>

感谢。

3 个答案:

答案 0 :(得分:0)

实际上,我想通了。它比我想象的要简单得多:所有人都需要创建一个用户控件并在Grid中的不同控件中添加标题。

答案 1 :(得分:0)

我处理这种情况的方法是将GridView封装在具有垂直方向的StackPanel中,并在其上添加一个Grid,其中TextBlock的text属性设置为Header文本。 XAML示例如下所示:

<StackPanel Orientation="Vertical">
    <Grid>
        <TextBlock Text="My Header Text"/>
    </Grid>
    <GridView x:Name="GridViewName"
        Grid.Row="1" 
            Height="500" 
            SelectionMode="None" 
            IsItemClickEnabled="True" 
            ItemClick="GVItem_Click" 
            ItemTemplate="{StaticResource ItemTemplate}">
    </GridView>
</StackPanel>

希望这可以帮助并节省一些人浪费我头脑的时间:)

答案 2 :(得分:0)

而不是修改样式(这是非常不方便的,因为无法修改样式的一部分并将默认主题样式应用于控件的其余部分),我之前也使用StackPanel完成了此操作。我后来尝试了这种方法,它也有效,我不确定它有多好,但它确实允许你将标题保持在gridview控件内。

注意HeaderTemplate和ItemPanelTemplate的边距:

<GridView.HeaderTemplate>
    <DataTemplate>
        <TextBlock
            Text="Header"
            VerticalAlignment="Top"
            Margin="10,10,-200,0"
            />
    </DataTemplate>
    </GridView.HeaderTemplate>
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <VariableSizedWrapGrid Margin="0,50,0,0"/>
                    </ItemsPanelTemplate>
         </GridView.ItemsPanel>
      ....
    </GridView>

您可以调整HeaderTemplate和ItemsPanelTemplate的边距,使其适合您的需要。您还可以将VariableSizedWrapGrid更改为您想要的容器..