Question

如何在分组列表框中拉伸标题宽度？

列表框ItemSource绑定到分层数据结构。组项包含名称和子项列表。

public class MyGroup
{
    public string GroupName { get; set; }
    public ObservableCollection<MyItem> SubItems { get; }
}

public class MyItem
{
    public string ItemName { get; set; }
    public DateTime Creation { get: set: }
}

public class MyViewModel: 
{
    public ObservableCollection<MyGroup> Data { get; set; }
}

页面定义如下

<Page>

<Page.Resources>
    <CollectionViewSource x:Name="cvsListBoxGroup" IsSourceGrouped="True" Source="{Binding Data}" ItemsPath="SubItems"/>
</Page.Resources>

<Page.DataContext>
    <local:MyViewModel/>
</Page.DataContext>

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <ListBox Width="500" SelectionMode="Single" ItemsSource="{Binding Source={StaticResource cvsListBoxGroup}}">

            <ListBox.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <Grid Background="Beige">
                                <TextBlock Text="{Binding GroupName}"></TextBlock>
                            </Grid>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ListBox.GroupStyle>
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </ListBox.ItemContainerStyle>            
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Background="Bisque">
                        <TextBlock Text="{Binding ItemName}" Foreground="Black" ></TextBlock>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Page>

显示组和项目。这些项目不会填充列表框的全宽，因此我们需要为ListBox.ItemContainerStyle设置HorizontalContentAlignment。这个技巧很常见 - 没问题

<ListBox.ItemContainerStyle>
 <Style TargetType="ListBoxItem">
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
 </Style>
</ListBox.ItemContainerStyle>

我试图找出一些类似于groupheader项目的类似技巧 - 但没有任何帮助。

<GroupStyle.HeaderContainerStyle>
   <Style TargetType="GroupItem">
       <Setter Property="HorizontalContentAlignment" Value="Stretch" />
   </Style>
</GroupStyle.HeaderContainerStyle>

问题似乎是TargetType。对于列表视图，有一个ListViewHeaderItem。但是列表框没有类似的东西。

Answer 1

请参阅此处的答案，ListView，但这基本相同：

https://social.msdn.microsoft.com/Forums/windowsapps/en-US/e8d4f7b3-93a8-4f17-9679-8b700b8d02e6/how-to-adjust-the-width-of-group-header-in-listview-to-stretch-full-width?forum=winappswithcsharp

在分组列表框视图中拉伸标题宽度

1 个答案: