Swift教程17-淡化MVC,使用MVVM框架开发轻巧便于维护的iOS app

MVVM是微软提出一种移动开发框架,旨在针对传统的MVC框架,解决传统的MVC框架的控制器的臃肿问题.

Model模型,也就是数据模型;比如一条微博,对应的所有字段合成一条微博整体,这个整体就是Model

View视图,只用来显示的视图,如 iOS的UIView,Cell;当然在 iOS中 Storyboard中,view总是和控制器关联,这并不是严格的view

如果我们纯手写代码定义一个view那么就是一个比较严格的view了

VM:

ViewModel视图模型,是将一个 View 和 Model进行绑定;起着桥梁的作用

例如一个微博 cell,对应的数据绑定到一个 Model,将获得的数据绑定到Model个各个属性上.

传统的MVC中的 C代表控制器,负责逻辑处理和数据绑定,更新视图;代码过于复杂,维护会比较困难;

而MVVM框架则是,给 Controller控制器减负;

把网络请求,数据绑定,更新视图,都剥离出去;

是在 Controller中做的仅仅是简单的跳转和部分代理

比较符合MVVM开发框架的是使用TableView的控制器;Cell自定义;定义所需的Model;定义ViewModel调用对应的接口

下面来示范一个MVVM框架开发,带有网络请求的Demo

目录说明:

Resourse:存放图片,音频视频文件,IB文件

Controllers:存放视图控制器

Vender:开源框架,或者自己封装的组件

UtilTools:封装的常用代码,常量定义,配置文件等

ViewModel:根据不同的View获取不同的数据并且绑定到Model中

View:自定义个视图如 cell或者纯手写的view

Model:数据模型,就是View所需的所有字段的整体

实现效果:

一个tableView上显示多条动态包括,图片,文字;

技术要点:

MVVM框架

AFNetworking网络请求

MBProgressHUD等待提示

自定义cell

Block闭包传值,封装代码

实现过程:

1.导入Oc的相关框架

在Swift项目中新建一个Oc文件,系统询问你是否新建一个桥接Oc的文件,选择是,生成一个 Header.h文件;在其中导入对应的Oc的头文件即可使用

如图,工程中有一个 SwiftDemo-Bridging-Header.h文件

导入AF等框架

SwiftDemo-Bridging-Header.h

//
//Usethisfiletoimportyourtarget'spublicheadersthatyouwouldliketoexposetoSwift.
//
#import"AFNetworking.h"
#import"MBProgressHUD.h"
#import"UIImageView+AFNetworking.h"

2.使用Storyboard创建一个自定义的cell绑定到cell类,标识符是 TestCell

绑定的TestCell.swift类

//SwiftDemoUsingAF
//CreatedbyMBinYangon15/4/8.
//Copyright(c)2015年cc.huanyouwang.Allrightsreserved.
//
importUIKit
classTestCell:UITableViewCell
{
@IBOutletvarimageView2:UIImageView!
textLabel2:UILabel!
location:UILabel!
overridefuncawakeFromNib()
{
super.awakeFromNib()
}
overridefuncsetSelected(selected:Bool,animated:Bool)
{
super.setSelected(selected,animated:animated)
}
/**
*配置Cell的内容方法
*/
funcconfigCellWithStatusModel(model:StatusModel!)
{
self.imageView2.setImageWithURL(NSURL(string:model.imageURL),0); background-color:inherit">placeholderImage:UIImage(named:"placeHolder"))
self.textLabel2.text=model.text
self.location.text=model.location
}
}

Cell上包含一个 imageView和两个label

3.常量定义,类似Oc的宏定义

StringConstant.swift

常量以小写k开头,其余大写;可以配上下划线

Swift的常量,使用 let定义常量;可以在其他地方使用

//SwiftDemo
//
importFoundation
importUIKit
letkGETSTATUSURL="http://lovemyqq.sinaapp.com/getState.php"
letkACCESSTOKEN="2.00HZE3aF0GvJSM551ca8e0920NF13N"
letkUID="5117873025"
letkACCESSTOKENKEY="access_token"
letkUIDKEY="uid"
letkPARAMDIC=[kACCESSTOKENKEY:kACCESSTOKEN,kUIDKEY:kUID]
letkREDCOLOR=UIColor.redColor
letkIMAGEKEY="image"
letkDATEKEY="date"
letkLOCATIONKEY="address"
letkCONTENTKEY="content"
letkRESULTKEY="result"
letkSTATEKEY="state"
//其他复杂类型,可以使用函数定义
//funcRGBA(r:CGFloat,g:CGFloat,b:CGFloat,a:CGFloat)
//{
//returnUIColor(red:r/255.0,green:g/255.0,blue:b/255.0,alpha:a)
//}
//使用方法如下
//vartheColor:UIColor=RGBA(255,255,1)

4.封装AF为一个常用的方法,便于ViewModel调用

AFRequest.swift

