文档目录
1、MahApps.Metro安装
您可以通过NuGet GUI安装MahApps.Metro(右键单击您的项目,单击Manage NuGet Packages,选择Online并搜索MahApps.Metro)或使用Package Manager控制台:
PM> Install-Package MahApps.Metro
如果您想使用MahApps.Metro的预发布包(这些包具有最新代码和最新功能),您需要在GUI中启用Include Prerelease:
或使用程序包管理器控制台:
PM> Install-Package MahApps.Metro -Pre
2、使用MetroWindow窗口
安装MahApps.Metro后:
打开 MainWindow.xaml
在打开的Window标记内添加此属性。(这是你在XAML中引用其他命名空间的方式):
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
或
xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
将<Window …标签更改为<Controls:MetroWindow …(记得也要更改结束标签!)
你应该有这样的东西(不要复制并粘贴):
<Controls:MetroWindow x:Class="WpfApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
Title="MainWindow"
Height="600"
Width="800">
<!-- your content -->
</Controls:MetroWindow>
3、修改cs文件
您还需要修改MainWindow.xaml.cs文件,以便基类MainWindow与MetroWindowXAML文件的类匹配。
namespace WpfApplication
{
public partial class MainWindow
{
public MainWindow()
{
InitializeComponent();
}
}
}
在原窗口入口继承MetroWindow基类
// To access MetroWindow, add the following reference
using MahApps.Metro.Controls;
namespace WpfApplication
{
public partial class MainWindow : MetroWindow
{
public MainWindow()
{
InitializeComponent();
}
}
}
最终结果将如下所示:
4、使用内置样式
MahApp.Metro的所有资源都包含在单独的资源字典中。为了使大多数控件采用MahApps.Metro主题,您需要将ResourceDictionaries添加到您的App.xaml。
App.xaml(v2.0.0和更高版本)
<Application x:Class="WpfApplication.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<!-- Accent and AppTheme setting -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
App.xaml(v1.6.5及更早版本)
<Application x:Class="WpfApplication.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<!-- Accent and AppTheme setting -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
确保所有文件名都区分大小写!
最终结果看起来像这样。如果您想了解有关控件如何工作的更多信息,可以在下面找到更多信息
5.什么是MetroWindow窗口?
默认MetroWindow值由几个组件组成:
如果您不喜欢标记的元素,请不要担心,它们都是可选的。
- 标题栏MetroWindow与滚动自己的标题不同。ShowTitleBar=“True|False”
- 调整大小的手柄不是调整大小的唯一方法MetroWindow, 可以抓住所有边角,但是MetroWindow如果没有像空气窗一样的明显窗口“chrome”,调整大小的手柄可以帮助让用户放心。
- 最小化/最大化/关闭的图标不是使用静态图像,而是称为Marlett的字体。要解释为什么这样做需要一个走下记忆的道路,或至少访问维基百科关于它的文章。
- 您甚至可以通过设置隐藏标题栏上的图标 ShowIconOnTitleBar=“True|False”
6.标题栏定制
WindowButtonCommands
WindowButtonCommands是最小化,最大化/恢复和关闭按钮。你可以用ShowMinButton=“True|False”,ShowMaxRestoreButton="True|False"和隐藏按钮ShowCloseButton=“True|False”。
最小化和最大化/恢复按钮的可见性也受到影响ResizeMode。如果ResizeMode="NoResize"按钮被折叠。如果ResizeMode="CanMinimize"最大化/恢复按钮已折叠。
(左/右)WindowCommands
您可以添加自己的控件,LeftWindowsCommands或者RightWindowsCommands- 默认情况下,按钮会自动应用一种样式,以使其适合其余部分WindowsCommands。从0.9开始,您不再局限于按钮,而是任何控件。请注意,除了按钮之外,您还负责设计任何其他设计。
在 … 标签中包含这个:
<Controls:MetroWindow x:Class="MahAppsMetroSample.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
Title="MahApps.Metro.Sample"
GlowBrush="{DynamicResource AccentColorBrush}"
WindowStartupLocation="CenterScreen">
<Controls:MetroWindow.RightWindowCommands>
<Controls:WindowCommands>
<Button Content="settings" />
<Button>
<StackPanel Orientation="Horizontal">
<iconPacks:PackIconModern Width="24" Height="24" Kind="FoodCupcake" />
<TextBlock Margin="4 0 0 0" VerticalAlignment="Center" Text="deploy cupcakes" />
</StackPanel>
</Button>
</Controls:WindowCommands>
</Controls:MetroWindow.RightWindowCommands>
<Grid>
</Grid>
</Controls:MetroWindow>
确保包含MahApps.Metro.IconPacks已被引用。
生成此窗口标题栏: