iOS开发——MVC详解&Swift+OC

时间:2024-05-02 21:34:02

MVC 设计模式

这两天认真研究了一下MVC设计模式,在iOS开发中这个算是重点中的重点了,如果对MVC模式不理解或者说不会用,那么你iOS肯定学不好,或者写不出好的东西,当然本人目前也在学习中,不过既然能看到这篇文档,说明你已经开始着手学习并且想深入研究它了,个人也是研究很久才搞懂,就写下来希望对各位有用,也能方便自己以后开发中查看,好了废话不多说,下面就来详细介绍一下MVC,并且用实例验证一下在项目开发中怎么去使用它。

相信你对 MVC 设计模式 并不陌生,只是不能完全理解其中的含义或者不能很好的使用它。

从字面意思来理解, Modal , View , Controller ,其用意在于将数据与视图分离开来------解藕。

在iOS cocoa touch 编程中, MVC机制被发挥得淋漓尽致。 MVC 示意图如下。 只有充分理解了MVC,才能在编写出优雅的iOS app。为充分理解 MVC, 相关的概念(比如: Delegate、 Protocol、 Notification 等)也要了然于胸。

MVC 约定, Model 不允许与View 打交道。 Model 是管理数据的, 当Model中的数据发生变化时,与之对应的视图应更新。 这就需要一种机制来支持。为此 iOS 框架提供了两种支持机制: Notification 和KVO (Key-Value Observing)。

  KVO 可简单理解为,为你所关注的 Key 对象注册一个监听器。 当有数据发生变化时,就会发出广播给所有的监听器。

MVC 也约定, View 不允许直接引用Modal, 它只能被Controller 所控制。 Controller 控制 View 显示什么数据。我们知道,View 所要显示的数据是来源于 Modal, View 上产生的事件 ( 比如 Touch事件)需要通知 Controller。 既然MVC 不允许直接打交道,就需要提供一种机制。

不错, iOS 确实提供了一种机制, 名曰: Delegate。 Delegate 这个词, 有人将它译为“委托”,也有人将它译为“代理”。名称上的差异没有什么,重要的是如何理解 Delegate。 Delegate设计模式的引入,就是为了解决UIView与Controller松耦合互动问题。

为便于理解, 这里截取一张来iOS MVC 示意图:

iOS开发——MVC详解&Swift+OC

我们在详细介绍下这张图的内涵:

1.  图中,绿色的箭头表示直接引用。 对View 的直接引用体现在 IBOutlet 上。 当引用一个View 时,比如Button。 需要在ViewController

中声明一个  IBOutlet  UIButton * btn;

2. 然后,我们看View 是怎么向 Controller 通信的。对于这个,  iOS 有三种常见的模式:

设置View对应的Action Target。如设置UIButton的Touch up inside的Action Target。

设置View的Delegate,如UIAlertViewDelegate, UIActionSheetDelegate,UITextFieldDelegate等。

设置View的data source, 如UITableViewDataSource。

通过以上三种模式,View既能向Controller通信,又无需知道具体的Controller是谁,这样,View 就与Controller解耦了。

除此之外, iOS 还提供了 Action-Target 模式来让Controller 监听View 触发的事件。 View 又是如何获取数据呢? iOS提供了 Data source 的概念,其实也就是Protocol 的应用。

综上所述, 正是在iOS MVC框架的驱使下, 才需要深入理解 Delegate、Protocol等概念。

下面来看看代码中是怎么实现的,

说到MVC我们一开始都是先从Model开始,然后再编写对应的View最后在控制器中做相应的控制

一:Model

1:首先我们先创建一个模型类,用于实现模型数据的读取

头文件中创建两个模型属性,和两个模型方法,

 #pragma mark 模型属性

 //用于存储对应的数据

 @property (nonatomic, copy) NSString *name;

 @property (nonatomic, copy) NSString *icon;

 #pragma mark 模型方法

 //用于初始化模型数据

 -(instancetype)initWithDict:(NSDictionary *)dict;

 +(instancetype)shopWithDict:(NSDictionary *)dict;

