近来又需开发桌面程序，要用WPF开发，将以前的知识拿出来又看了下。

绘制WPF窗口时，需要将控件与样式进行分离，样式单独放到一个文件里。

首先创建样式资源文件：

样式文件中这样写：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

                    xmlns:local="clr-namespace:WpfApp1.style" xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">

    <Style x:Key="MenuItemStyle" TargetType="{x:Type MenuItem}">

        <Setter Property="Margin" Value="10,10,10,10" />

    </Style>

    <ControlTemplate x:Key="TopMenuStyle" TargetType="{x:Type MenuItem}">

        <Grid SnapsToDevicePixels="True">

            <Rectangle x:Name="OuterBorder" RadiusY="2" RadiusX="2"/>

            <Rectangle x:Name="Bg" Fill="{TemplateBinding Background}" Margin="1" RadiusY="1" RadiusX="1" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="1"/>

            <Rectangle x:Name="InnerBorder" Margin="2"/>

            <DockPanel>

                <ContentPresenter x:Name="Icon" Content="{TemplateBinding Icon}" ContentSource="Icon" Margin="4,0,6,0" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>

                <Path x:Name="GlyphPanel" Data="M0,5.1L1.7,5.2 3.4,7.1 8,0.4 9.2,0 3.3,10.8z" Fill="{TemplateBinding Foreground}" FlowDirection="LeftToRight" Margin="7,0,0,0" Visibility="Collapsed" VerticalAlignment="Center"/>

                <ContentPresenter ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" ContentStringFormat="{TemplateBinding HeaderStringFormat}" ContentSource="Header" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>

            </DockPanel>

            <Popup x:Name="PART_Popup" AllowsTransparency="True" Focusable="False" HorizontalOffset="1" IsOpen="{Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" Placement="Bottom" VerticalOffset="-1">

                <Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent">

                    <Border x:Name="SubMenuBorder" BorderBrush="#FF959595" BorderThickness="1" Background="WhiteSmoke">

                        <ScrollViewer x:Name="SubMenuScrollViewer" Margin="1,0" Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}">

                            <Grid RenderOptions.ClearTypeHint="Enabled">

                                <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">

                                    <Rectangle x:Name="OpaqueRect" Fill="WhiteSmoke" Height="{Binding ActualHeight, ElementName=SubMenuBorder}" Width="{Binding ActualWidth, ElementName=SubMenuBorder}"/>

                                </Canvas>

                                <Rectangle Fill="#FFF1F1F1" HorizontalAlignment="Left" Margin="1,2" RadiusY="2" RadiusX="2" Width="28"/>

                                <Rectangle Fill="#FFE2E3E3" HorizontalAlignment="Left" Margin="29,2,0,2" Width="1"/>

                                <Rectangle Fill="White" HorizontalAlignment="Left" Margin="30,2,0,2" Width="1"/>

                                <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="True" Margin="2" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/>

                            </Grid>

                        </ScrollViewer>

                    </Border>

                </Themes:SystemDropShadowChrome>

            </Popup>

        </Grid>

        <ControlTemplate.Triggers>

            <Trigger Property="IsSuspendingPopupAnimation" Value="True">

                <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/>

            </Trigger>

            <Trigger Property="Icon" Value="{x:Null}">

                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>

            </Trigger>

            <Trigger Property="IsChecked" Value="True">

                <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>

                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>

            </Trigger>

            <Trigger Property="HasDropShadow" SourceName="PART_Popup" Value="True">

                <Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/>

                <Setter Property="Color" TargetName="Shdw" Value="#71000000"/>

            </Trigger>

            <Trigger Property="IsHighlighted" Value="True">

                <Setter Property="Stroke" TargetName="Bg" Value="#90717070"/>

                <Setter Property="Stroke" TargetName="OuterBorder" Value="#50FFFFFF"/>

                <Setter Property="Stroke" TargetName="InnerBorder" Value="#50FFFFFF"/>

            </Trigger>

            <Trigger Property="IsKeyboardFocused" Value="True">

                <Setter Property="Stroke" TargetName="Bg" Value="#E0717070"/>

                <Setter Property="Fill" TargetName="Bg">

                    <Setter.Value>

                        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                            <GradientStop Color="#28717070" Offset="0"/>

                            <GradientStop Color="#50717070" Offset="0.75"/>

                            <GradientStop Color="#90717070" Offset="1"/>

                        </LinearGradientBrush>

                    </Setter.Value>

                </Setter>

                <Setter Property="Stroke" TargetName="InnerBorder" Value="#50747272"/>

            </Trigger>

            <Trigger Property="IsSubmenuOpen" Value="True">

                <Setter Property="Stroke" TargetName="Bg" Value="#E0717070"/>

                <Setter Property="Fill" TargetName="Bg">

                    <Setter.Value>

                        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">

                            <GradientStop Color="#28717070" Offset="0"/>

                            <GradientStop Color="#50717070" Offset="0.75"/>

                            <GradientStop Color="#90717070" Offset="1"/>

                        </LinearGradientBrush>

                    </Setter.Value>

                </Setter>

                <Setter Property="Stroke" TargetName="InnerBorder" Value="#50747272"/>

            </Trigger>

            <Trigger Property="IsEnabled" Value="False">

                <Setter Property="Foreground" Value="#FF9A9A9A"/>

                <Setter Property="Fill" TargetName="GlyphPanel" Value="#FF848589"/>

            </Trigger>

            <Trigger Property="CanContentScroll" SourceName="SubMenuScrollViewer" Value="False">

                <Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=SubMenuScrollViewer}"/>

                <Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=SubMenuScrollViewer}"/>

            </Trigger>

        </ControlTemplate.Triggers>

    </ControlTemplate>

</ResourceDictionary>

MainWindow.xaml里面这样调用：

<Window x:Class="WpfApp1.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

        xmlns:local="clr-namespace:WpfApp1"

        mc:Ignorable="d"

        Title="MainWindow" Height="350" Width="525">

    <Window.Resources>

        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>

                <ResourceDictionary Source="style/Menu.xaml"></ResourceDictionary>

                <ResourceDictionary Source="style/main.xaml"></ResourceDictionary>

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>

    </Window.Resources>

    <DockPanel>

        <Menu DockPanel.Dock="Top">

            <MenuItem Header="文件" Template="{DynamicResource TopMenuStyle}" Style="{StaticResource MenuItemStyle}">

                <MenuItem Header="打开">

                    <MenuItem Header="1.txt"></MenuItem>

                    <MenuItem Header="2.txt"></MenuItem>

                    <Separator Margin="0"/>

                </MenuItem>

            </MenuItem>

            <MenuItem Header="选项" Template="{DynamicResource TopMenuStyle}" Style="{StaticResource MenuItemStyle}">

                <MenuItem Header="配置"></MenuItem>

            </MenuItem>

        </Menu>

        <DockPanel>

            <Label Content="我是一个文本" Style="{DynamicResource LabelStyle}"/>

        </DockPanel>

    </DockPanel>

</Window>

效果如下:

项目开发组  供稿