WPF tab control spacing between headers WPF tab control spacing between headers wpf wpf

WPF tab control spacing between headers


I believe you will need to define a custom control template for the TabItem, maybe even one for the TabControl. Here is an example of a TabItem that uses a spacer for some separation.

<Style    x:Key="SpacedTab"    TargetType="{x:Type TabItem}">    <Setter        Property="Template">        <Setter.Value>            <ControlTemplate                TargetType="{x:Type TabItem}">                <Border                    x:Name="Spacer"                    Width="Auto"                    Height="Auto"                    Padding="0 0 5 0"                    Margin="0 0 0 0"                    BorderBrush="Transparent"                    BorderThickness="0">                    <Border                        x:Name="Border"                        MinWidth="150"                        Width="Auto"                        Height="30"                        Background="Gray"                        BorderBrush="DarkGray"                        BorderThickness="0,0,0,0"                        CornerRadius="6,6,0,0"                        Cursor="Hand"                        VerticalAlignment="Bottom">                        <ContentPresenter                            x:Name="ContentSite"                            TextElement.FontSize="10pt"                            TextElement.FontFamily="Arial"                            TextElement.Foreground="Black"                            VerticalAlignment="Center"                            HorizontalAlignment="Center"                            ContentSource="Header"                            Margin="8,3,8,3"                            Width="Auto"                            Height="Auto" />                    </Border>                </Border>            </ControlTemplate>        </Setter.Value>    </Setter></Style>

Hopefully that is a nudge in the right direction; you will still need to add that as a style resource and reference it from your TabControl -> TabItem.


It is easy to add space by doing it in the designer. Select the Tab you want to move, by starting with the rightmost tab. Then hold ctrl and use the right arrow key to move the tab to the right. Do the same with the rest of the tabs. Then you can manually adjust the margin in the xaml code.