实现文件中实现对应的模型方法,

 #pragma mark 模型方法de实现

 -(instancetype)initWithDict:(NSDictionary *)dict{
     if (self == [super init]) {
         //创建模型并且通过字典的键获取里面的值放到模型属性中,方便后面用于数据处理直接食用
         shopsModel *shop = [[shopsModel alloc] init];
         shop.name = dict[@"name"];
         shop.icon = dict[@"icon"];
     }
     return self;
 }

 +(instancetype)shopWithDict:(NSDictionary *)dict
 {
     return [[self alloc] initWithDict:dict];
 }

二:View

/***********************纯代码***********************************/

创建一个视图类,用于显示对应的视图(控件,数据)

头文件中通过模型定义一个属性,并且定义三个快速创建视图View的方法,这种方法是使用较多的,而且让人一看上去就知道怎么用

 //引入模型类
 @class shopsModel;

 @interface shopsView : UIView

 @property (nonatomic, assign) shopsModel *shop;

 //实例方法,使用模型快速创建视图View
 -(instancetype)initWIthShop:(shopsModel *)shop;

 //类方法,使用模型快速创建视图View
 +(instancetype)shopWithShop:(shopsModel *)shop;

 //用于创建View的一个类方法
 +(instancetype)shopView;

实现文件中先导入模型类:

#import "shopsModel.h"

然后实现对应的创建View的方法,

 -(instancetype)initWIthShop:(shopsModel *)shop
 {
     if (self == [super init]) {
         self.shop = shop;
     }
     return self;
 }

 +(instancetype)shopWithShop:(shopsModel *)shop
 {
     return [[self alloc] initWIthShop:shop];
 }

 +(instancetype)shopView
 {
     return [[self alloc] init];
 }

记得平时我们自定义View的时候,都是直接在init方法中做的,但是,这里有一个细节需要注意的,就是init方法内部会自动调用initWithFrame方法,我们要自定义View一般要做的就是设置View的布局和View的创建,而initWithFrame正好是控件布局之前创建控件的时候调用的,所以我们建议在这里设置他的Frame

这里我们先要在私有拓展中定义两个属性用于记录我们所创建的View的属性

@property (nonatomic, weak) UIImageView *imageV;

@property (nonatomic, weak) UILabel *label;

实现空间创建的View方法

 //初始化View的方法
 -(instancetype)initWithFrame:(CGRect)frame
 {

     if (self == [super initWithFrame:frame]) {
         //创建UIImageView和UILabel把它加到自定义View上面,并且使用我们定义的属性纪录他,方便后面使用

         UIImageView *image = [[UIImageView alloc] init];
         [self addSubview:image];
         self.imageV = image;

         UILabel *label = [[UILabel alloc] init];
         [self addSubview:label];
         self.label = label;
     }
     return self;
 }

在View中布局空间的时候就会调用下面的方法

 //布局子控件方法
 -(void)layoutSubviews
 {
     [super layoutSubviews];

     //获取宽高
     CGFloat W = self.frame.size.width;
     CGFloat H = self.frame.size.height;

     //设置自定义View中对应控件的Frame
     self.imageV.frame = CGRectMake(, , W, W);
     self.label.frame = CGRectMake(, W, W, H - W);
 }

我们还有一个事情要做,就是重写通过模型创建的那个属性,将模型里面的属性设置到控件中对应的属性,

 //重写Set方法,设置对应的数据
 -(void)setSpView:(shopsModel *)shop
 {
     _shop = shop;

     //使用模型中的数据设置控件对应的属性
     self.imageV.image = [UIImage imageNamed:shop.icon];
     self.label.text = shop.name;

 }

/***********************Xib***********************************/

关于Xib这里就不多做解释了

说一下怎么使用Xib创建一个我们自定义的View并且,在控制器里面显示

