WPF样式

TreeViewItem、TextBox、Button、RichTextBox、ComboBox、GroupBox、带Path的Button、ContextMenu样式：

<!-- Separator模板 -->
<ControlTemplate x:Key="tmplSeparator" TargetType="Separator">
    <Border Background="#fff">
    </Border>
</ControlTemplate>
<!-- ContextMenu模板 -->
<ControlTemplate x:Key="tmplContextMenu" TargetType="ContextMenu">
    <Border Name="bd" Background="#000613" CornerRadius="4">
        <ItemsPresenter Margin="0 8 0 8"/>
    </Border>
</ControlTemplate>
<!-- MenuItem模板 -->
<ControlTemplate x:Key="tmplMenuItem" TargetType="MenuItem">
    <Border Name="bd" Height="35" Background="Transparent">
        <StackPanel Orientation="Horizontal">
            <Image x:Name="img" Stretch="None" Margin="10 0 10 0" Source="/SunCreate.Common.Controls;Component/Images/Controls/二级菜单左箭头.png"></Image>
            <TextBlock x:Name="tb" Margin="0 0 10 0" Foreground="#fff" VerticalAlignment="Center" Text="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}"/>
        </StackPanel>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="bd" Property="Background" Value="#111623" />
            <Setter TargetName="tb" Property="Foreground" Value="#FF5E5E" />
            <Setter TargetName="tb" Property="Margin" Value="0 0 9 0" />
            <Setter TargetName="img" Property="Source" Value="/SunCreate.Common.Controls;Component/Images/Controls/左箭头_选中.png"></Setter>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<!-- TreeViewItem模板 -->
<ControlTemplate x:Key="tmplTreeViewItem" TargetType="{x:Type TreeViewItem}">
    <StackPanel>
        <StackPanel Orientation="Horizontal">
            <ToggleButton x:Name="toggleButton" Focusable="True" IsChecked="{Binding RelativeSource={RelativeSource Mode=TemplatedParent},Path=IsExpanded,Mode=TwoWay}" IsTabStop="False">
                <ToggleButton.Template>
                    <ControlTemplate TargetType="{x:Type ToggleButton}" >
                        <Border Height="20" Width="20" Background="Transparent">
                            <Path Height="7" Width="7" Stretch="Fill" HorizontalAlignment="Center" Name="expander" RenderTransformOrigin="0.5,0.5" Data="M0,0 L0,6 L6,0 z" Stroke="#ffffff" StrokeThickness="1"  VerticalAlignment="Center"  Visibility="{Binding ExpandVisibility}">
                            </Path>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="true">
                                <Setter Property="RenderTransform" TargetName="expander">
                                    <Setter.Value>
                                        <RotateTransform Angle="180"/>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Fill" TargetName="expander" Value="#ffffff">
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsChecked" Value="false">
                                <Setter Property="RenderTransform" TargetName="expander">
                                    <Setter.Value>
                                        <RotateTransform Angle="135"/>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Fill" TargetName="expander" Value="#333">
                                </Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ToggleButton.Template>
            </ToggleButton>
            <Grid Background="Transparent">
                <Border x:Name="itemContainer" Height="30" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="2 0 0 0" CornerRadius="2" Background="Transparent" Tag="{Binding}" MouseLeftButtonDown="itemContainer_MouseLeftButtonDown" MouseRightButtonDown="itemContainer_MouseRightButtonDown" >
                    <TextBlock x:Name="textBlock" Margin="5 0 5 0" Text="{Binding Name}" Foreground="#ffffff" FontSize="{Binding FontSize}" VerticalAlignment="Center" />
                </Border>
                <Grid.ContextMenu>
                    <ContextMenu Template="{StaticResource tmplContextMenu}">
                        <MenuItem Header="新增" Template="{StaticResource tmplMenuItem}"  Tag="{Binding}" CommandParameter="1" Click="MenuItem_Click" Visibility="{Binding AddMenuVisibility}"></MenuItem>
                        <MenuItem Header="新增监所区域" Template="{StaticResource tmplMenuItem}"  Tag="{Binding}" CommandParameter="3" Click="MenuItem_Click" Visibility="{Binding AddPrisonZoomMenuVisibility}"></MenuItem>
                        <Separator Height="1" Template="{StaticResource tmplSeparator}" Margin="1 0 1 0"></Separator>
                        <MenuItem Header="删除" Template="{StaticResource tmplMenuItem}"  Tag="{Binding}" CommandParameter="2" Click="MenuItem_Click"></MenuItem>
                    </ContextMenu>
                </Grid.ContextMenu>
            </Grid>
        </StackPanel>
        <Grid  x:Name="itemspanel" Visibility="Collapsed" Margin="15 0 0 0">
            <ItemsPresenter/>
        </Grid>
    </StackPanel>
    <ControlTemplate.Triggers>
        <Trigger Property="IsSelected" Value="true">
            <Setter Property="Foreground" TargetName="textBlock" Value="#ffffff"/>
            <Setter Property="Background" TargetName="itemContainer" Value="#00ddcc"/>
        </Trigger>
        <Trigger Property="IsExpanded" Value="true">
            <Setter TargetName="itemspanel" Property="Visibility" Value="Visible"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<!-- TreeViewItem样式 -->
