设置GroupBox的样式

时间:2012-02-20 13:26:06

标签: wpf xaml styling groupbox

我正在尝试创建这样的GroupBox设计。

enter image description here

我查看了GroupBox.HeaderTemplate

但是我在创建蓝色背景颜色方面遇到了问题,宽度为100%。 边境也是如此。

到目前为止我的代码

<GroupBox.HeaderTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Label Content="{Binding}" HorizontalAlignment="Stretch" Background="#25A0DA" Grid.Column="0" Height="20" Padding="5,0,0,0" Margin="1" Foreground="White"/>
                    </Grid>
                </DataTemplate>
            </GroupBox.HeaderTemplate>

这就是它现在的样子。

enter image description here

5 个答案:

答案 0 :(得分:48)

采用默认GroupBox Template并将其更改为您想要的方式

例如,

  <ControlTemplate TargetType="GroupBox">
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
      </Grid.RowDefinitions>

      <Border Grid.Row="0"
              BorderThickness="1"
              BorderBrush="#25A0DA"
              Background="#25A0DA">
          <Label Foreground="White">   
              <ContentPresenter Margin="4"
                          ContentSource="Header"
                          RecognizesAccessKey="True" />
          </Label>
      </Border>

      <Border Grid.Row="1"
              BorderThickness="1,0,1,1"
              BorderBrush="#25A0DA">
        <ContentPresenter Margin="4" />
      </Border>

    </Grid>
  </ControlTemplate>

答案 1 :(得分:4)

这个帖子有点老了,但是有人会觉得这很有用......

如果你想拥有全宽标题,可以对雅各布的答案进行一些小修改。

您可以绑定到父GroupBox,这样您就可以在不使用命名GroupBox的情况下使用它。

<GroupBox.HeaderTemplate>
  <DataTemplate>
    <TextBlock Text="{Binding}" 
           Width="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=GroupBox}, Path=ActualWidth }"
           Background="#25A0DA" Grid.Column="0" Height="20" Padding="5,0,0,0" Margin="1" Foreground="White"/>
  </DataTemplate>
</GroupBox.HeaderTemplate>

答案 2 :(得分:3)

如果没有编写完全不同的模板,您可能无法使其看起来与您的示例完全相同,但我通过将HeaderTemplate中网格的宽度绑定到组框的宽度并指定了适当的方式给了它一个简单的镜头保证金和填充:

<GroupBox.HeaderTemplate>
    <DataTemplate>
        <Grid Width="{Binding ElementName=groupBox1, Path=ActualWidth}" Margin="-10, 0, -10, 0" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Label Content="{Binding}" HorizontalAlignment="Stretch" Background="#25A0DA" Grid.Column="0" Height="20" Padding="5, 0, 0, 0" Margin="10" Foreground="White"/>
        </Grid>
    </DataTemplate>
</GroupBox.HeaderTemplate>

结果如下:

enter image description here

答案 3 :(得分:1)

我意识到这已经晚了,但是MahApps.Metro软件包有一个很好的GroupBox,看起来几乎和OP中发布的一样。

https://github.com/MahApps/MahApps.Metro/blob/develop/MahApps.Metro/Styles/Controls.GroupBox.xaml

这是版本1.22的Xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:Controls="clr-namespace:MahApps.Metro.Controls"
                xmlns:Converters="clr-namespace:MahApps.Metro.Converters">

<Converters:ThicknessBindingConverter x:Key="ThicknessBindingConverter" />

<Style x:Key="MetroGroupBox" TargetType="{x:Type GroupBox}">
    <Setter Property="Foreground" Value="{DynamicResource BlackBrush}" />
    <Setter Property="Background" Value="{DynamicResource AccentColorBrush}" />
    <Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}" />
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="Controls:ControlsHelper.ContentCharacterCasing" Value="Upper" />
    <Setter Property="Controls:ControlsHelper.HeaderFontSize" Value="{DynamicResource ContentFontSize}" />
    <Setter Property="Controls:GroupBoxHelper.HeaderForeground" Value="{x:Null}" />
    <Setter Property="Margin" Value="5" />
    <Setter Property="Padding" Value="5" />
    <Setter Property="SnapsToDevicePixels" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type GroupBox}">
                <Grid x:Name="GroupBoxRoot">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <Border x:Name="HeaderSite"
                            Grid.Row="0"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                            UseLayoutRounding="True">
                        <Controls:ContentControlEx x:Name="HeaderContent"
                                                   Padding="{TemplateBinding Padding}"
                                                   FontSize="{TemplateBinding Controls:ControlsHelper.HeaderFontSize}"
                                                   FontWeight="{TemplateBinding Controls:ControlsHelper.HeaderFontWeight}"
                                                   FontStretch="{TemplateBinding Controls:ControlsHelper.HeaderFontStretch}"
                                                   Content="{TemplateBinding Header}"
                                                   ContentCharacterCasing="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Controls:ControlsHelper.ContentCharacterCasing)}"
                                                   ContentStringFormat="{TemplateBinding HeaderStringFormat}"
                                                   ContentTemplate="{TemplateBinding HeaderTemplate}"
                                                   ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}"
                                                   RecognizesAccessKey="True"
                                                   SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                                   UseLayoutRounding="False">
                            <TextElement.Foreground>
                                <MultiBinding Converter="{x:Static Converters:BackgroundToForegroundConverter.Instance}">
                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
                                             Path="Background"
                                             Mode="OneWay" />
                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
                                             Path="(Controls:GroupBoxHelper.HeaderForeground)"
                                             Mode="OneWay" />
                                </MultiBinding>
                            </TextElement.Foreground>
                        </Controls:ContentControlEx>
                    </Border>
                    <Border Grid.Row="1"
                            Background="Transparent"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=BorderThickness, Converter={StaticResource ThicknessBindingConverter}, ConverterParameter={x:Static Converters:IgnoreThicknessSideType.Top}}"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                            UseLayoutRounding="True">
                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                          Content="{TemplateBinding Content}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          Cursor="{TemplateBinding Cursor}"
                                          UseLayoutRounding="False" />
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

答案 4 :(得分:0)

试试这个:

Class super_class                                        OBJC2_UNAVAILABLE;
const char *name                                         OBJC2_UNAVAILABLE;
long version                                             OBJC2_UNAVAILABLE;
long info                                                OBJC2_UNAVAILABLE;
long instance_size                                       OBJC2_UNAVAILABLE;
struct objc_ivar_list *ivars                             OBJC2_UNAVAILABLE;
struct objc_method_list **methodLists                    OBJC2_UNAVAILABLE;
struct objc_cache *cache                                 OBJC2_UNAVAILABLE;
struct objc_protocol_list *protocols                     OBJC2_UNAVAILABLE;