【MVVM】目的是为了分离视图(View)和模型(Model)的耦合——解耦

1、View负责前端展示,与ViewModel进行数据和命令的交互。(双向的数据属性传递,单向的命令属性传递View→ViewModel
2、ViewModel,负责前端视图业务级别的逻辑结构组织,并将其反馈给前端。
3、Model,主要负责数据实体的结构处理,与ViewModel进行交互。
其实我个人认为,数据和业务交互这一层还是应该另外独立,Model中完全就是实体模型,这样更清晰。

【安装Prism模板框架】建议用手机热点下载。也可以在VS的NuGet中搜索,但是每建一个项目就需要搜索引用一次,麻烦。

VS2017及以上版本中,拓展—管理拓展(或工具—拓展和更新),联机,搜索Prism Template Pack,安装即可。(推荐此安装方式)

也可以网上下载https://marketplace.visualstudio.com/items?itemName=BrianLagunas.PrismTemplatePack

新建项目界面出现下图,安装成功。

【实战】像学高中物理受力分析一样,先分析界面有多少数据属性、命令属性

 

新建Prsm Blank App(WPF) 项目:Demo MVVM

Views中MainWindow.xaml代码:

<Window x:Class="DemoMVVM.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"
Title="{Binding Title}" Height="200" Width="300">
<StackPanel>
<TextBox Text="{Binding Input1}" Margin="5,20,5,5" Width="100"/>
<TextBox Text="{Binding Input2}" Margin="5" Width="100"/>
<Button Command="{Binding AddCommand}" Content="求和" Width="75" Margin="5"/>
<TextBox Text="{Binding Result}" Margin="5" Width="100"/>
</StackPanel>
</Window>

ViewModels中MainWindowViewModel.cs代码:其他文件代码不动

using Prism.Mvvm;
using Prism.Commands; //引入命令
using System; //ViewModel为View提供数据属性、命令属性
namespace DemoMVVM.ViewModels
{
public class MainWindowViewModel : BindableBase
{
#region 私有变量,以及对应的属性(习惯大写)
private string _title = "Prism Application";
private double _input1; //默认0
private double _input2;
private double _result;
public double Result //数据属性
{
get { return _result; }
set { _result = value; RaisePropertyChanged("Result"); } //变化结果展示在View界面上
}
public double Input2 //数据属性
{
get { return _input2; }
set { _input2 = value; }
}
public double Input1 //数据属性
{
get { return _input1; }
set { _input1 = value; }
}
public string Title //数据属性
{
get { return _title; }
set { _title = value; }
}
#endregion
#region 命令属性
public DelegateCommand AddCommand { get; set; }
#endregion
public void Add() //方法
{
this.Result = this.Input1 + this.Input2;
} public MainWindowViewModel() //将方法Add与命令属性AddCommand联系起来
{
this.AddCommand = new DelegateCommand(new Action(Add));
}
}
}

注意:View与ModelView传递的是属性、属性、属性(习惯大写)

【实战2】

 

新建Prsm Blank App(WPF) 项目:BlankApp5

Views中MainWindow.xaml代码:

<Window x:Class="BlankApp5.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:prism="http://prismlibrary.com/"
prism:ViewModelLocator.AutoWireViewModel="True"
Title="{Binding Title}" Height="200" Width="300"> <Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="学号" Margin="20,0" VerticalAlignment="Center"/>
<TextBox Text="{Binding Id}" IsReadOnly="True" Width="200" Padding="2" />
</StackPanel>
<StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center">
<TextBlock Text="姓名" Margin="20,0" VerticalAlignment="Center"/>
<TextBox Text="{Binding Name}" IsReadOnly="True" Width="200" Padding="2"/>
</StackPanel>
<Button Command="{Binding ShowCommand}" Content="显示" Grid.Row="2" VerticalAlignment="Center" Width="50"/>
</Grid>
</Window>

ViewModels中MainWindowViewModel.cs代码:其他文件代码不动

using Prism.Mvvm;
using Prism.Commands;
using System; namespace BlankApp5.ViewModels
{
public class MainWindowViewModel : BindableBase
{
#region 私有变量,以及对应的属性(习惯大写)
private string _title = "Prism Application";
private string _name;
private string _id;
public string Id
{
get { return _id; }
set { _id = value; RaisePropertyChanged("Id"); }
}
public string Name
{
get { return _name; }
set { _name = value; RaisePropertyChanged("Name"); }
}
public string Title
{
get { return _title; }
set { _title=value; }
}
#endregion
#region 命令属性
public DelegateCommand ShowCommand { get; set; }
#endregion
public void Show() //方法
{
this.Name = "夕西行";
this.Id = "";
}
public MainWindowViewModel() //命令属性与方法联系起来
{
this.ShowCommand = new DelegateCommand(new Action(Show));
}
}
}

MainWindow.xaml.cs代码:贴出来只是有疑问,大神可解答下

using System.Windows;
using BlankApp5.ViewModels; namespace BlankApp5.Views
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
//this.DataContext = new MainWindowViewModel(); //这句有无貌似没什么影响,懂得大神可以留言讲下
}
}
}

