Question

是否可以折叠XAML中GroupBox控件的边框（即绑定到VM中的属性）而不会折叠内容？

我不只是想删除边框，这可以通过将BorderThickness设置为0并将Header设置为空字符串来实现。我还希望GroupBox内容延伸到边界的位置。

<DataTemplate DataType="{x:Type config:ElementGroup}">
    <DataTemplate.Resources>
        <Style TargetType="{x:Type GroupBox}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=HideBorder}" Value="True">
                    <Setter Property="Visibility" Value="Collapsed" />
                </DataTrigger>
            </Style.Triggers>
            <Setter Property="Foreground" Value="{StaticResource TextColor}" />
            <Setter Property="Header" Value="{Binding Path=ItemLabel}" />
            <Setter Property="Margin" Value="5,0,5,0" />
        </Style>
    </DataTemplate.Resources>
    <GroupBox>
        <ItemsControl ItemsSource="{Binding Path=ElementList}" Visibility="Visible">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="{Binding Path=Columns}" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </GroupBox>
</DataTemplate>

Answer 1

将GroupBox样式更改为：

    <Style TargetType="{x:Type GroupBox}">
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=HideBorder}" Value="True">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="GroupBox">
                            <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}"
                                      Content="{TemplateBinding Content}"  
                                      ContentStringFormat="{TemplateBinding ContentStringFormat}"
                                      Margin="{TemplateBinding Padding}"  
                                      SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </DataTrigger>
        </Style.Triggers>
        <Setter Property="Foreground" Value="{StaticResource TextColor}" />
        <Setter Property="Header" Value="{Binding Path=ItemLabel}" />
        <Setter Property="Margin" Value="5,0,5,0" />
    </Style>

Answer 2

折叠GroupBox，即将其Visibility属性设置为Hidden或Collapse，也会折叠其Content。

如果您不想这样做，可以定义ItemsControl折叠后显示的另一个GroupBox：

<DataTemplate DataType="{x:Type config:ElementGroup}">
    <DataTemplate.Resources>
        <Style TargetType="{x:Type GroupBox}">
            <Setter Property="Foreground" Value="{StaticResource TextColor}" />
            <Setter Property="Header" Value="{Binding Path=ItemLabel}" />
            <Setter Property="Margin" Value="5,0,5,0" />
        </Style>
    </DataTemplate.Resources>
    <Grid>
        <GroupBox x:Name="gb">
            <ItemsControl ItemsSource="{Binding Path=ElementList}" Visibility="Visible">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="{Binding Path=Columns}" />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </GroupBox>
        <ItemsControl x:Name="ic" ItemsSource="{Binding Path=ElementList}" Visibility="Collapsed">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="{Binding Path=Columns}" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding Path=HideBorder}" Value="True">
            <Setter TargetName="gb" Property="Visibility" Value="Collapsed" />
            <Setter TargetName="ic" Property="Visibility" Value="Visible" />
        </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>

折叠GroupBox边框而不折叠内容

2 个答案: