使WPF应用程序看起来像Metro风格，即使在Windows 7中也是如此？

Question

我喜欢新的Office Suite和Visual Studio上的窗口镶边：当然，我仍在为Windows 7开发应用程序，但我想知道是否有一种快速简便的方法（阅读：WPF样式或Windows库）来模仿这种样式。我过去曾经做过一些窗口镀铬样式设计，但是要使其外观和行为恰到好处确实很棘手。有谁知道是否有现有的模板或库可以为WPF应用程序添加“现代UI”外观？

Answer 1

我所做的就是创建自己的窗口和样式。因为我喜欢控制一切，所以我不希望某些外部库仅使用其中的Window。我看了已经在GitHub上提到的MahApps.Metro

MahApps

以及GitHub上非常漂亮的Modern UI。（仅.NET4.5）

现代UI

还有另外一个是Elysium，但我真的没有尝试过。

极乐世界

当我看这些样式的完成方式时，我做的样式真的很简单。现在我有了自己的Window，并且可以用xaml做任何我想做的事情……对我来说，这就是我自己做的主要原因。我也为您提供了一个新的工具：）我可能应该说，如果不探索Modern UI，我将无法做到这一点，这是非常有用的。我试图使它看起来像VS2012窗口。看起来像这样。

我的窗户

这是代码（请注意，它的目标是.NET4.5）

public class MyWindow : Window

{

    public MyWindow()

    {

        this.CommandBindings.Add(new CommandBinding(SystemCommands.CloseWindowCommand, this.OnCloseWindow));

        this.CommandBindings.Add(new CommandBinding(SystemCommands.MaximizeWindowCommand, this.OnMaximizeWindow, this.OnCanResizeWindow));

        this.CommandBindings.Add(new CommandBinding(SystemCommands.MinimizeWindowCommand, this.OnMinimizeWindow, this.OnCanMinimizeWindow));

        this.CommandBindings.Add(new CommandBinding(SystemCommands.RestoreWindowCommand, this.OnRestoreWindow, this.OnCanResizeWindow));

    }

    private void OnCanResizeWindow(object sender, CanExecuteRoutedEventArgs e)

    {

        e.CanExecute = this.ResizeMode == ResizeMode.CanResize || this.ResizeMode == ResizeMode.CanResizeWithGrip;

    }

    private void OnCanMinimizeWindow(object sender, CanExecuteRoutedEventArgs e)

    {

        e.CanExecute = this.ResizeMode != ResizeMode.NoResize;

    }

    private void OnCloseWindow(object target, ExecutedRoutedEventArgs e)

    {

        SystemCommands.CloseWindow(this);

    }

    private void OnMaximizeWindow(object target, ExecutedRoutedEventArgs e)

    {

        SystemCommands.MaximizeWindow(this);

    }

    private void OnMinimizeWindow(object target, ExecutedRoutedEventArgs e)

    {

        SystemCommands.MinimizeWindow(this);

    }

    private void OnRestoreWindow(object target, ExecutedRoutedEventArgs e)

    {

        SystemCommands.RestoreWindow(this);

    }

}

这里的资源：

<BooleanToVisibilityConverter x:Key="bool2VisibilityConverter" />

<Color x:Key="WindowBackgroundColor">#FF2D2D30</Color>

<Color x:Key="HighlightColor">#FF3F3F41</Color>

<Color x:Key="BlueColor">#FF007ACC</Color>

<Color x:Key="ForegroundColor">#FFF4F4F5</Color>

<SolidColorBrush x:Key="WindowBackgroundColorBrush" Color="{StaticResource WindowBackgroundColor}"/>

<SolidColorBrush x:Key="HighlightColorBrush" Color="{StaticResource HighlightColor}"/>

<SolidColorBrush x:Key="BlueColorBrush" Color="{StaticResource BlueColor}"/>

<SolidColorBrush x:Key="ForegroundColorBrush" Color="{StaticResource ForegroundColor}"/>

<Style x:Key="WindowButtonStyle" TargetType="{x:Type Button}">

    <Setter Property="Foreground" Value="{DynamicResource ForegroundColorBrush}" />

    <Setter Property="Background" Value="Transparent" />

    <Setter Property="HorizontalContentAlignment" Value="Center" />

    <Setter Property="VerticalContentAlignment" Value="Center" />

    <Setter Property="Padding" Value="1" />

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type Button}">

                <Grid Background="{TemplateBinding Background}">

                    <ContentPresenter x:Name="contentPresenter"

                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"

                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"

                          Margin="{TemplateBinding Padding}"

                          RecognizesAccessKey="True" />

                </Grid>

                <ControlTemplate.Triggers>

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

                        <Setter Property="Background" Value="{StaticResource HighlightColorBrush}" />

                    </Trigger>

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

                        <Setter Property="Background" Value="{DynamicResource BlueColorBrush}" />

                    </Trigger>

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

                        <Setter TargetName="contentPresenter" Property="Opacity" Value=".5" />

                    </Trigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