<Style x:Key="stlTreeViewItem" TargetType="{x:Type TreeViewItem}">
    <Setter Property="Template" Value="{StaticResource tmplTreeViewItem}"></Setter>
    <Setter Property="ItemsSource" Value="{Binding Children}"></Setter>
    <Setter Property="IsExpanded" Value="{Binding IsExpanded}"></Setter>
    <Setter Property="IsSelected" Value="{Binding IsSelected}"></Setter>
    <Setter Property="Tag" Value="{Binding}"></Setter>
    <EventSetter Event="Selected" Handler="TreeViewItem_Selected"></EventSetter>
</Style>
<!-- 带Path的Button模板 -->
<ControlTemplate x:Key="tmplPathBtn" TargetType="{x:Type Button}">
    <Border x:Name="border" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Background="Transparent" >
        <Path x:Name="path1" Width="12" Height="12" Fill="#ffffff" Stretch="Fill" Data="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center" >
        </Path>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsPressed" Value="true">
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<!-- TextBox模板 -->
<ControlTemplate x:Key="tmplTextBox">
    <Border CornerRadius="3" Background="#000613" BorderBrush="#aaaaaa" BorderThickness="1">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition Width="25"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <ScrollViewer x:Name="PART_ContentHost" Margin="2 0 0 0" VerticalAlignment="Center"></ScrollViewer>
            <TextBlock  x:Name="prompt" Visibility="Collapsed" Foreground="#ffffff" FontSize="14" Text="请输入内容" Margin="10,0,0,0" VerticalAlignment="Center" Opacity="0.4"></TextBlock>
            <Button x:Name="btnClear" Grid.Column="1"  Width="16"  Height="16" Click="btnClear_Click" HorizontalAlignment="Center" VerticalAlignment="Center"  Template="{StaticResource tmplPathBtn}" Background="Transparent" >
                <Geometry>M1,0 L6,5 L11,0 L12,1 L7,6 L12,11 L11,12 L6,7 L1,12 L0,11 L5,6 L0,1 z</Geometry>
            </Button>
        </Grid>
    </Border>
    <ControlTemplate.Triggers>
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Text}" Value="">
            <Setter TargetName="btnClear" Property="Visibility" Value="Collapsed"></Setter>
        </DataTrigger>
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Text}" Value="">
            <Setter TargetName="prompt" Property="Visibility" Value="Visible"></Setter>
        </DataTrigger>
        <Trigger  Property="IsFocused" Value="true">
            <Setter TargetName="prompt" Property="Visibility" Value="Collapsed"></Setter>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<!-- TextBox样式 -->
<Style x:Key="stlTextBox" TargetType="{x:Type TextBox}">
    <Setter Property="Template" Value="{StaticResource tmplTextBox}"></Setter>
    <Setter Property="Height" Value="35"></Setter>
    <Setter Property="Validation.ErrorTemplate">
        <Setter.Value>
            <ControlTemplate>
                <Border BorderThickness="0" BorderBrush="Transparent" Visibility="Collapsed">
                    <AdornedElementPlaceholder />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<!-- Button模板 -->
<ControlTemplate x:Key="tmplButton" TargetType="{x:Type Button}">
    <Border x:Name="border" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Background="#1495eb" CornerRadius="5">
        <TextBlock Foreground="#ffffff" Text="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
            <Setter TargetName="border" Property="Background" Value="#33c4f5"></Setter>
        </Trigger>
        <Trigger Property="IsPressed" Value="true">
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<!-- Button样式 -->
<Style x:Key="stlButton" TargetType="{x:Type Button}">
    <Setter Property="Template" Value="{StaticResource tmplButton}"></Setter>
    <Setter Property="Height" Value="33"></Setter>
</Style>
<!-- RichTextBox样式 -->
<Style x:Key="stlRichTextBox" TargetType="{x:Type RichTextBox}" >
    <Setter Property="VerticalScrollBarVisibility" Value="Auto" />
    <Setter Property="Margin" Value="5 0 0 0" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="CaretBrush" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RichTextBox}">
                <Border CornerRadius="3" Background="#000613" BorderBrush="#aaaaaa" BorderThickness="1">
                    <Grid>
                        <Label x:Name="prompt" Margin="5 0 0 0" Content="请输入内容" Foreground="#ffffff" FontSize="14" Opacity="0.4" VerticalAlignment="Top" Visibility="Collapsed" Focusable="False" />
                        <Border x:Name="border" Margin="0 8 0 5">
                            <ScrollViewer Margin="0" VerticalAlignment="Top" x:Name="PART_ContentHost" Height="{Binding ActualHeight, ElementName=border}" />
                        </Border>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsFocused" Value="False" />
                            <Condition Property="Tag" Value="{x:Null}" />
                        </MultiTrigger.Conditions>
                        <Setter Property="Visibility" TargetName="prompt" Value="Visible" />
                    </MultiTrigger>
                    <Trigger Property="IsFocused" Value="True">
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Foreground" Value="Gray" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<!-- ComboBox的ToggleButton样式 -->
<Style x:Key="stlToggleButton" TargetType="{x:Type ToggleButton}" >
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Grid Background="Transparent">
                    <Border x:Name="Back" Background="Transparent" BorderThickness="0" BorderBrush="Transparent">
                        <Path x:Name="PathFill" Fill="#aaaaaa" Width="12" Height="8" StrokeThickness="0" Data="M5,0 L10,10 L0,10 z" RenderTransformOrigin="0.5,0.5" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="True" UseLayoutRounding="True">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform />
                                    <SkewTransform />
                                    <RotateTransform Angle="180" />
                                    <TranslateTransform />
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Border>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="PathFill" Property="Fill" Value="#1b94e0" />
                        <Setter TargetName="Back" Property="Background" Value="Transparent" />
                        <Setter TargetName="Back" Property="BorderBrush" Value="Transparent" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<!-- ComboBox样式 -->
