WPF学习笔记（26）CommunityToolkit.Mvvm与MaterialDesignThemes

---

一、 CommunityToolkit.Mvvm框架

1. 常用的MVVM框架

2. CommunityToolkit.Mvvm概述

官方文档：https://learn.microsoft.com/zh-cn/dotnet/communitytoolkit/mvvm/

3. CommunityToolkit.Mvvm详解

以上文中的LoginViewModel为例，将自写的BaseViewModel类改为继承自CommunityToolkit.Mvvm中的ObservableObject

将自写的MainWindowViewModel类改为继承自CommunityToolkit.Mvvm中的ObservableObject

二、 CommunityToolkit.Mvvm源生成器

1. 源生成器概述

官方文档：https://learn.microsoft.com/zh-cn/dotnet/communitytoolkit/mvvm/generators/overview

2. 示例

源生成器不支持 .net framework，本次使用 .net6.0

将上文中的View、ViewModel、Model文件夹及其内容分别放到新建立的解决方案中。
重新配置App.xaml和App.xaml.cs

<Application x:Class="_077.App"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="clr-namespace:_077"ShutdownMode ="OnExplicitShutdown"><!--不设置StartupUri,通过OnStartup 指定启动 --><!--这里OnExplicitShutdown是手动调用Shutdown, 否则程序不会自动关闭程序。--><Application.Resources></Application.Resources>
</Application>

public partial class App : Application{//重写方法protected override void OnStartup(StartupEventArgs e){base.OnStartup(e);//先弹出登录窗口Login login = new Login();bool? ret = login.ShowDialog();if (ret == true){//成功登录显示主窗口MainWindow mainWindow = new MainWindow();mainWindow.ShowDialog();//关闭程序App.Current.Shutdown();}}}

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using Model;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Input;namespace ViewModel
{//批注了之后，源生成器 会将 ViewModel 自动实现 INotifyPropertyChanged[ObservableObject]internal partial class LoginViewModel{//构造函数public LoginViewModel(){}//源生成器自动将首字母大写生成属性[ObservableProperty]private string name = "admin";//源生成器自动将首字母大写生成属性[ObservableProperty]private string? pwd = null;//属性对应，界面上报错Label控件  [ObservableProperty]private string error = "暂无信息";//命令属性，对应界面上的登录事件//源生成器，自动生成Login + Command的类型[RelayCommand]public void Login (object parameter){//Execute方法中实现命令处理逻辑if (string.IsNullOrEmpty(Name) || string.IsNullOrEmpty(Pwd)){Error = "用户名密码不能为空!";return;}//检查登录信息User u = dal.FindUserByName(Name);if (u != null && u.Pwd == Pwd){Window? w = parameter as Window;w.DialogResult = true;//关闭窗口}elseError = "用户名密码错误!";}//数据访问层public DAL dal = new DAL();}
}

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using Model;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Reflection.Metadata;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;namespace ViewModel
{//批注了之后，源生成器  会将 ViewModel 自动实现 INotifyPropertyChanged[ObservableObject]internal partial class MainWindowViewModel{//数据访问层public DAL dal = new DAL();public MainWindowViewModel(){Books = dal.GetBookList();}//对应界面上的  ListView显示的数据//ObservableCollection 可以通知界面更新的//源生成器自动将首字母大写生成属性[ObservableProperty]private ObservableCollection<Book> books;//删除命令 ，对应界面的删除按钮的点击操作//源生成器，会自动生成   (方法名)Del + Command 的命令类型,实现ICommand[RelayCommand]public void Del(object parameter){Book b = parameter as Book;//删除执行的内容Books.Remove(b);}}
}

三、界面库MaterialDesignThemes

1. 概述

官方链接：https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit

演示app：https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/releases

2. 示例

内容来自链接的演示内容

<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>

演示效果如下：