Como: Aplicar um Estilo sobre um TabControl

Este tópico mostra como aplicar um estilo a um TabControl e os controles de item que ele contém.

Exemplo

O exemplo a seguir mostra as alterações feitas aos elementos que compõem o modelo de controle do TabControl.

<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>

O exemplo a seguir mostra como aplicar um estilo a TabItem que é usado no TabControl.

<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>

Observação:
Não BIND o Content propriedade de um TabItem para o ContentPresenter em um TabItem modelo. Em vez disso, use a propriedade ContentTemplate de um TabControl para vincular o conteúdo dos itens da guia na caixa TabControl.

For the complete sample, see Exemplo de modelos de controle usando TabControl.