WPF styles for TabControl / TabPanel / TabItem

Question

Here's a newbie question for WPC TabControl, TabItem, and TabPanel. There is a related answer on StackOVF that I happily used in my application. Here is a link to the answer and a code snippet:

WPF: Center TabItems Tabs in TabControl

<TabControl> <TabControl.Resources> <Style TargetType="{x:Type TabPanel}"> <Setter Property="HorizontalAlignment" Value="Center" /> </Style> </TabControl.Resources> <TabItem Header="Test 1" /> <TabItem Header="Test 2" /> <TabItem Header="Test 3" /> <TabItem Header="Test 4" /> </TabControl> 

While this is great, I would like to move resources and styles to a better place (style sheet, etc.). My first attempt was to move the <TabControl.Resources> to <Window.Resources> , but that didn't work. I tried several options, but could not get it to work. Here is an example of an attempt that I was expecting to work somewhat:

 <!-- Doesn't work as expected: --> <Window.Resources> <Style TargetType="{x:Type TabPanel}"> <Setter Property="HorizontalAlignment" Value="Center" /> </Style> </Window.Resources> 

Internet searches and msdn did not help me solve my problem, but instead left me a second (related) question: what is actually a TabPanel and how does it relate to TabControl

Any help and advice would be greatly appreciated.

(Edited: commented in the last example that the code is not working for me.)

Answer 1

TabControl uses the specialized TabPanel class, not a universal panel, such as the StackPanel, because if you mess with TabControl, you will realize that the panel does a lot of things that common panels do not. One of them sets tab header elements in several lines. Another is that the line items will be reordered so that the selected tabitem header is always on the last line. I guess it could be even bigger

I am very interested to know why the style setting in the Windows resource section does not work. My initial reaction was that it should work until I tried. I am adding this as an answer because SO will not let me add an image to a comment.

Answer 2

You will probably need to create a ControlTemplate for this.

I am not familiar with ControlTemplates yet. I hacked this example: http://msdn.microsoft.com/en-us/library/system.windows.controls.primitives.tabpanel.aspx

 <Style TargetType="{x:Type TabControl}"> <Setter Property="OverridesDefaultStyle" Value="True" /> <Setter Property="SnapsToDevicePixels" Value="True" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type TabControl}"> <Grid KeyboardNavigation.TabNavigation="Local"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <TabPanel Name="HeaderPanel" Grid.Row="0" Panel.ZIndex="1" Margin="0,0,4,-1" IsItemsHost="True" KeyboardNavigation.TabIndex="1" HorizontalAlignment="Center"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>