ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

WINFROM MVVM

2022-03-02 09:32:01  阅读:252  来源: 互联网

标签:绑定 MVVM WINFROM ViewModel vm ReactiveUI WinForm


网上看到WINFROM 也能MVVM,没做研究,摘抄一下,备用

1、引言

  谈到MVVM设计模式,首先让人想到的是WPF。没错,MVVM的概念是微软在2005年提出的,并首次将其应用到WPF中。最近很是火的Vue.js也是使用了MVVM的设计模式。MVVM设计模式的核心部分是DataBinding机制。顾名思义,其功能就是将Model的数据绑定到View层,而且将View层控件的变换绑定到Model的双向绑定。MVVM的优势是业务逻辑层不用关注View,只专一对Model的处理,开发效率提高很大。 react

2、背景

  最近公司在开发一套管理系统的桌面客户端程序,因为各类缘由,最终选型使用WinForm进行开发。因为好几年没有再接触过WinForm了,起初一段时间很是的不适应,开发效率极低,不只要考虑不一样分辨率的适应状况(这里稍微吐槽一下:WinForm自己就难以处理不一样分辨率的自适应),同时还要处理数据的显示及提交。
  既然要提高开发效率,咱们先从设计模式下手。今天要为你们带来的是ReactiveUI。
  ReactiveUI是实现了MVVM模式的框架,它的核心目标是能够在ViewModel中相关属性发生变化时能够可执行相应的命令。ReactiveUI支持Xamarin、WPF、WinForm、Windows Phone、UWP。这里咱们选择WinForm对应的版本ReactiveUI.WinForms。web

3、示例

  下面为你们带来ReactiveUI.WinForms的一个简单的示例,来一块儿认识ReactiveUI.WinForms。设计模式

一、建立WinForm项目

打开vs,咱们建立一个WinForm的项目:
建立项目框架

二、安装ReactiveUI.WinForms

项目建立完成后,鼠标右键单击当前项目,选择“管理NuGet程序包”,在打开的窗口中选择“浏览”,并搜索ReactiveUI.WinForms进行安装
NuGetsvg

三、建立ViewModel

在项目目录下新建文件夹ViewModel,并在文件夹下新建一个PersonViewModel类,写入以下代码:函数

using ReactiveUI;

namespace WinformMvvm.ViewModel
{
    //ViewModel须要继承自ReactiveObject
    public class PersonViewModel : ReactiveObject
    {
        private int _id;
        private string _name;
        private int _age;

        public PersonViewModel()
        {
            Id = 1;
            Name = "张三";
            Age = 18;
        }

        public int Id
        {
            get => _id;
            set => this.RaiseAndSetIfChanged(ref _id, value);
        }

        public string Name
        {
            get => _name;
            set => this.RaiseAndSetIfChanged(ref _name, value);
        }

        public int Age
        {
            get => _age;
            set => this.RaiseAndSetIfChanged(ref _age, value);
        }
    }
}
  • 注意:ViewModel类须要继承自ReactiveObject

四、给窗体拖入相应的控件并修改相关代码

在项目默认的Form1窗体上拖入3个textbox和3个label控件
右键单击Form1窗体,选择“查看代码”,进入代码窗口,写入以下代码:ui

using ReactiveUI;
using System.Windows.Forms;
using WinformMvvm.ViewModel;

namespace WinformMvvm
{
    //视图窗体须要实现IViewFor接口,并以须要绑定的ViewModel类(本例中的ViewModel是PersonViewModel)做为泛型传入接口
    public partial class Form1 : Form, IViewFor<PersonViewModel>
    {
        public Form1()
        {
            InitializeComponent();
            this.WhenActivated(a =>
            {
                a(this.Bind(ViewModel, vm => vm.Id, v => v.textBox1.Text));
                a(this.Bind(ViewModel, vm => vm.Name, v => v.textBox2.Text));
                a(this.Bind(ViewModel, vm => vm.Age, v => v.textBox3.Text));
                a(this.OneWayBind(ViewModel, vm => vm.Id, v => v.label1.Text));
                a(this.OneWayBind(ViewModel, vm => vm.Name, v => v.label2.Text));
                a(this.OneWayBind(ViewModel, vm => vm.Age, v => v.label3.Text));
            });
            ViewModel = new PersonViewModel();
        }

        object IViewFor.ViewModel
        {
            get => ViewModel;
            set => ViewModel = (PersonViewModel)value;
        }

        public PersonViewModel ViewModel { get; set; }
    }
}
  • 注意:视图窗体须要实现IViewFor接口,并以须要绑定的ViewModel类(本例中的ViewModel是PersonViewModel)做为泛型传入接口
  • Form1构造函数中WhenActivated里的代码即为绑定相关。this.Bind表示双向绑定,this.OneWayBind表示单向绑定。3个textBox分别双向绑定ViewModel对应的属性字段用做显示及输入更新,3个label分别单向绑定ViewModel对应的属性字段用作显示。this

    下图即为整个示例项目的结构:
    项目结构编码

五、运行项目

至此,项目的编码已经完成,咱们来运行当前项目,查看效果。
运行
能够看到,因为ReactiveUI中MVVM的实现,咱们在修改textBox中的内容时,ViewModel中相应的属性也会跟着改变,并将改变反应在textBox和label中。spa

4、总结

以上即是运用ReactiveUI框架使用MVVM模式开发WinForm的一个简单示例。但愿本文能为想要在WinForm下使用MVVM模式进行开发的童鞋们提供帮助。

标签:绑定,MVVM,WINFROM,ViewModel,vm,ReactiveUI,WinForm
来源: https://www.cnblogs.com/lzjsky/p/15953569.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有