Tabs Studio Blog (organizing Visual Studio document tabs)

May 14, 2009

Control template

Filed under: Uncategorized — Tags: — Sergey Vlasov @ 4:45 pm

XAML supports styles with control templates that can completely change control look. Following example changes tabs shape:

<Style TargetType="{x:Type TabsStudio:Tab}" BasedOn="{StaticResource DefaultTabStyle}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TabsStudio:Tab}">
                <Grid>
                    <Border Name="Border" BorderBrush="Black" BorderThickness="1,1,1,1" CornerRadius="6,6,0,0">
                        <ContentPresenter ContentSource="Header" Margin="12,2,12,2"/>
                    </Border>
                    <Polygon Points="0 22, 9 0, 0 0" Fill="{x:Static SystemColors.ControlBrush}"/>
                    <Line X1="0" Y1="22" X2="9" Y2="0" Stroke="Black" />
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsTabSelected" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="White"/>
                    </Trigger>
                    <Trigger Property="IsTabSelected" Value="False">
                        <Setter TargetName="Border" Property="Background" Value="LightGray" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Custom control template

Custom control template


While extra powerful, control templates in particular require nontrivial XAML skills and persistence to produce desired result.

Blog at WordPress.com.