首先新建一个文件选中interface Builder中的空文件设置一个名字,就可以创建一个Xib文件

iOS开发——MVC详解&Swift+OC

————然后创建一个自定义View的类。

点击Xib会看到里面什么也没有,因为我需要自定View所以拖一个View到Xib内部,并且拖我们对应要实现的控件到View里面作为他的子控件,这里需要注意的我们需要设置Xib文件对应的类为我们创建的那个类的名字:

iOS开发——MVC详解&Swift+OC

然后我们要做的就是将我们放在View里面的属性设置对输出口(这里就是拖线)这里我们一般是拖到实现文件中的私有拓展中

 //控件输出口

 @property (weak, nonatomic) IBOutlet UIImageView *icon;

 @property (weak, nonatomic) IBOutlet UILabel *name;

再后面的操作之前我们还需要在头文件引入这个类,并且通过模型创建一个属性

@property (nonatomic, strong) shopsModel *shop;

定义一个通过模型快速创建View的方法

+(instancetype)shopViewWithShop:(shopsModel *)shop;

然后就是在实现文件中实现这个方法,我们是将Xib的加载封装在里面更好的实现解耦和不被外界知道

这里加载Xib文件的方式有两种

 /**
  *  便利创建自定义View的方法
  */
 +(instancetype)shopViewWithShop:(shopsModel *)shop
 {

     /**
      *  加载Xib文件
      */
     iCocosView *shops = [[[NSBundle mainBundle] loadNibNamed:@"shops.plist" owner:nil options:nil] lastObject];
     /**
      *  第二种方法
      */
 //    UINib *nib = [UINib nibWithNibName:@"shops.plist" bundle:[NSBundle mainBundle]];
 //    NSArray *arr = [nib instantiateWithOwner:nil options:nil].lastObject;

     shops.shop = shop;
     return shops;
 }

这里同样需要实现重写那个通过模型创建的属性的Setter方法

 //重写Setter方法,设置View中对应的控件的属性为模型中的数据
 -(void)setShop:(shopsModel *)shop
 {
     _shop = shop;

     //设置模型属性
     self.icon.image = [UIImage imageNamed:shop.icon];
     self.name.text = shop.name;
 }

三:Controller

完成上面之后,控制器里面实现久简单多了

定义一个可变数组用于存放我们的模型数据

@property (nonatomic, strong) NSMutableArray *shops;

使用懒加载的方式加载那个plist数据,并且转成模型放到一个数组中,方便后面的使用

 //懒加载
 -(NSMutableArray *)shops
 {
     if (_shops == nil) {
         //加载plist数据并且把他放到一个数组中
         NSArray *shopsArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"shops.plist" ofType:nil]];
         //初始化存放数据的可变模型数组
         _shops = [NSMutableArray array];

         //遍历那个存放好了plist数组的数组,把他放到一个字典中
         for (NSDictionary *arr in shopsArray) {

             //使用快速创建模型的方法创建一个模型对象,并且将他加到可变的模型数组中,方便后面使用
             shopsModel *shop = [shopsModel shopWithDict:arr];
             [_shops addObject:shop];
         }
     }
     return _shops;

 }

最后我们就只需要在控制器里面控制并且使用上面的模型和View了,

先来看看纯代码是怎么实现的

     //使用快速创建方法去存放模型数据的数组中取出数据,通过View内部的实现显示到View上面
     shopsView *shView = [shopsView shopWithShop:self.shops[count]];
     //设置View的frame
     shView.frame = CGRectMake(shopX, shopY, shopW, shopH);
     //将自定义View加到界面中显示
     [self.shopView addSubview:shView];

如果你使用的是Xib,方法和思路还是一样的

     //去存放模型数据的数组中取出数据
     iCocosView *shop = self.shops[index];
     //通过取出来的数据快速创建一个View放到view内部实现并且使用
     iCocosView *shopView = [iCocosView shopViewWithShop:shop];
     //设置View的Frame
     shopView.frame = CGRectMake(shopX, shopY, shopW, shopH);
     //将自定义的View添加到界面显示
     [self.shopsView addSubview:shopView];

