《深入浅出WPF》学习笔记六.手动实现Mvvm

《深入浅出WPF》学习笔记六.手动实现Mvvm

demo的层级结构,Mvvm常用项目结构

依赖属性基类实现

具体底层原理后续学习中再探讨,可以粗浅理解为,有一个全局对象使用list或者dic监听所有依赖属性,当一个依赖属性变化引发通知时,就会遍历查询对应的字典，通知View层进行处理。

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;

namespace WpfApp11.ViewModels
{
    /// <summary>
    /// viewmodel的基类
    /// </summary>
    public class NotificationObject : INotifyPropertyChanged
    {
        /// <summary>
        /// 通知属性变化
        /// </summary>
        public event PropertyChangedEventHandler? PropertyChanged;

        public void RaisePropertyChanged(string propertyName)
        {
            if (this.PropertyChanged != null)
            {
                //实际方法,内部可以理解为一个字典对象
                this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }

    }
}

命令属性基类实现

这个底层原理没了解过，后续学到了再说。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;

namespace WpfApp11.Commands
{
    public class DelegateCommand : ICommand
    {
        public event EventHandler? CanExecuteChanged;

        //是否可以执行
        public bool CanExecute(object? parameter)
        {
            if (this.CanExecuteFunc == null)
            {
                return true;
            }
            else
            {
                this.CanExecuteFunc(parameter);
                return true;
            }
        }

        //具体执行
        public void Execute(object? parameter)
        {
            if (this.ExecuteAction == null)
            {
                return;
            }
            this.ExecuteAction(parameter);
        }

        public Action<object> ExecuteAction { get; set; }

        public Func<object, bool> CanExecuteFunc { get; set; }
    }
}

View

<Window x:Class="WpfApp11.Views.CalculateView"
        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:WpfApp11.Views"
        mc:Ignorable="d"
        Title="CalculateView" Height="300" Width="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition Height="auto"></RowDefinition>
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="10">
            <Label>参数1:</Label>
            <TextBox Height="30" Width="100"  x:Name="tb1"  Text="{Binding Param1}"></TextBox>
        </StackPanel>
        <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="10">
            <Label>参数2:</Label>
            <TextBox Height="30" Width="100"  x:Name="tb2" Text="{Binding Param2}"></TextBox>
        </StackPanel>
        <StackPanel Grid.Row="2" Orientation="Horizontal" Margin="10">
            <Label>结果：</Label>
            <TextBox Height="30" Width="100"  x:Name="tb3" Text="{Binding Result}"></TextBox>
        </StackPanel>
        <StackPanel Grid.Row="3" Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="10">
            <Button x:Name="btn1" Content="Calculate" Height="30" Width="100" Command="{Binding AddCommand}"></Button>
        </StackPanel>
    </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using WpfApp11.ViewModels;

namespace WpfApp11.Views
{
    /// <summary>
    /// CalculateView.xaml 的交互逻辑
    /// </summary>
    public partial class CalculateView : Window
    {
        public CalculateView()
        {
            InitializeComponent();
            this.DataContext = new CalculateViewModel();
        }
    }
}

ViewModel

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using WpfApp11.Commands;

namespace WpfApp11.ViewModels
{
    public class CalculateViewModel : NotificationObject
    {
        #region 依赖属性
        private string param1;

        public string Param1
        {
            get { return param1; }
            set
            {
                param1 = value;
                this.RaisePropertyChanged("Param1");
            }
        }

        private string param2;

        public string Param2
        {
            get { return param2; }
            set
            {
                param2 = value;
                this.RaisePropertyChanged("Param2");
            }
        }

        private string result;

        public string Result
        {
            get { return result; }
            set
            {
                result = value;
                this.RaisePropertyChanged("Result");
            }
        }
        #endregion

        /// <summary>
        /// 命令属性
        /// </summary>
        public DelegateCommand AddCommand {  get; set; }

        public void Add(object param)
        {
            this.Result = (Convert.ToInt32(this.Param1) + Convert.ToInt32(this.Param2)).ToString();
        }

        public CalculateViewModel()
        {
            Param1 = "0";
            Param2 = "0";
            Result = "0";
            this.AddCommand = new DelegateCommand();
            this.AddCommand.ExecuteAction = new Action<object>(this.Add);
        }


    }
}

App

<Application x:Class="WpfApp11.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:WpfApp11"
             StartupUri="Views/CalculateView.xaml">
    <Application.Resources>
         
    </Application.Resources>
</Application>

结语

实际项目中基本都是使用成熟框架Prism或者MvvmLight，不需要手动造轮子，但学习要知所以然。