Gewusst wie: Formatieren eines TabControl

Aktualisiert: November 2007

In diesem Thema wird gezeigt, wie Sie TabControl und die darin enthaltenen Item-Steuerelemente formatieren.

Beispiel

Im folgenden Beispiel wird veranschaulicht, wie Sie Änderungen an Elementen vornehmen, aus denen sich die Steuerelementvorlage von TabControl zusammensetzt.

<Style x:Key="{x:Type TabControl}" TargetType="{x:Type TabControl}">
  <Setter Property="BorderThickness" Value="3"/>
  <Setter Property="BorderBrush" Value="Red"/>
  <Setter Property="Background" Value="LightBlue"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="TabControl">
        <Grid>
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
          </Grid.RowDefinitions>
          <Border BorderThickness="0,0,1,1" BorderBrush="#D0CEBF" Grid.Row="1">
            <Border BorderThickness="{TemplateBinding BorderThickness}" 
                BorderBrush="{TemplateBinding BorderBrush}">
              <Border Background="{TemplateBinding Background}">
                <ContentPresenter ContentSource="SelectedContent"/>
              </Border>
            </Border>
          </Border>
          <TabPanel Grid.Row="0" IsItemsHost="true"/>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Im folgenden Beispiel wird dargestellt, wie Sie ein TabItem formatieren, das in TabControl verwendet wird.

<Style TargetType="TabItem">
  <Setter Property="BorderThickness" Value="3"/>
  <Setter Property="BorderBrush" Value="Red"/>
  <Setter Property="Background" Value="LightBlue"/>
  <Setter Property="VerticalContentAlignment" Value="Center"/>
  <Setter Property="HorizontalContentAlignment" Value="Center"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type TabItem}">
        <Border>
          <Grid>
            <Grid>
              <Border CornerRadius="3,3,0,0" Background="{TemplateBinding Background}" 
                   BorderBrush="{TemplateBinding BorderBrush}" 
                   BorderThickness="{TemplateBinding BorderThickness}"/>
            </Grid>
            <Border BorderThickness="{TemplateBinding BorderThickness}" 
                 Padding="{TemplateBinding Padding}">
              <ContentPresenter ContentSource="Header" 
                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>
          </Grid>
        </Border>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Das vollständige Beispiel finden Sie unter Beispiel zu TabControl mit Steuerelementvorlagen.