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

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

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

绑定的TestCell.swift类

//TestCell.swift@H_

502

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

Cell上包含一个 imageView和两个label

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

StringConstant.swift

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

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

502

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

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

AFRequest.swift

502

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

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

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

StatusModel.swift

包含,属性,和存取器

502

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

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

解析JSON数据,绑定到Model中

Statusviewmodel.swift

viewmode

502

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

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

502

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

调用 viewmodel之后再 reloadData()

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

8.总结

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

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

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

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

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

猜你在找的Swift相关文章