Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You need to override the style of the TabItem control. Below is an example that still needs some tweaking. Just change it to the style you want. The IsSelected trigger adds changes to the TabItem when it is selected.</p> <pre><code>&lt;Window.Resources&gt; &lt;ResourceDictionary&gt; &lt;Style TargetType="{x:Type TabItem}"&gt; &lt;Setter Property="BorderThickness" Value="3" /&gt; &lt;Setter Property="BorderBrush" Value="Blue" /&gt; &lt;Setter Property="VerticalContentAlignment" Value="Center" /&gt; &lt;Setter Property="HorizontalContentAlignment" Value="Center" /&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="{x:Type TabItem}"&gt; &lt;Border&gt; &lt;Grid&gt; &lt;Grid&gt; &lt;Border x:Name="border" CornerRadius="3,3,0,0" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" /&gt; &lt;/Grid&gt; &lt;Border BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"&gt; &lt;ContentPresenter ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" /&gt; &lt;/Border&gt; &lt;/Grid&gt; &lt;/Border&gt; &lt;ControlTemplate.Triggers&gt; &lt;Trigger Property="IsSelected" Value="True"&gt; &lt;Setter TargetName="border" Property="BorderBrush" Value="Red" /&gt; &lt;Setter TargetName="border" Property="BorderThickness" Value="0,3,0,0" /&gt; &lt;/Trigger&gt; &lt;/ControlTemplate.Triggers&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;/ResourceDictionary&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;TabControl&gt; &lt;TabControl.Background&gt; &lt;LinearGradientBrush EndPoint="0,1" StartPoint="0,0"&gt; &lt;GradientStop Color="#FFCCCCD0" /&gt; &lt;GradientStop Color="#FF526593" Offset="1" /&gt; &lt;/LinearGradientBrush&gt; &lt;/TabControl.Background&gt; &lt;TabItem Header="test1"&gt; &lt;TabItem.Content&gt; &lt;StackPanel Orientation="Horizontal"&gt; &lt;Button Content="Test" VerticalAlignment="Center" /&gt; &lt;Button Content="Test2" /&gt; &lt;/StackPanel&gt; &lt;/TabItem.Content&gt; &lt;/TabItem&gt; &lt;TabItem Header="Test2"&gt; &lt;TabItem.Content&gt; &lt;TextBox /&gt; &lt;/TabItem.Content&gt; &lt;/TabItem&gt; &lt;/TabControl&gt; &lt;/Grid&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload