WPF MVVM模式构建项目

什么是MVVM模式?

        MVVM是Model-View-ViewModel的简写,Model就是模型,View就是视图,ViewModel就是View和Model之间解耦和传递消息的中间层。MVVM采用双向数据绑定,View中数据变化将自动反映到ViewModel上,反之,Model中数据变化也将会自动展示在View上。通过MVVM模式使得View和Model上的修改相互不影响,方便程序分工,测试和维护。

        基于WPF的MVVM模式的框架有很多种,流行的是MvvmLight(轻量级Mvvm框架,现已不更新)和Prism(大型Mvvm框架),本篇不使用框架来实现MVVM模式构建项目,了解WPF内部实现机理。使用MVVM框架请参考:

MvvmLight:WPF MVVMLight介绍和使用(1)_无熵~的博客-CSDN博客

Prism:WPF Prism介绍和简单实例_prism.wpf_无熵~的博客-CSDN博客

创建一个基于MVVM模式的登录项目,实现方式:
        首先建立相应的文件夹:一个ViewModel,一个View,一个Model。在ViewModel里面有一个基础的通知类:NotifyPropertyChanged,这个类继承自INotifyPropertyChanged(这个类是通知的基础类,当事件执行时,会将相应的值显示在绑定的控件上);一个命令通知类:DelegateCommand,实现ICommand接口,用于消息传递。

 Model类:如果想让属性绑定到其他数据,可以将属性定义成依赖属性并让类继承DependencyObject类。

    public class User:DependencyObject
    {
        public string Name
        {
            get { return (string)GetValue(NameProperty); }
            set { SetValue(NameProperty, value); }
        }
        // Using a DependencyProperty as the backing store for Name.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty NameProperty =
            DependencyProperty.Register("Name", typeof(string), typeof(User), new PropertyMetadata(null));

        public string Password
        {
            get { return (string)GetValue(PasswordProperty); }
            set { SetValue(PasswordProperty, value); }
        }
        public static readonly DependencyProperty PasswordProperty =
            DependencyProperty.Register("Password", typeof(string), typeof(User), new PropertyMetadata(null));
    }

View页面实现:

<Window x:Class="WpfMvvmDemo.View.LoginWindow"
        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:WpfMvvmDemo.View"
        mc:Ignorable="d"
        Title="{Binding Info}" Height="450" Width="800" WindowStartupLocation="CenterScreen">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <TextBox x:Name="txtUser" Text="{Binding User.Name,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"
                  Width="300" Height="40"/>
        <TextBox x:Name="txtPassword" Text="{Binding User.Password,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"
                 Grid.Row="1" Width="300" Height="40" />
        <Button  Content="Query" Command="{Binding LoginCommand}" CommandParameter="login"
                 Grid.Row="2"  Width="200" Height="30"  />
    </Grid>
</Window>

View页面指定数据源:

    /// <summary>
    /// LoginWindow.xaml 的交互逻辑
    /// </summary>
    public partial class LoginWindow : Window
    {
        public LoginWindow()
        {
            InitializeComponent();
            this.DataContext = new UserVM();
        }
    }

ViewModel类:

    public class UserVM: NotifyPropertyChanged
    {

        private string info;

        public string Info
        {
            get { return info; }
            set
            {
                info = value;
                OnPropertyChanged();
            }
        }

        public UserVM()
        {
            User = new User()
            {
                Name = "admin",
                Password = "123456"
            };
            Info = "用户登录";
        }

        private User user;

        public User User
        {
            get { return user; }
            set
            {
                user = value;
                OnPropertyChanged();
                //NotifyPropertyChanged("User");
            }
        }
        public ICommand LoginCommand
        {
            get { return new DelegateCommand(LoginCommandEvent, CanLogin); }
        }

        private void LoginCommandEvent(Object o)
        {
            MessageBox.Show(string.Format($"用户:{User.Name},参数:{o.ToString()}"));
        }

        private bool CanLogin(Object o)
        {
            if(o!=null)
            {
                return true;
            }
            return false;
        }
    }

ViewModel中NotifyPropertyChanged类定义,继承自INotifyPropertyChanged。

    public class NotifyPropertyChanged : INotifyPropertyChanged
    {
        /// <summary>
        /// 实现接口
        /// </summary>
        public event PropertyChangedEventHandler PropertyChanged;

        /// <summary>
        /// 属性变更事件
        /// </summary>
        /// <param name="Path">事件源</param>
        public void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }

ViewModel中DelegateCommand类定义,实现ICommand接口。

    public class DelegateCommand : ICommand
    {
        public event EventHandler CanExecuteChanged
        {
            add
            {
                if (_canExecute != null)
                {
                    CommandManager.RequerySuggested += value;
                }
            }
            remove
            {
                if (_canExecute != null)
                {
                    CommandManager.RequerySuggested -= value;
                }
            }
        }

        public bool CanExecute(object parameter)
        {
            if (_canExecute == null)
            {
                return true;
            }
            return _canExecute(parameter);
        }

        public void Execute(object parameter)
        {
            if (_execute != null && CanExecute(parameter))
            {
                _execute(parameter);
            }
        }

        private Func<object, bool> _canExecute;
        private Action<object> _execute;

        public DelegateCommand(Action<object> execute, Func<object, bool> canExecute)
        {
            _execute = execute;
            _canExecute = canExecute;
        }
 
        public DelegateCommand(Action<object> execute) :
            this(execute, null)
        {
        }

    }

