Default Control Templates of Diagram Items

Below you can find the XAML for the default control templates defined by DiagramLite. You could copy the code of a template and insert some additional elements when you need to build upon the predefined appearance of items.

XAML

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:MindFusion.Diagramming"
    xmlns:lanes="clr-namespace:MindFusion.Diagramming.Lanes">    <local:DashArrayConverter x:Key="dashArrayConverter" />
    <local:VisibilityConverter x:Key="visibilityConverter" />
    <local:ThicknessConverter x:Key="thicknessConverter" />
    <local:TextWrappingConverter x:Key="textWrappingConverter" />    <Style TargetType="local:Diagram">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:Diagram">
                    <Canvas Background="{TemplateBinding Background}">
                        <Canvas x:Name="laneGridCellContainer" Visibility="{Binding EnableLanes, RelativeSource={RelativeSource TemplatedParent},                             Converter={StaticResource visibilityConverter}}" Canvas.ZIndex="0" />
                        <Canvas x:Name="laneGridColumnHeaderContainer" Visibility="{Binding EnableLanes, RelativeSource={RelativeSource                             TemplatedParent}, Converter={StaticResource visibilityConverter}}" Canvas.ZIndex="1" />
                        <Canvas x:Name="laneGridRowHeaderContainer" Visibility="{Binding EnableLanes, RelativeSource={RelativeSource TemplatedParent},                             Converter={StaticResource visibilityConverter}}" Canvas.ZIndex="1" />
                        <ContentPresenter Canvas.ZIndex="2" />
                        <Canvas x:Name="foregroundLayer" Canvas.ZIndex="3" />
                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="lanes:FourSidedBorder">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="lanes:FourSidedBorder">
                    <Border
                        BorderBrush="{Binding BorderStyle.LeftBorderPen.Brush, RelativeSource={RelativeSource TemplatedParent}}"
                        BorderThickness="{Binding BorderStyle.LeftBorderPen.Thickness, Converter={StaticResource thicknessConverter}, ConverterParameter=Left, RelativeSource={RelativeSource TemplatedParent}}">
                        <Border
                            BorderBrush="{Binding BorderStyle.TopBorderPen.Brush, RelativeSource={RelativeSource TemplatedParent}}"
                            BorderThickness="{Binding BorderStyle.TopBorderPen.Thickness, Converter={StaticResource thicknessConverter}, ConverterParameter=Top, RelativeSource={RelativeSource TemplatedParent}}">
                            <Border
                                BorderBrush="{Binding BorderStyle.RightBorderPen.Brush, RelativeSource={RelativeSource TemplatedParent}}"
                                BorderThickness="{Binding BorderStyle.RightBorderPen.Thickness, Converter={StaticResource thicknessConverter}, ConverterParameter=Right, RelativeSource={RelativeSource TemplatedParent}}">
                                <Border
                                    BorderBrush="{Binding BorderStyle.BottomBorderPen.Brush, RelativeSource={RelativeSource TemplatedParent}}"
                                    BorderThickness="{Binding BorderStyle.BottomBorderPen.Thickness, Converter={StaticResource thicknessConverter}, ConverterParameter=Bottom, RelativeSource={RelativeSource TemplatedParent}}">
                                    <Border
          Background="{Binding BorderStyle.BackgroundBrush, RelativeSource={RelativeSource TemplatedParent}}">
                                        <ContentPresenter />
                                    </Border>
                                </Border>
                            </Border>
                        </Border>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="lanes:LaneGridHeaderPresenter">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="lanes:LaneGridHeaderPresenter">
                    <lanes:FourSidedBorder BorderStyle="{Binding Style}">
                        <TextBlock Text="{Binding Title}" />
                    </lanes:FourSidedBorder>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="lanes:LaneGridCellPresenter">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="lanes:LaneGridCellPresenter">
                    <lanes:FourSidedBorder BorderStyle="{Binding Style}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:LinkLabel">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:LinkLabel">
                    <TextBlock
                        Text="{TemplateBinding Text}"
                        Foreground="{TemplateBinding Foreground}"
                        FontFamily="{TemplateBinding FontFamily}"
                        FontSize="{TemplateBinding FontSize}"
                        FontStretch="{TemplateBinding FontStretch}"
                        FontStyle="{TemplateBinding FontStyle}"
                        FontWeight="{TemplateBinding FontWeight}"
                        TextWrapping="{Binding EnableWrap, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource textWrappingConverter}}"
                        MaxWidth="{TemplateBinding MaxWidth}"
                        MaxHeight="{TemplateBinding MaxHeight}"
                        Margin="{TemplateBinding Margin}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:ShapeNode">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:ShapeNode">
                    <Canvas x:Name="Adorner">                        <Path x:Name="Shape"
                            Data="{TemplateBinding ShapeGeometry}"
                            Stroke="{TemplateBinding Stroke}"
                            DataContext="{TemplateBinding StrokeDashArray}"
                            StrokeDashArray="{Binding Converter={StaticResource dashArrayConverter}}"
                            StrokeDashCap="{TemplateBinding StrokeDashCap}"
                            StrokeDashOffset="{TemplateBinding StrokeDashOffset}"
                            StrokeEndLineCap="{TemplateBinding StrokeEndLineCap}"
                            StrokeLineJoin="{TemplateBinding StrokeLineJoin}"
                            StrokeMiterLimit="{TemplateBinding StrokeMiterLimit}"
                            StrokeStartLineCap="{TemplateBinding StrokeStartLineCap}"
                            StrokeThickness="{TemplateBinding StrokeThickness}"
                            Fill="{TemplateBinding Brush}"
                            Visibility="{TemplateBinding ShapeVisibility}"
                            Opacity="{TemplateBinding ShapeOpacity}" />                        <Grid Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                            <Image x:Name="Image"
                                Source="{TemplateBinding Image}"
                                HorizontalAlignment="{TemplateBinding HorizontalImageAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalImageAlignment}"
                                Stretch="{TemplateBinding ImageStretch}">
                            </Image>
                        </Grid>                        <Grid
                            Margin="{TemplateBinding TextMargin}"
                            Width="{TemplateBinding TextWidth}"
                            Height="{TemplateBinding TextHeight}"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top">                            <TextBlock
                                Text="{TemplateBinding Text}"
                                FontFamily="{TemplateBinding FontFamily}"
                                FontSize="{TemplateBinding FontSize}"
                                FontStretch="{TemplateBinding FontStretch}"
                                FontStyle="{TemplateBinding FontStyle}"
                                FontWeight="{TemplateBinding FontWeight}"
                                HorizontalAlignment="{TemplateBinding HorizontalTextBlockAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalTextBlockAlignment}"
                                TextAlignment="{TemplateBinding TextAlignment}"
                                TextWrapping="{TemplateBinding TextWrapping}"
                                Foreground="{TemplateBinding TextBrush}">
                            </TextBlock>                        </Grid>                        <ContentPresenter
                                Content="{TemplateBinding DecorationsContainer}"
                                Visibility="{TemplateBinding ShapeVisibility}" />                        <Grid Name="EffectsContainer" />                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:TableNode">
        <Setter Property="BorderRadius" Value="8"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:TableNode">
                    <Canvas x:Name="Adorner">                        <Canvas.Resources>
                            <local:GeometryCloneConverter x:Key="geometryCloneConverter"/>
                        </Canvas.Resources>                        <Grid x:Name="ContainerGrid"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Stretch"
                            Width="{TemplateBinding Width}"
                            Height="{TemplateBinding Height}"
                            Clip="{Binding BorderGeometry, Mode=OneWay,
                            RelativeSource={RelativeSource TemplatedParent},
                            Converter={StaticResource geometryCloneConverter}}"
                            Background="{TemplateBinding Brush}"
                            Opacity="{TemplateBinding ShapeOpacity}">                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>                            <Rectangle Fill="{TemplateBinding CaptionBackBrush}" />                            <TextBlock
                                Text="{TemplateBinding Caption}"
                                FontFamily="{TemplateBinding FontFamily}"
                                FontSize="{TemplateBinding FontSize}"
                                FontStretch="{TemplateBinding FontStretch}"
                                FontStyle="{TemplateBinding FontStyle}"
                                FontWeight="{TemplateBinding FontWeight}"
                                TextAlignment="Center"
                                Foreground="{TemplateBinding TextBrush}"
                                Height="{TemplateBinding CaptionHeight}"/>                            <Rectangle Height="1" VerticalAlignment="Bottom"
                                HorizontalAlignment="Stretch" Fill="Black"/>                            <Grid x:Name="RowsGrid" Grid.Row="1" />                        </Grid>                        <Path
                            Stroke="{TemplateBinding Stroke}"
                            DataContext="{TemplateBinding StrokeDashArray}"
                            StrokeDashArray="{Binding Converter={StaticResource dashArrayConverter}}"
                            StrokeDashCap="{TemplateBinding StrokeDashCap}"
                            StrokeDashOffset="{TemplateBinding StrokeDashOffset}"
                            StrokeEndLineCap="{TemplateBinding StrokeEndLineCap}"
                            StrokeLineJoin="{TemplateBinding StrokeLineJoin}"
                            StrokeMiterLimit="{TemplateBinding StrokeMiterLimit}"
                            StrokeStartLineCap="{TemplateBinding StrokeStartLineCap}"
                            StrokeThickness="{TemplateBinding StrokeThickness}"
                            Data="{Binding BorderGeometry, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource geometryCloneConverter}}" />                        <Grid Name="EffectsContainer" />                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:Cell">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:Cell">
                    <Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                        BorderThickness="0, 0, 1, 1" BorderBrush="Black">
                        <TextBlock
                            Text="{TemplateBinding Text}"
                            Foreground="{TemplateBinding Foreground}"
                            TextAlignment="{TemplateBinding TextAlignment}"
                            FontFamily="{TemplateBinding FontFamily}"
                            FontSize="{TemplateBinding FontSize}"
                            FontStretch="{TemplateBinding FontStretch}"
                            FontStyle="{TemplateBinding FontStyle}"
                            FontWeight="{TemplateBinding FontWeight}"
                            Margin="2, 1, 2, 1" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:TreeViewNode">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:TreeViewNode">
                    <Canvas x:Name="Adorner">
                        <Canvas.Resources>
                            <local:GeometryCloneConverter x:Key="geometryCloneConverter"/>
                        </Canvas.Resources>                        <Rectangle Fill="{TemplateBinding Brush}"
                            Opacity="{TemplateBinding ShapeOpacity}"
                            Width="{TemplateBinding Width}"
                            Height="{TemplateBinding Height}" />                        <Grid Margin="0" x:Name="ContainerGrid"
                            Width="{TemplateBinding Width}"
                            Height="{TemplateBinding Height}">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>                            <Grid Grid.Row="0" VerticalAlignment="Top" Height="{TemplateBinding CaptionHeight}">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>                                <Image x:Name="Image"
                                    Height="{TemplateBinding CaptionHeight}"
                                    Source="{TemplateBinding CaptionImage}"
                                    Stretch="UniformToFill"
                                    VerticalAlignment="Top"
                                    HorizontalAlignment="Left"
                                    Grid.Column="0" Grid.Row="0" />                                <TextBlock
                                    Text="{TemplateBinding Caption}"
                                    FontFamily="{TemplateBinding FontFamily}"
                                    FontSize="{TemplateBinding FontSize}"
                                    FontStretch="{TemplateBinding FontStretch}"
                                    FontStyle="{TemplateBinding FontStyle}"
                                    FontWeight="{TemplateBinding FontWeight}"
                                    Grid.Column="1"
                                    Padding="0"
                                    VerticalAlignment="Center"
                                    HorizontalAlignment="Left"
                                    TextAlignment="Center"
                                    Height="{TemplateBinding CaptionHeight}" />                                <Rectangle Height="1"
                                    Grid.ColumnSpan="2"
                                    VerticalAlignment="Bottom"
                                    HorizontalAlignment="Stretch"
                                    Fill="Black"/>
                            </Grid>
                            <Grid Grid.Row="1">                                <ScrollViewer
                                    x:Name="ScrollViewer"
                                    Padding="0" Margin="0"
                                    HorizontalScrollBarVisibility="Hidden">
                                    <local:TreeView Visibility="Visible"
                                        Margin="0"
                                        ItemsSource="{TemplateBinding RootItems}"
                                        />
                                </ScrollViewer>
                            </Grid>
                        </Grid>                        <Path StrokeThickness="1" Stroke="Black"
                            Data="{Binding BorderGeometry, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource geometryCloneConverter}}"/>                        <Grid Name="EffectsContainer" />                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:TreeViewItem">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:TreeViewItem">
                    <Grid Background="{TemplateBinding Background}">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="{TemplateBinding LabelHeight}" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>                        <Grid.ColumnDefinitions>
                            <ColumnDefinition
                                MaxWidth="15"
                                MinWidth="15"
                                Width="{TemplateBinding ExpanderButtonWidth}" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>                        <Border
                            x:Name="ExpanderButton"
                            Visibility="{TemplateBinding ExpanderVisibility}"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Width="11" Height="11" Padding="0"
                            BorderBrush="#FF9D9D9D" BorderThickness="1">                            <Border.Background>
                                <LinearGradientBrush>
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStop Offset="0.0" Color="#FFFDFDFD" />
                                        <GradientStop Offset="1.0" Color="#FFBDBDBD" />
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Border.Background>
                            <Grid>
                                <Grid Visibility="{TemplateBinding ExpandedIconVisibility}">
                                    <Path
                                        Data="M 4.5,1 L 4.5,8"
                                        StrokeThickness="1"
                                        StrokeLineJoin="Miter">
                                        <Path.Stroke>
                                            <SolidColorBrush Color="#FF000000" />
                                        </Path.Stroke>
                                    </Path>
                                </Grid>
                                <Grid>
                                    <Path
                                        Margin="0"
                                        Data="M 1,4.5 L 8,4.5"
                                        StrokeLineJoin="Miter" StrokeThickness="1">
                                        <Path.Stroke>
                                            <SolidColorBrush Color="#FF000000" />
                                        </Path.Stroke>
                                    </Path>
                                </Grid>
                            </Grid>
                        </Border>                        <Image Grid.Column="1" Source="{TemplateBinding Image}"
                            Stretch="{TemplateBinding ImageStretch}"
                            x:Name="Image" IsHitTestVisible="False" />                        <Grid Grid.Column="2" Height="{TemplateBinding LabelHeight}"
                            VerticalAlignment="Center" IsHitTestVisible="False" >                            <TextBlock x:Name="TextBlock"
                                Text="{TemplateBinding Label}"
                                FontFamily="{TemplateBinding FontFamily}"
                                FontSize="{TemplateBinding FontSize}"
                                FontStretch="{TemplateBinding FontStretch}"
                                FontStyle="{TemplateBinding FontStyle}"
                                FontWeight="{TemplateBinding FontWeight}"
                                Foreground="{TemplateBinding LabelBrush}"
                                VerticalAlignment="Center"
                                Padding="0" />
                        </Grid>                        <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3">
                            <local:TreeView x:Name="ItemsHost"
                                Visibility="{TemplateBinding ItemsVisibility}"
                                Margin="{TemplateBinding TreeDepth}"
                                ItemsSource="{TemplateBinding Children}" />
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <Style TargetType="local:ExpandButton">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:ExpandButton">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Expanded" />
                                <VisualState x:Name="Collapsed">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                           Storyboard.TargetName="CollapsedVisible"
                                           Storyboard.TargetProperty="(UIElement.Opacity)"
                                           To="1"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Viewbox StretchDirection="Both" VerticalAlignment="Center" HorizontalAlignment="Center" >
                            <Border BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Background="{TemplateBinding Background}">
                                <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                    <Grid>
                                        <Path Margin="0" Data="M 1,4.5 L 8,4.5"
                                            StrokeLineJoin="Miter" StrokeThickness="1">
                                            <Path.Stroke>
                                                <SolidColorBrush Color="#FF000000" />
                                            </Path.Stroke>
                                        </Path>
                                    </Grid>
                                    <Grid x:Name="CollapsedVisible" Opacity="0">
                                        <Path Data="M 4.5,1 L 4.5,8"  StrokeThickness="1"
                                            StrokeLineJoin="Miter">
                                            <Path.Stroke>
                                                <SolidColorBrush Color="#FF000000" />
                                            </Path.Stroke>
                                        </Path>
                                    </Grid>
                                </Grid>
                            </Border>
                        </Viewbox>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>    <!-- Magnifier -->
    <Style TargetType="local:Magnifier">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:Magnifier">
                    <Grid>
                        <Ellipse Fill="{TemplateBinding Background}" />
                        <Ellipse x:Name="PART_Lens" />
                        <Ellipse Fill="CornflowerBlue" Opacity="0.3" />
                        <Ellipse Opacity="0.3">
                            <Ellipse.Fill>
                                <RadialGradientBrush>
                                    <GradientStop Color="#00000000" Offset="0.0"/>
                                    <GradientStop Color="#50000000" Offset="0.8"/>
                                    <GradientStop Color="#C8000000" Offset="1.0"/>
                                </RadialGradientBrush>
                            </Ellipse.Fill>
                        </Ellipse>
                        <Ellipse Stroke="Black" StrokeThickness="4" />
                        <Ellipse Stroke="#333333" StrokeThickness="1" Margin="1" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style></ResourceDictionary>