/***********************************************Swift实现*******************************************************/

注:如果你没有一点Swift基础(基本语法都不知道,虽然和OC很相似,但看了也是没有用的),建议保留此文,后面学习的Swift过程中遇到的时候再拿来看看就完全不一样了。

最近swift被炒的很火,由于苹果今年做了一个很大的决定,就是Swift2.0将开源,9月份将会放出源码,就意味着我们可以知道这里面是怎么实现的,并且可以在Linux平台上写,我想好处远远不止这些。

笔者对swift也有些一些研究,平时在OC上面学习到一个好东西的时候都会使用实现一遍,所以这个就更不能例外了。

一:Model

第一步我们同样从模型下手,这里喝OC有些不同的是Swift只是在一个文件里面实现的

 import UIKit

 class Shop: NSObject {

     //定义变量字符串属性
     var name:String!
     var icon:String!

     //初始化模型方法
     init(dict:[String:String]) {
         super.init()

         //设置模型对应的属性
         self.name = dict["name"]
         self.icon = dict["icon"]

         //使用封装好的方法设置模型属性
         setValuesForKeysWithDictionary(dict)
     }

 }

二:View

/**************************************纯代码************************************************/

自定义View中实现的方法也是差不多的,只是方法的形式和关键字不同而已

 import UIKit

 class ShopView: UIView {

     /// 懒加载控件
     lazy var iconView:UIImageView = UIImageView()
     lazy var nameView:UILabel = UILabel()

     /**
     初始化Frame
     */
     override init(frame: CGRect) {
         super.init(frame: frame)

         //添加子控件到界面
         self.addSubview(iconView)
         self.addSubview(nameView)
         //设置Label的文字剧中
         nameView.textAlignment = NSTextAlignment.Center
     }

     /**
     从文件中加载数据(Xib/StoryBoard)
     */
     required init(coder aDecoder: NSCoder) {
         fatalError("init(coder:) has not been implemented")
     }

     /**
     布局子控件方法
     */
     override func layoutSubviews() {
         //获取宽高
         var W:CGFloat = self.frame.size.width
         var H:CGFloat = self.frame.size.height

         //设置UIImageView和UIlable的frame
         self.iconView.frame = CGRectMake(, , W, W)
         self.nameView.frame = CGRectMake(, W, W, H - W)
     }
 }

/**************************************Xib************************************************/

使用Xib方式同样是先创建Xib,创建对应的类文件,设置Xib对应为我们创建的类,添加子控件,设置输出口,然后就实现对应的方法

 import UIKit

 class XMGShopView: UIView {

     /** 图片 */
     @IBOutlet weak var iconView: UIImageView!
     /** 名字 */
     @IBOutlet weak var nameLabel: UILabel!

     var shop: Shop? {
         didSet {
             // 重写set方法
             iconView.image = UIImage(named: shop!.icon)
             nameLabel.text = shop!.name
         }
     }
     //加载Xib实现方法
     class func shopView() -> XMGShopView{
         return NSBundle.mainBundle().loadNibNamed("XMGShopView", owner: nil, options: nil).last as! XMGShopView
     }

 }

注:这里最值得注意的地方是didSet这个方法,其实在swift中海油一个方法叫willSet,他们是相对应的,使用来监听属性变化的,就相当于OC里面的KVO不过在这里叫做属性观察者,分别是在设置属性后和之前调用,这里由于需要只实现了设置之后观察属性的变化

三:Conreoller

关于控制器里面实现的代码和OC里面就有许多不同的地方了,特别是懒加载(lazy)这里,笔者也是搞了好久才搞明白

