基于WPF MVVM的甘蔗种植管理系统

蒲 哲，朱名日

(桂林电子科技大学计算机科学与工程学院，广西 桂林 541004)

0 引言

甘蔗作为主要制糖原料，并且能够提炼乙醇作为替代能源，在我国农业经济作物中占有重要地位，其产量和产值仅次于粮食、油料和棉花，居第4位。但是近几年随着甘蔗耕种面积的扩大，栽培技术的落后，使甘蔗亩产量有所降低。在澳大利亚，甘蔗生产已基本实现了种植，以及甘蔗的收割、运输等流程全部由计算机控制达到信息化管理，对甘蔗种植进行科学的管理是十分有价值的。农业物联网将大量传感器节点组建成监控网络，通过采集的信息，帮助蔗农及时发现问题，使整个生产过程以信息和软件为主，从而达到科学管理的目的。

WPF是微软下一代显示系统，用于生成能给用户带来更好的视觉体验的Windows客户端应用程序。WPF的核心是一个与分辨率无关并且基于向量的呈现引擎，旨在利用现代图形硬件的优势。WPF中使用XAML(Extensible Application Markup Language)标记实现程序外观的设计［1］。作为WPF跟MVP(Model-View-Presenter)结合演变过来的新型框架MVVM，能很好地应用WPF的绑定特性，做到界面开发和业务逻辑分离，使系统功能模块化，提高代码重用率［2］。基于以上技术开发了基于农业物联网的甘蔗种植管理系统的后台管理软件，其中WPF技术使软件界面设计更加便捷、美观。

MVVM框架的应用使系统设计更加合理，提高了系统的可测试性，系统也具备良好的可扩展性。

1 系统设计

1.1 系统框架

系统采用C/S结构，为了实现系统功能的模块化，代码的可重用性，采用MVVM框架完成开发。系统框架中视图(View)层是系统页面的显示，在视图模型(ViewModel)层中包含为视图准备的表示模型和控制逻辑，View与ViewModel之间通过绑定(Binding)连接，实现交互;模型(Model)层中包括业务模型和数据访问，在业务模型中定义了数据实体模型和业务逻辑;数据访问层(Data Access Layer)运用NHibernate完成对象关系数据库的映射，把对象持久化到关系数据库中。数据库则提供数据源，管理系统中生成的数据。总体框架如图1所示。

图1 甘蔗种植管理系统总体框架图

1.2 系统功能模块

通过需求分析，本系统主要划分为甘蔗种植地图模块、采集数据查询模块、田地信息管理模块、种植户管理模块、用户管理模块、病虫害防治模块、设备配置模块。系统功能结构如图2所示。

各模块具体功能如下。

(1)甘蔗种植地图模块。

此模块功能是运用Google Map API与WPF结合实现甘蔗种植地理信息查询功能。可通过GPS坐标实时显示种植区域和无线节点位置。该模块还具有天气查询功能，可查看当地天气情况，包括温度、湿度、风速、未来几天天气状况等天气信息。

(2)采集数据查询模块。

此模块可实现按具体时间范围来查询田地里的土壤因子信息，包括有效氮(N)、有效磷(P)、有效钾(K)的含量，土壤湿度，还可查看甘蔗的糖浓度信息，可以查询历史数据，并生成Excel表格。

图2 系统功能结构图

(3)田地信息管理模块。

此模块功能是可查询每块田地的具体信息，如田地编号、土地类型、土壤种类、甘蔗品种、种植时间、生长周期、灌溉方式、施肥状态等。查看每块田地甘蔗总体长势情况，为下一步管理种植甘蔗工作提供依据。

(4)种植户管理模块。

此模块功能可实现对种植户信息的管理，录入新的种植户信息，如姓名、性别、联系电话、联系地址、照片、拥有田地等。当甘蔗出现问题时可快速联系到种植户。对种植户信息进行查询、修改、删除操作。

(5)用户管理模块。

此模块完成对管理员、用户的管理。管理员可新添加用户相关的信息，也可对其修改和删除。

(6)病虫害防治模块。

此模块功能是可查询跟甘蔗病虫害有关信息，并能了解如何防治如黑穗病、凤梨病、甘蔗蚜虫等病虫害，也可通过输入甘蔗病虫害信息，来判断甘蔗到底属于哪种病害，对症下药。

(7)设备配置模块。

此模块功能是配置相关串口信息与下位机相连，也可通过串口发送命令控制下位机无线网络网关上传无线节点数据信息［3］。

2 开发环境

系统采用Windows+Visual Studio 2010+SQL Server 2008的方案，开发语言采用C#语言，前台页面选用 Expression Blend 4 设计 XAML［4］，运用 MVVM Light Toolkit帮助在系统中具体实现MVVM框架［5］，运用NHibernate实现对象与数据库的映射。

3 MVVM设计模式在系统中的应用

3.1 MVVM 介绍