MVVM(使用Prism框架)开发WPF的更多相关文章

  1. 【.NET6+WPF】WPF使用prism框架+Unity IOC容器实现MVVM双向绑定和依赖注入

    前言:在C/S架构上,WPF无疑已经是"桌面一霸"了.在.NET生态环境中,很多小伙伴还在使用Winform开发C/S架构的桌面应用.但是WPF也有很多年的历史了,并且基于MVVM ...

  2. WPF Prism框架下基于MVVM模式的命令、绑定、事件

    Prism框架下的自定义路由事件和命令绑定 BaseCode XAML代码: <Button x:Class="IM.UI.CommandEx.PrismCommandEx" ...

  3. WPF Step By Step 系列-Prism框架在项目中使用

    WPF Step By Step 系列-Prism框架在项目中使用 回顾 上一篇,我们介绍了关于控件模板的用法,本节我们将继续说明WPF更加实用的内容,在大型的项目中如何使用Prism框架,并给予Pr ...

  4. MVVM框架从WPF移植到UWP遇到的问题和解决方法

    MVVM框架从WPF移植到UWP遇到的问题和解决方法 0x00 起因 这几天开始学习UWP了,之前有WPF经验,所以总体感觉还可以,看了一些基础概念和主题,写了几个测试程序,突然想起来了前一段时间在W ...

  5. 准备.Net转前端开发-WPF界面框架那些事,值得珍藏的8个问题

    题外话 不出意外,本片内容应该是最后一篇关于.Net技术的博客,做.Net的伙伴们忽喷忽喷..Net挺好的,微软最近在跨平台方面搞的水深火热,更新也比较频繁,而且博客园的很多大牛也写的有跨平台相关技术 ...

  6. 从PRISM开始学WPF(七)MVVM(三)事件聚合器EventAggregator-更新至Prism7.1

    原文:从PRISM开始学WPF(七)MVVM(三)事件聚合器EventAggregator-更新至Prism7.1 事件聚合器EventAggregator [7.1updated]除了app部分,没 ...

  7. 从PRISM开始学WPF(七)MVVM(三)事件聚合器EventAggregator?

    原文:从PRISM开始学WPF(七)MVVM(三)事件聚合器EventAggregator? 从PRISM开始学WPF(一)WPF? 从PRISM开始学WPF(二)Prism? 从PRISM开始学WP ...

  8. MVVM开源框架Knot.js 教程2 - 大幅改变前端框架开发体验的Debugger

    Knotjs教程系列 1.CBS初步 2.Knot.js Debugger(本文) ....持续增加中 Knot.js 教程2 - 改变前端框架开发体验的Debugger Debugger只是一个方便 ...

  9. 开发模式 MVC、MVP、MVVM和MVX框架模式

    MVX框架模式的了解 MVX框架模式:MVC+MVP+MVVM 1.MVC: Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分开.View通过 ...

随机推荐

  1. STL priority_queue 常见用法详解

    <算法笔记>学习笔记 priority_queue 常见用法详解 //priority_queue又称优先队列,其底层时用堆来实现的. //在优先队列中,队首元素一定是当前队列中优先级最高 ...

  2. linux常用终端命令(三)远程管理命令

    三.远程管理常用命令 关机/重启 shutdown 查看或配置网卡信息 ifconfig ping 远程登录和复制文件 ssh scp 1.关机/重启 序号 命令 对应英文 作用 01 shutdow ...

  3. jQuery+php+ajax实现无刷新上传文件功能

    jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...

  4. winform中如何使用确认对话框

    在系统中,常需要这样的功能,让用户确认一些信息:如下图: [退出系统]按钮关键代码如下: private void btnExit_Click(object sender, EventArgs e) ...

  5. flask项目配置

    config.py: class Config(object): """项目的配置""" DEBUG = True SECRET_KEY = ...

  6. mpstat

    mpstat--multiprocessor statistics,统计多处理器的信息 1.安装mpstat工具 [root@localhost ~]# yum install sysstat 2:展 ...

  7. c# 后台隐式使用webBrowser

    c#不使用 webBrowser 控件, 在后台加载html流 private void button1_Click(object sender, EventArgs e) { string urlP ...

  8. Java ArrayList常用接口介绍及示例

    Java List 常用类型 类型 特征 ArrayList 随机访问元素快:中间插入与删除元素较慢:操作不是线程安全的 LinkedList 中间插入与删除操作代价较低,提供优化的顺序访问:随机访问 ...

  9. git统计某个时间段写的代码行数

    1. 任务需要 领导想每个迭代统计一下,当前迭代开发的代码数量是多少 2. 解决方法 git log --stat --since=2019-09-12 --until=2019-09-27 | pe ...

  10. 一步步创建第一个Vue项目

    写在了GitHub https://github.com/TaoPanfeng/vue-cms 1 初始化 创建一个文件夹 vue-cms 在vue-cms目录下创建文件 package.json 在 ...