<Style x:Key="stlComboBox" TargetType="ComboBox" >
    <Setter Property="SnapsToDevicePixels" Value="True"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
    <Setter Property="HorizontalAlignment" Value="Left"></Setter>
    <Setter Property="Foreground" Value="#ffffff"></Setter>
    <Setter Property="Height" Value="35"></Setter>
    <Setter Property="ItemContainerStyle">
        <Setter.Value>
            <Style TargetType="ComboBoxItem">
                <Setter Property="Height" Value="30"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                            <Grid Height="{TemplateBinding Height}" Width="{TemplateBinding Width}">
                                <Border x:Name="border" Background="Transparent">
                                    <TextBlock x:Name="txt" Margin="5 0 3 0" VerticalAlignment="Center" Foreground="#ffffff" Text="{Binding Content.Key,RelativeSource={RelativeSource TemplatedParent}}"/>
                                </Border>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter TargetName="border" Property="Background" Value="#707683" />
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="false"/>
                                        <Condition Property="IsMouseOver" Value="true"/>
                                    </MultiTrigger.Conditions>
                                    <Setter TargetName="border" Property="Background" Value="#808693" />
                                </MultiTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBox">
                <Border Background="#000613" BorderThickness="1" BorderBrush="#aaaaaa" CornerRadius="4">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition Width="30"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <TextBlock Margin="5 0 0 0" Grid.Column="0" Foreground="#ffffff" Text="{TemplateBinding Text}" Background="Transparent" VerticalAlignment="Center" HorizontalAlignment="Left"></TextBlock>
                        <ToggleButton  Grid.Column="1" Width="30" Height="30" Style="{StaticResource stlToggleButton}" IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press" HorizontalAlignment="Center" VerticalAlignment="Center"></ToggleButton>

                        <Popup x:Name="Popup" IsOpen="{TemplateBinding IsDropDownOpen}" Placement="Bottom" VerticalOffset="5" Focusable="False" AllowsTransparency="True" PopupAnimation="Slide">
                            <Border x:Name="DropDown" CornerRadius="4" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{TemplateBinding ActualWidth}" SnapsToDevicePixels="True"  Background="#000613" BorderBrush="#aaaaaa" BorderThickness="1">
                                <Border.Effect>
                                    <DropShadowEffect Color="#000613" BlurRadius="2" ShadowDepth="0" Opacity="0.5"/>
                                </Border.Effect>
                                <ScrollViewer Margin="4,6,4,6" Style="{DynamicResource ScrollViewerStyle}" MaxHeight="{TemplateBinding MaxDropDownHeight}" SnapsToDevicePixels="True" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained"/>
                                </ScrollViewer>
                            </Border>
                        </Popup>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<!-- GroupBox样式 -->
<BorderGapMaskConverter x:Key="borderGapMaskConverter"/>
<Style x:Key="stlGroupBox" TargetType="{x:Type GroupBox}">
    <Setter Property="BorderBrush" Value="#ddddee" />
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type GroupBox}">
                <Grid SnapsToDevicePixels="true">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="6" />
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="6" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="6" />
                    </Grid.RowDefinitions>
                    <Border CornerRadius="4" Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Grid.ColumnSpan="4" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="Transparent" Background="{TemplateBinding Background}" />
                    <Border Name="Header" Padding="3,1,3,0" Grid.Row="0" Grid.RowSpan="2" Grid.Column="1">
                        <ContentPresenter ContentSource="Header" RecognizesAccessKey="true" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    </Border>
                    <ContentPresenter Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    <Border Grid.Row="1" Grid.RowSpan="3" Grid.ColumnSpan="4"  BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="3">
                        <Border.OpacityMask>
                            <MultiBinding Converter="{StaticResource borderGapMaskConverter}" ConverterParameter="7">
                                <Binding ElementName="Header" Path="ActualWidth" />
                                <Binding Path="ActualWidth" RelativeSource="{RelativeSource Self}" />
                                <Binding Path="ActualHeight" RelativeSource="{RelativeSource Self}" />
                            </MultiBinding>
                        </Border.OpacityMask>
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>