HOW TO：定義 GroupBox 範本

這個範例說明如何建立 GroupBox 控制項的範本。

範例

下列範例使用版面配置的 Grid 控制項來定義 GroupBox 控制項範本。 本範例使用 BorderGapMaskConverter 定義 GroupBox 的框線，因此，框線不會混淆 Header 內容。

<!--=================================================================
    GroupBox Template Example
==================================================================-->
<BorderGapMaskConverter x:Key="BorderGapMaskConverter"/>
<Style x:Key="{x:Type GroupBox}"
       TargetType="{x:Type GroupBox}">
  <Setter Property="BorderBrush"
          Value="Gray"/>
  <Setter Property="Foreground"
          Value="White"/>
  <Setter Property="BorderThickness"
          Value="1"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type GroupBox}">
        <Grid>
          <Grid.ColumnDefinitions>
            <ColumnDefinition Width="4"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="4"/>
          </Grid.ColumnDefinitions>
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="4"/>
          </Grid.RowDefinitions>
          <Border CornerRadius="4"
                  Grid.Row="1"
                  Grid.RowSpan="3"
                  Grid.Column="0"
                  Grid.ColumnSpan="4"
                  BorderThickness="{TemplateBinding BorderThickness}"
                  BorderBrush="Transparent"
                  Background="{TemplateBinding Background}"/>
          <!-- ContentPresenter for the header -->
          <Border x:Name="Header"
                  Padding="6,0,6,0"
                  Grid.Row="0"
                  Grid.RowSpan="2"
                  Grid.Column="1">
            <ContentPresenter ContentSource="Header" 
                              RecognizesAccessKey="True" />
          </Border>
          <!-- Primary content for GroupBox -->
          <ContentPresenter Grid.Row="2"
                            Grid.Column="1"
                            Grid.ColumnSpan="2"
                            Margin="{TemplateBinding Padding}"/>
          <Border CornerRadius="0"
                  Grid.Row="1"
                  Grid.RowSpan="3"
                  Grid.ColumnSpan="4"
                  BorderThickness="{TemplateBinding BorderThickness}"
                  BorderBrush="{TemplateBinding BorderBrush}">
            <Border.OpacityMask>
              <MultiBinding Converter=
                            "{StaticResource BorderGapMaskConverter}"
                            ConverterParameter="6">
                <Binding ElementName="Header"
                         Path="ActualWidth"/>
                <Binding RelativeSource="{RelativeSource Self}"
                         Path="ActualWidth"/>
                <Binding RelativeSource="{RelativeSource Self}"
                         Path="ActualHeight"/>
              </MultiBinding>
            </Border.OpacityMask>
          </Border>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

請參閱

參考

GroupBox

其他資源

GroupBox HOW TO 主題