概述
WPF开源的UI框架有很多,如HandyControl、MahApps.Metro、Xceed Extended WPF Toolkit™、Modern UI for WPF (MUI)、Layui-WPF、MaterialDesignInXamlToolkit、等等,今天小编带大家认识一款比较常用的开源UI---WPF UI,这款ui框架美观现代化,用起来也超级方便,下面是github源码下载链接:https://github.com/lepoco/wpfui
这个开源ui目前在github的关注量 :6.1K.
学习文档地址:https://wpfui.lepo.co/
界面展示
主界面
![](https://img.duidaima.com/PorkBelly/Article/Big/b0937fc2-6e20-4243-850c-41a7519726ef.png)
Messagebox
![](https://img.duidaima.com/PorkBelly/Article/Big/79b1a7d3-aa7b-43db-a3aa-2a1eace14b19.png)
dialog
![](https://img.duidaima.com/PorkBelly/Article/Big/a776b351-1b1d-4242-9df9-0017a38e807b.png)
snackbar
![](https://img.duidaima.com/PorkBelly/Article/Big/841e61df-f505-4157-a87f-8d7766e31fa0.png)
progress
![](https://img.duidaima.com/PorkBelly/Article/Big/150de037-62c2-45f2-88a6-6ebcf61d57f2.png)
评分点赞的控件
![](https://img.duidaima.com/PorkBelly/Article/Big/e86ade13-ec6b-4978-81da-8695b2a70298.png)
toggleswitch&sliders&Calendars&Date Pickers
![](https://img.duidaima.com/PorkBelly/Article/Big/a62c0ac3-d326-4984-9a8b-8fc315a296d8.png)
listbox&listview
![](https://img.duidaima.com/PorkBelly/Article/Big/b0786f60-3f97-4e86-bc95-bd12bb59cb2f.png)
icon
如何使用
1.添加词典
XAML以及WPF对资源字典进行操作。这些文件类似于HTML,描述控件的外观和各个方面。WPFUI添加自己的这些文件集,告诉应用程序控件应该是什么样子。在您的新应用程序中应该有一个名为App.xaml的文件。使用WPF UI控件Dictionary和ThemesDictionary类向其中添加新词典:
<Application
...
xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ui:ThemesDictionary Theme="Dark" />
<ui:ControlsDictionary />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
你可以在这里选择一个颜色主题,浅色或深色。
2.主窗口
在新创建的应用程序中应该有一个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="450" Width="800">
<Grid>
</Grid>
</Window>
您可以向该窗口添加一个新的名称空间,以告诉解释器您将在某个地方使用控件,例如WPF UI库。
<Window
...
xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml" />
3.添加控件
要从WPF UI库添加新控件,只需输入其类名,并在其前面加上UI:prefix:
<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:ui="http://schemas.lepo.co/wpfui/2022/xaml"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<ui:SymbolIcon Symbol="Fluent24"/>
</Grid>
</Window>
当涉及到基础知识时,可以在文档中找到有关单个控件的信息,在Microsoft官方文档中可以找到构建WPF应用程序的规则。您可以在此处查看如何构建MVVM应用程序。