ModernUI课程：第一个ModernUI应用(手动编写)

ModernUI教程：第一个ModernUI应用(手动编写)

这篇文章带着我们从头开始创建一个Modern UI应用。有关采用项目模板和项模板创建Modern UI应用请参看  第一个ModernUI应用(采用项目模板)。

1：获取最新的ModernUI发布并解压到磁盘，或者通过Nuget安装Modern.WPF包。

2：打开Visual Studio并创建一个WPF应用项目。

3：添加对FirstFloor.ModernUI.dll的引用（如果是WPF4项目，你需要额外引用Microsoft.Windows.Shell.dll）。

4：更改MainWindow使其继承自ModernWindow.

    打开MainWindow.xaml，添加ModernUI的xmlns声明，用mui:ModernWindow替换Window元素，如下所示：

    打开MainWindow.xaml.cs，添加ModernUI的using引用，替换Window基类为ModernWindow，如下所示：

5：打开App.xaml并添加如下的资源字典引用。

为浅色主题选择ModernUI.Light.xaml,为深色主题选择ModernUI.Dark.xaml。不要同时应用这两个主题。

重要提示：如果你使用的是WPF4.0版本的ModernUI，你需要在工作区添加一个空的矩形样式(style)，这是一个bug，如下所示：

在WPF4.5中不需要如此。

6：编译运行应用，你可以看到如下打开的窗体：

7：返回MainWindow.xaml，移除<Grid></Grid>内容。

重要提示：ModernWindow.Content属性将被忽略，所有页面都是通过页面链接呈现内容。

8：让我们定义一个主菜单，添加如下的菜单链接组：

9：编译运行应用，你将看到如下窗体：

10：让我们添加一些实际的内容。添加一个名称为Page1的WPF用户控件

11：打开Page1.xaml并添加如下内容：

ContentRoot风格确保内容能够显示在屏幕的正确位置。

12：回到MainWindow.xaml修改第一个链接让它能够链接到Page1.xaml：

13：另外给ModernWindow添加一个ContentSource属性指向Page1.xaml。

ContentSource定义了一个在开始时被加载的页面，在上面这段代码中，“/Page1.xaml”将在应用启动时被加载。

14：编译并运行应用，你可以看到如下窗体：

以上便是该文章的全部。现在你可以在你的应用添加其他的组和链接到MenuLinkGroups并把他们指向各个页面。更多的内容请参看其他章节。

 

查看目录