publictypealiasSuccessBlock=(obj:AnyObject)->Void!
AFRequest:NSObject
{
varmainURL:String!
varparamDict:[String:String]!
varsuccessBlock:SuccessBlock!
varmanager:AFHTTPRequestOperationManager
varhud:MBProgressHUD!
init(mainURL:String,paramDict:[String:String],successBlock:SuccessBlock)
{
self.mainURL=mainURL
self.paramDict=paramDict
self.successBlock=successBlock
self.manager=AFHTTPRequestOperationManager()
super.init()
}
funcstartRequestWithHUDOnView(view:UIView!)
{
self.hud=MBProgressHUD.showHUDAddedTo(view,0); background-color:inherit">animated:true)
self.hud.labelText="正在请求..."
varop=self.manager.GET(self.mainURL,
parameters:self.paramDict,0); background-color:inherit">success:{(operation:AFHTTPRequestOperation!,0); background-color:inherit">responseObject:AnyObject!)in
vararr:AnyObject!=NSJSONSerialization.JSONObjectWithData(responseObjectasNSData,0); background-color:inherit">options:NSJSONReadingOptions.AllowFragments,0); background-color:inherit">error:nil)
println(arr!)
unownedvarunSelf:AFRequest=self
unSelf.successBlock(obj:arr!)
unSelf.hud.customView=nil
unSelf.hud.labelText="加载成功!"
unSelf.hud.hide(false,0); background-color:inherit">afterDelay:3)
},
failure:{(operation:AFHTTPRequestOperation!,0); background-color:inherit">error:NSError!)in
println("请求错误Error:"+error.localizedDescription)
unownedvarself
unSelf.hud.hide(true)
})
op.responseSerializer=AFHTTPResponseSerializer()
op.start()
}
}

5.根据View/Cell所需的数据,封装一个Model类.

如封装一个和 Cell数据字段对应的Model类 StatusModel状态模型

StatusModel.swift

包含,属性,和存取器

StatusModel:NSObject
{
varimageURL:String!
vartext:String!
varlocation:String!
overrideinit()
{
//Todo
}
init(imageURL:String!,text:String,location:String)
{
self.imageURL=imageURL
self.text=text
self.location=location
}
varconfigModel:(String!,String!,String!)
{
set
{
self.imageURL=newValue.0
self.text=newValue.1
self.location=newValue.2
}
get
{
return(self.imageURL,self.text,255); background-color:inherit">self.location)
}
}
//省略set的简写的get
varurlOfImg:String
{
returnself.imageURL
}
}

6.ViewModel根据View所需数据,调用对应的接口;并且把数据绑定到Model中

解析JSON数据,绑定到Model中

StatusViewModel.swift

publicStatusViewModel:NSObject
{
funcrequestStatusList(view:UIView!,blk:SuccessBlock)
{
varaf=AFRequest(mainURL:kGETSTATUSURL,0); background-color:inherit">paramDict:kPARAMDIC)
{(obj)->Void!in
vardicO=objasDictionary<String,AnyObject>
vararr1:AnyObject?=dicO[kRESULTKEY]
vararrreal=arr1asArray<Dictionary<String,Dictionary<String,String>>>
varmodelArray=Array<StatusModel>()
/**解析得到的JSON数据为Model数组*/
fordictinarrreal
{
vardic=dict[kSTATEKEY]!asDictionary<String,String>
varsModel=StatusModel()
sModel.imageURL=dic[kIMAGEKEY]!
sModel.text=dic[kCONTENTKEY]!
sModel.location=dic[kLOCATIONKEY]!
modelArray.append(sModel)
}
println(modelArray[0])
blk(obj:modelArray)
returnVoid()
}
af.startRequestWithHUDOnView(view)
}
}

7.TableViewController 控制器中调用 ViewModel显示数据

TableViewController:UITableViewController
{
varmodelArray=Array<StatusModel>()
overridefuncviewDidLoad()
{
super.viewDidLoad()
loadData()
}
overridefuncdidReceiveMemoryWarning()
{
super.didReceiveMemoryWarning()
}
overridefuncnumberOfSectionsInTableView(tableView:UITableView)->Int
{
return1
}
overridefunctableView(tableView:UITableView,numberOfRowsInSectionsection:Int)->Int
{
returnmodelArray.count
}
overridefunctableView(tableView:UITableView,cellForRowAtIndexPathindexPath:NSIndexPath)->UITableViewCell
{
varsModel=self.modelArray[indexPath.row]
varcell=tableView.dequeueReusableCellWithIdentifier("TestCell",0); background-color:inherit">forIndexPath:indexPath)asTestCell
cell.configCellWithStatusModel(sModelasStatusModel)
returncell
}
*第一次加载数据时请求
*返回为空
*/
funcloadData()
{
StatusViewModel().requestStatusList(self.view,0); background-color:inherit">blk:{(obj)->Void!in
unownedvarweak_self:TableViewController=self
println("这是第一次加载数据的block\(__FUNCTION__)")
weak_self.modelArray=objasArray<StatusModel>
weak_self.tableView.reloadData()
returnVoid()
})
}
}

调用ViewModel之后再 reloadData()

当然,ViewModel也可能是在 View上调用的;比如 Cell上有一个按钮,点击按钮会进行网络请求,也需要调用 ViewModel

8.总结

我们可以看到在 TableViewController 中,代码非常的少.原来对应网络请求,对于视图更新都是放在 controller中;

使用MVVM后可以大大减少Controller的代码,是的各部分耦合性更低,更便于维护.

9.其他,view上有事件的触发

如果 Cell或者 View上或者有点击事件,或者其他事件;可以使用闭包封装 ;类似于上面的 AF请求.

Swift教程17-淡化MVC,使用MVVM框架开发轻巧便于维护的iOS app

相关推荐