Model-View-ViewModel(MVVM)是一种用于软件工程中的架构模式，可以说是一种量身定制的帮助开发WPF或Silverlight程序的框架［6］。MVVM优化了WPF带来的一些新特性，如绑定、依赖属性(Dependency Property)、路由事件 (Routed Events)、命令(Commands)、模板(Template)等。MVVM能够使程序的业务逻辑与用户界面分离，让开发者与界面设计人员能更加容易地相互协作，也能够使程序更加容易测试、维护与升级［7］。

模型处于框架中的底层部位，它封装了数据模型和业务逻辑，也支持数据的访问和存储。在甘蔗种植管理系统中，模型用来管理系统中需要的数据模型和系统中业务逻辑流程，还可通过NHibernate与数据库进行交互。

视图模型是MVVM框架中的核心部分，主要包含了属性、命令、事件等。其中属性是View中数据的来源，属性可以是一个对象，也可以是一个集合，它可以通过绑定连接到View中的控件，并且绑定还支持传输到视图的数据的输入验证。命令则用于根据View中用户的输入，做出相应的判断，也可以通过绑定连接到View中。在甘蔗种植管理系统中，当用户操作系统发出命令时，首先是通过在View中绑定的命令，把用户需求传送到ViewModel中，然后在View-Model中根据需求内容到相应的数据模型中获取数据。

视图可以说是系统的界面，用户可以通过显示的数据模型进行操作。例如本系统中采集数据查询界面可以查询相关采集的数据信息，该界面就是一个视图，系统中的视图是依靠XAML创建的。

MVVM框架最主要的目的是为了视图与模型的分离，分离后便于后期在原先的功能上进行扩展和维护，当视图发生变化时视图模型与模型并不需要改动，而且可以应用Expression Blend 4软件对视图界面进行设计，缩短系统开发周期［8］。

3.2 MVVM之间的交互

下面详细说明模型、视图模型、视图之间的信息是如何交互的。MVVM框架中模型、视图模型、视图相互关系如图3所示。

为了分公司的生产经营，王经理有一半时间在外面跑，学习经验、访问业主、检查工地、汇报工作……为了赶时间，他经理把飞机和火车定在晚间，有时候连续几天下来，同行的小伙子都有些吃不消，他却依旧精神抖擞，一有空闲，不是组织掼蛋，就是打篮球，很多时候坚持打个全场，仿佛自己还是那个英姿少年，灌篮高手。

图3 模型、视图模型、视图之间交互图

模型、视图模型、视图可以很容易地通过数据绑定、命令、数据验证相互交互［9］:

(1)数据绑定(Data Binding)。

数据绑定是MVVM框架中很重要的一部分，由于WPF提供了数据绑定这个新特性，在设计View-Model和Model时同样支持数据绑定［10］。当生成类时，可以应用INotifyPropertyChanged接口实现数据绑定，假如属性为集合时，也可以应用ObservableCollection＜T＞来声明类。通过数据绑定可以实现View与ViewModel和Model之间属性的交互。

(2)命令(Commands)。

命令可以提供数据在View上的编辑和显示，在ViewModel中可以为用户定义操作或行为动作的命令。命令也可以绑定到View中的控件上，但是在ViewModel中定义命令时需要实现ICommand接口。

(3)数据验证(Data Validation)。

4 关键技术实现

4.1 MVVM Light的运用

MVVM Light Toolkit可以快速地在项目中具体实现MVVM设计模式。MVVM Light Toolkit可以安装到Visual Studio中并提供开发MVVM项目模板和代码段。在MVVM Light库中也包含一些帮助开发程序的类，例如ViewModelBase类用于在ViewModel中实现RaisePropertyChanged(通知属性更改)、IsDesign-Mode(判断是否是 Blend设计模式)等基本功能。RelayCommand类实现MVVM中命令的生成，并通过Execute执行委托生成的方法对事件进行处理。Messenger类通过Send＜T＞泛型方法和Register＜T＞泛型方法实现不同页面和窗体间的参数传递问题。

在甘蔗种植管理系统中，当把用户信息属性绑定到View页面中，并发生更改通知Model时，运用MVVM Light Toolkit中ViewModelBase类可实现其过程，相关代码如下:

用户执行查询数据命令时，通过绑定到View页面中的SearchCommand命令来进行事件的处理。命令的实现可通过RelayCommand类实现，相关代码如下:

在用户登录系统时，需要判断用户是否登录成功以便是否要弹出主窗体时，运用Messenger类可以实现从登录页面往主页面传输是否登录成功的参数，相关代码如下:

4.2 NHibernate数据持久化

NHibernate是面向.NET环境的对象/关系数据库的映射工具［12］。对象/关系数据库映射(Object/Relational Mapping，ORM)用来把对象模型表示的对象映射到基于SQL的关系模型数据结构中去。NHibernate从数据库底层把.NET对象持久化到关系数据库中，还能自动生成SQL语句，减少程序开发时人工处理ADO.NET和SQL语句的时间。

在甘蔗种植管理系统中，以实现通过NHibernate把田地信息对象持久化到数据库中为例，实现过程如图4所示。