懒加载

     //使用lazy实现懒加载,这里使用的是一个叫做闭包返回值的东西来实现的
     lazy var shops:NSMutableArray = {
         //从MainBundle中获取plist文件的路径
         let path:String = NSBundle.mainBundle().pathForResource("shops.plist", ofType: nil)!
         //加载plist文件放到一个可变数组里面,
         let tempArr:NSMutableArray = NSMutableArray(contentsOfFile: path)!
         //定义一个可变的数组,数组的大小就是上面那个存放plist数据的数组的大小
         let shopsArrM:NSMutableArray = NSMutableArray(capacity: tempArr.count)
         //遍历存放plist数据的那个数组,放到一个字典中去
         for dict in tempArr
         {
             //使用模型中实现的方法创建一个模型对象
             let shop: Shop = Shop(dict: dict as! [String : String])
             //将模型对象放到plist数组中
             shopsArrM.addObject(shop)
         }
         //返回那个存放模型数据的数组
         return shopsArrM
         }()

下面就死创建并且显示View的实现

/**************************************纯代码************************************************/

 //创建一个自定义的View
         let shopView: ShopView = ShopView()
         //设置他的frame
         shopView.frame = CGRect(x: shopX, y: shopY, width: shopW, height: shopH)
         //取出模型数组中对应的数组设置到试图中(这里使用了?表示类型转换)
         shopView.shop = self.shops[index] as? Shop
         //添加并显示
         self.shopsView.addSubview(shopView)

/**************************************Xib************************************************/

 //创建一个自定义的View
         let shopView: iCocosView = iCocosView.shopView()
         //设置他的frame
         shopView.frame = CGRect(x: shopX, y: shopY, width: shopW, height: shopH)
         //取出模型数组中对应的数组设置到试图中(这里使用了?表示类型转换)
         shopView.shop = self.shops[index] as? Shop
         //添加并显示
         self.shopsView.addSubview(shopView)

使用纯代码和Xib的方式没有什么不同,最主要是自定义View内部的实现。

mvc机制

iOS开发——MVC详解&Swift+OC

说明:

(1)在开发过程中,作为控制器处理的量级应该很轻,不该操心的不操心。协调好模型和视图就ok了,要学会当一个好老板。

(2)三个部分各司其职,数据模型只负责数据的处理,视图部分只负责把拿到的数据进行显示,两个部分都是被动的,等待着大管家控制器的调遣。

(3)在OC中,如果视图和数据模型之间有通道,那控制器是否处于失控状态呢?

网上有人是这里理解MVC的:

MVC是Model-VIew-Controller,就是模型-视图-控制器,这些都是什么东西呢?MVC把软件系统分为三个部分:Model,View。controller。在cocoa中,你的程序中的每一个object(对象)都将明显地仅属于这三部分中的一个,而完全不属于另外两个。

      Model = 你的程序是什么(而不是你的程序是如何显示的)

让我们举个例子,我们上中学的时候,我们的步步高电子词典中有个游戏叫“雷霆战机”,也就是“打飞机”的游戏,Model就是:你的小飞机的攻击力是多少?你的小飞机上装的是什么武器,炮弹,导弹,还是激光炮?你的小飞机还有多少血?等等。再概括点说,就是你的程序将要实现的功能,或者是它所能干的事情。

  

                  Controller = 如何使你的模型呈现给用户(程序逻辑)

Controller是程序内部的逻辑,大多情况下你将看不到它,它将Model和View捆绑在一起,它将处理用户的输入,例如,你按开炮的键子,Controller就会通过内部的逻辑来处理你的要求,并在屏幕上做出相应的显示,你将看到屏幕上的小飞机发出炮弹击中敌机。这也是Controller控制View的显示的例子。所以你可以把Controller看成是连接M和V的桥梁。

                  View = 在屏幕上你所看到的(是你的Controller的“奴才”)

接着前面的小飞机,View就是:你的小飞机是什么样子的,有一个还是两个翅膀,有几挺枪炮;还有,你的飞机在屏幕上的位置等等。总之,你在屏幕上看到的组件都可以归类为View。