<Style x:Key="MyWindowStyle" TargetType="local:MyWindow">

    <Setter Property="Foreground" Value="{DynamicResource ForegroundColorBrush}" />

    <Setter Property="Background" Value="{DynamicResource WindowBackgroundBrush}"/>

    <Setter Property="ResizeMode" Value="CanResizeWithGrip" />

    <Setter Property="UseLayoutRounding" Value="True" />

    <Setter Property="TextOptions.TextFormattingMode" Value="Display" />

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="local:MyWindow">

                <Border x:Name="WindowBorder" Margin="{Binding Source={x:Static SystemParameters.WindowNonClientFrameThickness}}" Background="{StaticResource WindowBackgroundColorBrush}">

                    <Grid>

                        <Border BorderThickness="1">

                            <AdornerDecorator>

                                <Grid x:Name="LayoutRoot">

                                    <Grid.RowDefinitions>

                                        <RowDefinition Height="25" />

                                        <RowDefinition Height="*" />

                                        <RowDefinition Height="15" />

                                    </Grid.RowDefinitions>

                                    <ContentPresenter Grid.Row="1" Grid.RowSpan="2" Margin="7"/>

                                    <Rectangle x:Name="HeaderBackground" Height="25" Fill="{DynamicResource WindowBackgroundColorBrush}" VerticalAlignment="Top" Grid.Row="0"/>

                                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" WindowChrome.IsHitTestVisibleInChrome="True" Grid.Row="0">

                                        <Button Command="{Binding Source={x:Static SystemCommands.MinimizeWindowCommand}}" ToolTip="minimize" Style="{StaticResource WindowButtonStyle}">

                                            <Button.Content>

                                                <Grid Width="30" Height="25" RenderTransform="1,0,0,1,0,1">

                                                    <Path Data="M0,6 L8,6 Z" Width="8" Height="7" VerticalAlignment="Center" HorizontalAlignment="Center"

                                                        Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="2"  />

                                                </Grid>

                                            </Button.Content>

                                        </Button>

                                        <Grid Margin="1,0,1,0">

                                            <Button x:Name="Restore" Command="{Binding Source={x:Static SystemCommands.RestoreWindowCommand}}" ToolTip="restore" Visibility="Collapsed" Style="{StaticResource WindowButtonStyle}">

                                                <Button.Content>

                                                    <Grid Width="30" Height="25" UseLayoutRounding="True" RenderTransform="1,0,0,1,.5,.5">

                                                        <Path Data="M2,0 L8,0 L8,6 M0,3 L6,3 M0,2 L6,2 L6,8 L0,8 Z" Width="8" Height="8" VerticalAlignment="Center" HorizontalAlignment="Center"

                                                            Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="1"  />

                                                    </Grid>

                                                </Button.Content>

                                            </Button>

                                            <Button x:Name="Maximize" Command="{Binding Source={x:Static SystemCommands.MaximizeWindowCommand}}" ToolTip="maximize" Style="{StaticResource WindowButtonStyle}">

                                                <Button.Content>

                                                    <Grid Width="31" Height="25">

                                                        <Path Data="M0,1 L9,1 L9,8 L0,8 Z" Width="9" Height="8" VerticalAlignment="Center" HorizontalAlignment="Center"

                                                            Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="2"  />

                                                    </Grid>

                                                </Button.Content>

                                            </Button>

                                        </Grid>

                                        <Button Command="{Binding Source={x:Static SystemCommands.CloseWindowCommand}}" ToolTip="close"  Style="{StaticResource WindowButtonStyle}">

                                            <Button.Content>

                                                <Grid Width="30" Height="25" RenderTransform="1,0,0,1,0,1">

                                                    <Path Data="M0,0 L8,7 M8,0 L0,7 Z" Width="8" Height="7" VerticalAlignment="Center" HorizontalAlignment="Center"

                                                        Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="1.5"  />

                                                </Grid>

                                            </Button.Content>

                                        </Button>

                                    </StackPanel>

                                    <TextBlock x:Name="WindowTitleTextBlock" Grid.Row="0" Text="{TemplateBinding Title}" HorizontalAlignment="Left" TextTrimming="CharacterEllipsis" VerticalAlignment="Center"  Margin="8 -1 0 0"  FontSize="16"  Foreground="{TemplateBinding Foreground}"/>

                                    <Grid Grid.Row="2">

                                        <Path x:Name="ResizeGrip" Visibility="Collapsed" Width="12" Height="12" Margin="1" HorizontalAlignment="Right"

                                        Stroke="{StaticResource BlueColorBrush}" StrokeThickness="1" Stretch="None" Data="F1 M1,10 L3,10 M5,10 L7,10 M9,10 L11,10 M2,9 L2,11 M6,9 L6,11 M10,9 L10,11 M5,6 L7,6 M9,6 L11,6 M6,5 L6,7 M10,5 L10,7 M9,2 L11,2 M10,1 L10,3" />

                                    </Grid>

                                </Grid>

                            </AdornerDecorator>

                        </Border>

                        <Border BorderBrush="{StaticResource BlueColorBrush}" BorderThickness="1" Visibility="{Binding IsActive, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Converter={StaticResource bool2VisibilityConverter}}" />

                    </Grid>

                </Border>

                <ControlTemplate.Triggers>

                    <Trigger Property="WindowState" Value="Maximized">

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

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

                        <Setter TargetName="LayoutRoot" Property="Margin" Value="7" />

                    </Trigger>

                    <Trigger Property="WindowState" Value="Normal">

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

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

                    </Trigger>

                    <MultiTrigger>

                        <MultiTrigger.Conditions>

                            <Condition Property="ResizeMode" Value="CanResizeWithGrip" />

                            <Condition Property="WindowState" Value="Normal" />

                        </MultiTrigger.Conditions>

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

                    </MultiTrigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

    <Setter Property="WindowChrome.WindowChrome">

        <Setter.Value>

            <WindowChrome CornerRadius="0" GlassFrameThickness="1" UseAeroCaptionButtons="False" />

        </Setter.Value>

    </Setter>

</Style>