图4 NHibernate设置步骤图

(1)在项目App.config中配置 NHibernate连接节点信息，例如数据库连接字符，生成IDbCommands对象的超时时间等信息。主要代码如下:

(2)在数据库中构建田地信息(Area)表，包括田地编号、田地名称、田地类型、种植时间等信息。

(3)在项目中声明需要被持久化的Area类。代码如下:

(4)配置持久化Area对象属性的映射文件Area.hbm.xml。其中class属性中 lazy赋值为true可使用延迟加载，主键id设为AreaID，其余属性按照数据库中声明依次设定。主要代码如下:

(5)在数据访问层中调用NHibernate API实现调用数据库基本功能。相关代码如下:

4.3 Google Map与WPF结合

Google Map是Google公司提供的电子地图服务，可以通过提供的Google Map API二次开发，实现甘蔗种植地图管理模块。运用Google Map JavaScript API v3［13］创建甘蔗种植地理位置地图，通过坐标在地图上Marker标记出无线节点位置和运用Polygon多边形标识出甘蔗种植区域面积。运用其他API实现地图放大、缩小，选择种植点功能。

WPF中WebBrowser可以把Google Map的HTML文件加载到程序中。当要实现Google Map与WPF交互时，WPF需要调用HTML文件中JavaScript。以往需要运用COM组件MSHTML时，并不是每台计算机都安装MSHTML。这时可以应用WebBrowser中InvokeScirpt方法调用HTML中JavaScript方法，例如:

if(webBrowser1.Document!=null){

webBrowser1.InvokeScript(“togglePlant”);}//显示种植区域

5 系统界面实例

采用MVVM框架帮助解决了系统设计中耦合度的问题，实现页面与业务逻辑分离，使在设计页面时可同时编写后台代码，更改页面时也无需变动后台代码［14］。采用WPF中的控件模板(Template)和样式(Style)对原有的控件进行设计，以便清晰直观地显示数据，方便用户操作。部分运行页面如甘蔗种植地图管理页面、田地管理页面、病虫害管理页面分别如图5、图6、图7所示。

6 结束语

经过单元测试，系统能够正常稳定地运行，实现了对采集的信息和种植甘蔗相关信息管理的设计目的。用户可以方便地查询信息，对甘蔗的生长状态有全面的了解。MVVM框架的应用也使得系统设计流程更加规范，通过 Model、View、View Model之间的交互实现了界面设计与后台逻辑代码的分离，NHibernate封装了对象与数据库之间的交互，建立了一个易于维护，便于测试，有良好的扩展性的应用系统。

图5 甘蔗种植地图页面图

图6 田地管理页面图

图7 病虫害管理页面图

［1］刘铁锰.深入浅出WPF［M］.北京:中国水利水电出版社，2010.

［2］程国雄，胡世清.基于Silverlight的RIA系统架构与设计模式研究［J］.计算机工程与设计，2010，31(8):1706-1709，1713.

［3］陈荔，张菁.基于串口自定义协议传输文件的设计［J］.计算机技术与发展，2012，22(2):45-48.

［4］Dino Esposito，Andrea Saltarello.Microsoft.NET:Architecting Applications for the Enterprise［M］.Microsoft Press，2010.

［5］Laurent Bugnion.MVVM Light Toolkit［EB/OL］.http://www.galasoft.ch/mvvm，2012-12-10.

［6］Jarnjak F.Flexible GUI in robotics applications using Windows presentation foundation framework and model view viewmodel pattern［C］//Proceedings of the 4th International Conference on New Trends in Information Science and Service Science.2010:176-179.

［7］Gao Beibei，Zhang Shudong，Yao Naiming.A multidimensional pivot table model based on MVVM pattern for rich Internet application［C］//Proceedings of the 2012 International Symposium on Computer，Consumer and Control.2012:24-27.

［8］程国雄，胡世清.数字化图书及英语交互学习RIA平台的研究［J］.计算机工程与设计，2010，31(13):3103-3107.

［9］Josh Smith.WPF Apps with the Model-View-ViewModel Design Pattern［EB/OL］.http://msdn.microsoft.com/enus/magazine/dd419663.aspx，2009-02-28.

［10］John Papa.Data Binding in WPF［EB/OL］.http://msdn.microsoft.com/en-us/magazine/cc163299.aspx，2007-12-05.

［11］［美］Matthew MacDonald.WPF编程宝典:C#2010版［M］.王德才译.北京:清华大学出版社，2011.

［12］傅棋灿，史浩山.基于Linq to NHibernate数据库应用系统的设计与实现［J］.微型电脑应用，2010，26(12):44-46.

［13］Google.Google Maps JavaScript API V3 Reference［EB/OL］.https://developers.google.com/maps/documentation/javascript/reference?hl=zh-CN，2013-05-30.

［14］Dino Esposito，Andrea Saltarello.Microsoft.NET 企业级应用架构设计［M］.北京:人民邮电出版社，2010.