Question

I’m using AvalonDock in a project. For the sake of this example, it is structured as follows:

<ad:DockingManager>
    <ad:DockablePane>
        <ad:DockableContent Title="Test1">
        </ad:DockableContent>
        <ad:DockableContent Title="Test2">
        </ad:DockableContent>
    </ad:DockablePane>
</ad:DockingManager>

This is fine, but unfortunately the tabs don’t look so good on high contrast themes as shown below.

Ideally I would like to restyle the tabs to use a system color for the background (e.g. Window color). Is this possible?

Thanks,
Alan

Answer 1

go to codeplex and download avalon bits. There you should be able to quickly find their XAML files for styles. Take one as a baseline and start mocking with it.

you should see something like this (I’ll include only one style)

<!--DockingManager-->
<Style x:Key="{x:Type ad:DockingManager}" TargetType="{x:Type ad:DockingManager}">
    <Setter Property="Background" Value="{StaticResource DockManagerBackground}"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ad:DockingManager}">
                <Grid Background="{TemplateBinding Background}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <StackPanel Name="PART_LeftAnchorTabPanel" 
                            Grid.Column="0" Grid.Row="1" Orientation="Vertical">
                        <StackPanel.Resources>
                            <Style TargetType="{x:Type ad:DockablePaneAnchorTabGroup}">
                                <Setter Property="LayoutTransform">
                                    <Setter.Value >
                                        <RotateTransform Angle="90"/>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Margin" Value="0,2,2,0"/>
                            </Style>
                            <Style TargetType="Border">
                                <Setter Property="CornerRadius" Value="0,0,3,3"/>
                            </Style>
                        </StackPanel.Resources>
                    </StackPanel>
                    <StackPanel Name="PART_RightAnchorTabPanel" Grid.Column="2" Grid.Row="1"  Orientation="Vertical">
                        <StackPanel.Resources>
                            <Style TargetType="{x:Type ad:DockablePaneAnchorTabGroup}">
                                <Setter Property="LayoutTransform">
                                    <Setter.Value >
                                        <RotateTransform Angle="90"/>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Margin" Value="2,2,0,0"/>
                            </Style>
                            <Style TargetType="Border">
                                <Setter Property="CornerRadius" Value="3,3,0,0"/>
                            </Style>
                        </StackPanel.Resources>
                    </StackPanel>
                    <StackPanel Name="PART_TopAnchorTabPanel" Grid.Column="1" Grid.Row="0" Orientation="Horizontal"/>
                    <StackPanel Name="PART_BottomAnchorTabPanel" Grid.Column="1" Grid.Row="2" Orientation="Horizontal"/>
                    <Border 
                        x:Name="PART_InternalContainer"
                        Background="{StaticResource DockManagerBorderBackground}"
                        Grid.Column="1" Grid.Row="1"
                        Padding="2">
                        <ContentPresenter />
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

note that right on top of the file there will be a bunch of brushes, start with them, then start digging dipper