WPF 使用 MaterialDesign 控件库

铱临

已于 2024-07-10 18:46:22 修改

阅读量2.9k

点赞数

分类专栏： WPF 控件库文章标签： c#

于 2020-05-11 13:55:41 首次发布

本文链接：https://blog.csdn.net/qq_31682605/article/details/106052265

版权

WPF 控件库专栏收录该内容

1 篇文章

订阅专栏

连接

官网：链接: http://materialdesigninxaml.net.

GitHub源码及DemoApp地址：https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/releases.

使用

1.安装

在NuGet安装MaterialDesignThemes
在这里插入图片描述

3.1版本使用方式

2.添加配置

在App.xaml文件中添加

 <Application.Resources>
     <ResourceDictionary>
         <ResourceDictionary.MergedDictionaries>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.DeepPurple.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Lime.xaml"/>
         </ResourceDictionary.MergedDictionaries>
     </ResourceDictionary>
 </Application.Resources>

3.引入命名空间

在需要的窗体内添加：xmlns:materialDesign=“http://materialdesigninxaml.net/winfx/xaml/themes”

<Window x:Class="HostComputer.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:HostComputer"
        
        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
        
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">

4.使用控件

1）打开下载好的DemoApp选择要使用的控件。
在这里插入图片描述
2）复制到程序中

3）运行效果
添加成功

5.修改主题风格

在App.xaml文件中添加
一共三个级别，浅色系、中色系和深色系

 <Application.Resources>
     <ResourceDictionary>
         <ResourceDictionary.MergedDictionaries>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.DeepPurple.xaml"/>
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Lime.xaml"/>
         </ResourceDictionary.MergedDictionaries>
         <SolidColorBrush x:Key="PrimaryHueLightBrush" Color="#ffc947"/>
         <SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="#ffffff"/>
         <SolidColorBrush x:Key="PrimaryHueMidBrush" Color="#ff9800"/>
         <SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="#ffffff"/>
         <SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="#c66900"/>
         <SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="#ffffff"/>
     </ResourceDictionary>
 </Application.Resources>

效果
在这里插入图片描述

5.1版本使用方式

1、添加配置

在App.xaml文件中添加

<Application 
x:Class="Example.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"

StartupUri="MainWindow.xaml">
 <Application.Resources>
     <ResourceDictionary>
         <ResourceDictionary.MergedDictionaries>
         
             <materialDesign:BundledTheme BaseTheme="Light" PrimaryColor="DeepPurple" SecondaryColor="Lime" />
             <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesign2.Defaults.xaml" /> 
             
         </ResourceDictionary.MergedDictionaries>
     </ResourceDictionary>
 </Application.Resources>
</Application>