实例链接:https://download.csdn.net/download/lvxingzhe3/87669239

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
### 回答1: WPF(Windows Presentation Foundation)是一个基于XAML的应用程序框架,主要面向Windows桌面应用程序的开发。MVVM(Model-View-ViewModel)是一种设计模式,它将应用程序分为三个主要的部分:模型,视图和视图模型。在MVVM中,视图和视图模型是分离的,视图模型呈现数据,并且视图与模型直接通信。 在WPF中,MVVM是一个广泛使用的模式,并且在实际应用程序中实现起来非常简单。以下是一个MVVM模式实例: 我们建立一个学生管理系统,包括添加学生,编辑学生和显示学生。 首先是数据模型(Model),在这个例子中,我们需要一个Student类,包括姓名,年龄和成绩。 ``` public class Student { public string Name { get; set; } public int Age { get; set; } public float Score { get; set; } } ``` 然后是视图模型(ViewModel),在这里我们需要三个属性:Students(学生列表),SelectedStudent(所选学生),和AddCommand(添加学生命令)。 ``` public class StudentViewModel : INotifyPropertyChanged { private ObservableCollection<Student> _students; private Student _selectedStudent; public ICommand AddCommand { get; private set; } public event PropertyChangedEventHandler PropertyChanged; public ObservableCollection<Student> Students { get { return _students; } set { if (_students != value) { _students = value; OnPropertyChanged("Students"); } } } public Student SelectedStudent { get { return _selectedStudent; } set { if (_selectedStudent != value) { _selectedStudent = value; OnPropertyChanged("SelectedStudent"); } } } public StudentViewModel() { Students = new ObservableCollection<Student>(); AddCommand = new RelayCommand(AddStudent); } private void AddStudent() { Students.Add(new Student() { Name = "New Student" }); } private void OnPropertyChanged(string propertyName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); } } } ``` 最后是视图(View),在这个例子中,我们需要一个包含学生列表和Add按钮的窗口。 ``` <Window x:Class="StudentManager.View.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Student Manager" Height="350" Width="525" DataContext="{StaticResource StudentViewModel}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <ListView ItemsSource="{Binding Students}" SelectedItem="{Binding SelectedStudent}"> <ListView.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding Name}" Margin="5" /> <TextBlock Text="{Binding Age}" Margin="5" /> <TextBlock Text="{Binding Score}" Margin="5" /> </StackPanel> </DataTemplate> </ListView.ItemTemplate> </ListView> <Button Content="Add" Command="{Binding AddCommand}" Grid.Row="1" HorizontalAlignment="Right" Margin="5" Padding="5" /> </Grid> </Window> ``` 在这个例子中,我们使用Data Binding(数据绑定)将视图与视图模型联系起来。数据绑定是指在WPF应用中,允许将数据源与某个控件的属性绑定,当数据源更新时,UI自动更新。为了实现Data Binding,我们使用了INotifyPropertyChanged和RelayCommand。 INotifyPropertyChanged是一个接口,它使ViewModel可以通知视图它的属性已经更新。 RelayCommand是一个实现了ICommand接口的类,它将一些指定的命令关联到一个按钮,当条件满足时该按钮可以被按下。 在这个例子中,我们建立了一个具有添加,编辑和显示学生信息的学生管理器。这个例子演示了MVVM模式如何在WPF实现,希望能帮助你更好的理解如何使用MVVM模式构建应用程序。 ### 回答2: MVVM(Model-View-ViewModel)是一种软件设计模式,用于将GUI应用程序的UI与其后端逻辑分开。WPF(Windows Presentation Foundation)是一个微软框架,用于创建Windows桌面应用程序。 在WPF中使用MVVM模式需要创建三种对象:模型(Model)、视图(View)和视图模型(ViewModel)。模型代表业务逻辑和数据,视图是用户界面,而视图模型则是连接两者的桥梁。 模型中存储着应用程序的数据,我们需要编写类来表示数据结构。视图是XAML文件,包含了UI设计。视图模型是一个C#类,作为一种观察者模式,观察模型的变化并通知视图来更新。 在视图模型中,需要维护着与视图交互的所有数据和命令。我们使用绑定(Binding)来处理两种对象之间的数据交互,从而实现视图和视图模型的解耦。 所以,实现WPF中的MVVM模式需要我们设计好模型、视图和视图模型之间的交互方式,很好的分离了应用程序的UI逻辑和后端业务逻辑,提高了应用程序的可维护性、可扩展性和可重用性。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

无熵~

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值