您的位置:首页 > 其它

代理设计模式——实现九宫格界面

2013-11-14 14:18 477 查看

1.先实现一个实例,然后用代理设计模式实现这个实例,并比较代理设计模式的好处

1.1程序实现效果如图:



1.2.实现步骤

1.2.1搭建界面

MJAppView.xib界面:



1.2.2 plist文件





1.2.3代码

//  MJApp.h

//  模型类:用来存放数据的类

#import <Foundation/Foundation.h>

/**
copy : NSString
strong: 一般对象
weak: UI控件
assign:基本数据类型
*/

@interface MJApp : NSObject
/**
*  名称
*/
@property (nonatomic, copy) NSString *name;
/**
*  图标
*/
@property (nonatomic, copy) NSString *icon;

/**
*  通过字典来初始化模型对象
*
*  @param dict 字典对象
*
*  @return 已经初始化完毕的模型对象
*/
- (instancetype)initWithDict:(NSDictionary *)dict;

+ (instancetype)appWithDict:(NSDictionary *)dict;
@end


//
//  MJApp.m

#import "MJApp.h"

@implementation MJApp
- (instancetype)initWithDict:(NSDictionary *)dict
{
if (self = [super init]) {
self.name = dict[@"name"];
self.icon = dict[@"icon"];
}
return self;
}

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


//
//  MJAppView.h

#import <UIKit/UIKit.h>

@class MJApp;

@interface MJAppView : UIView

/**
*  模型数据
*/
@property (nonatomic, strong) MJApp *app;

+ (instancetype)appView;

/**
*  通过模型数据来创建一个view
*/
+ (instancetype)appViewWithApp:(MJApp *)app;

@end


//
//  MJAppView.m

#import "MJAppView.h"
#import "MJApp.h"

@interface MJAppView()
@property (weak, nonatomic) IBOutlet UIImageView *iconView;
@property (weak, nonatomic) IBOutlet UILabel *nameLabel;
- (IBAction)download:(UIButton *)sender;
@end

@implementation MJAppView

+ (instancetype)appViewWithApp:(MJApp *)app
{
NSBundle *bundle = [NSBundle mainBundle];
// 读取xib文件(会创建xib中的描述的所有对象,并且按顺序放到数组中返回)
NSArray *objs = [bundle loadNibNamed:@"MJAppView" owner:nil options:nil];
MJAppView *appView = [objs lastObject];
appView.app = app;
return appView;
}

+ (instancetype)appView
{
return [self appViewWithApp:nil];
}

- (void)setApp:(MJApp *)app
{
_app = app;

// 1.设置图标
self.iconView.image = [UIImage imageNamed:app.icon];

// 2.设置名称
self.nameLabel.text = app.name;
}

/**
*  下载
*/
- (IBAction)download:(UIButton *)btn {
// 1.让按钮失效(文字变为"已下载")
btn.enabled = NO;

// 2.显示下载成功的信息("成功下载xxx")
UILabel *label = [[UILabel alloc] init];
label.text = [NSString stringWithFormat:@"成功下载%@", self.app.name];
label.font = [UIFont systemFontOfSize:12];
label.textAlignment = NSTextAlignmentCenter;
label.textColor = [UIColor whiteColor];
label.backgroundColor = [UIColor blackColor];
label.frame = CGRectMake(0, 0, 150, 25);
label.center = CGPointMake(160, 240);
label.alpha = 0.0;

// 巧妙利用控件的尺寸和圆角半径,能产生一个圆
label.layer.cornerRadius = 5;
// 超出主层边界的内容统统剪掉
//    label.layer.masksToBounds = YES;
label.clipsToBounds = YES;

[self.superview addSubview:label];

// 3.动画
[UIView animateWithDuration:1.0 animations:^{
label.alpha = 0.5;
} completion:^(BOOL finished) {
[UIView animateWithDuration:1.0 delay:1.0 options:UIViewAnimationOptionCurveLinear animations:^{
label.alpha = 0.0;
} completion:^(BOOL finished) {
[label removeFromSuperview];
}];
}];
}
@end


//
//  MJViewController.m

#import "MJViewController.h"
#import "MJApp.h"
#import "MJAppView.h"

@interface MJViewController ()
/** 存放应用信息 */
@property (nonatomic, strong) NSArray *apps;
@end

@implementation MJViewController

- (void)viewDidLoad
{
[super viewDidLoad];

// 添加应用信息

// 0.总列数(一行最多3列)
int totalColumns = 3;

// 1.应用的尺寸
CGFloat appW = 85;
CGFloat appH = 90;

// 2.间隙 = (控制器view的宽度 - 3 * 应用宽度) / 4
CGFloat marginX = (self.view.frame.size.width - totalColumns * appW) / (totalColumns + 1);
CGFloat marginY = 15;

// 3.根据应用个数创建对应的框框(index 0 ~ 11)
for (int index = 0; index<self.apps.count; index++) {
// 3.1.创建view
MJAppView *appView = [MJAppView appViewWithApp:self.apps[index]];

// 3.2.添加view
[self.view addSubview:appView];

// 3.3.设置frame
int row = index / totalColumns;
int col = index % totalColumns;
// 计算x和y
CGFloat appX = marginX + col * (appW + marginX);
CGFloat appY = 30 + row * (appH + marginY);
appView.frame = CGRectMake(appX, appY, appW, appH);

// 3.4.设置数据
//        appView.app = self.apps[index];
}
}

- (NSArray *)apps
{
if (_apps == nil) {
// 初始化

// 1.获得plist的全路径
NSString *path = [[NSBundle mainBundle] pathForResource:@"app.plist" ofType:nil];

// 2.加载数组
NSArray *dictArray = [NSArray arrayWithContentsOfFile:path];

// 3.将dictArray里面的所有字典转成模型对象,放到新的数组中
NSMutableArray *appArray = [NSMutableArray array];
for (NSDictionary *dict in dictArray) {
// 3.1.创建模型对象
MJApp *app = [MJApp appWithDict:dict];

// 3.2.添加模型对象到数组中
[appArray addObject:app];
}

// 4.赋值
_apps = appArray;
}
return _apps;
}

@end


2.代理设计模式

2.1背景

分析上面的实现代码会发现 xib文件和控制器耦合性太强,假如某天xib里面的文件改变了,那么控制器就必须跟着改变……
所以需要让xib和控制器隔离开来

2.2代码

模型类
//  MJApp.h

//  模型类:用来存放数据的类

#import <Foundation/Foundation.h>

/**
copy : NSString
strong: 一般对象
weak: UI控件
assign:基本数据类型
*/

@interface MJApp : NSObject
/**
*  名称
*/
@property (nonatomic, copy) NSString *name;
/**
*  图标
*/
@property (nonatomic, copy) NSString *icon;

/**
*  通过字典来初始化模型对象
*
*  @param dict 字典对象
*
*  @return 已经初始化完毕的模型对象
*/
- (instancetype)initWithDict:(NSDictionary *)dict;

+ (instancetype)appWithDict:(NSDictionary *)dict;
@end


//
//  MJApp.m

#import "MJApp.h"

@implementation MJApp
- (instancetype)initWithDict:(NSDictionary *)dict
{
if (self = [super init]) {
self.name = dict[@"name"];
self.icon = dict[@"icon"];
}
return self;
}

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


//
//  MJAppView.h

#import <UIKit/UIKit.h>

@class MJApp, MJAppView;

// 声明一个协议
@protocol MJAppViewDelegate <NSObject>
@optional
- (void)appViewClickedDownloadButton:(MJAppView *)appView;
@end

// 耦合性
@interface MJAppView : UIView

/**
*  代理
*/
@property (nonatomic, weak) id<MJAppViewDelegate> delegate;

//@property (weak, nonatomic) IBOutlet UIButton *downloadBtn;

//@property (nonatomic, weak) UIView *vcView;
/**
*  模型数据
*/
@property (nonatomic, strong) MJApp *app;

+ (instancetype)appView;

/**
*  通过模型数据来创建一个view
*/
+ (instancetype)appViewWithApp:(MJApp *)app;

@end


//
//  MJAppView.m

#import "MJAppView.h"
#import "MJApp.h"

@interface MJAppView()
@property (weak, nonatomic) IBOutlet UIImageView *iconView;
@property (weak, nonatomic) IBOutlet UILabel *nameLabel;
- (IBAction)download:(UIButton *)sender;
@end

@implementation MJAppView

+ (instancetype)appViewWithApp:(MJApp *)app
{
NSBundle *bundle = [NSBundle mainBundle];
// 读取xib文件(会创建xib中的描述的所有对象,并且按顺序放到数组中返回)
NSArray *objs = [bundle loadNibNamed:@"MJAppView" owner:nil options:nil];
MJAppView *appView = [objs lastObject];
appView.app = app;
return appView;
}

+ (instancetype)appView
{
return [self appViewWithApp:nil];
}

- (void)setApp:(MJApp *)app
{
_app = app;

// 1.设置图标
self.iconView.image = [UIImage imageNamed:app.icon];  //self是指MJAppview

// 2.设置名称
self.nameLabel.text = app.name;
}

/**
*  下载
*/
- (IBAction)download:(UIButton *)btn {
// 1.让按钮失效(文字变为"已下载")
btn.enabled = NO;

// 2.通知代理
//    [self.delegate appViewClickedDownloadButton:self];
if ([self.delegate respondsToSelector:@selector(appViewClickedDownloadButton:)]) {
[self.delegate appViewClickedDownloadButton:self];
}
}
@end


//
//  MJViewController.m

#import "MJViewController.h"
#import "MJApp.h"
#import "MJAppView.h"

@interface MJViewController () <MJAppViewDelegate>
/** 存放应用信息 */
@property (nonatomic, strong) NSArray *apps;
@end

@implementation MJViewController

- (void)viewDidLoad
{
[super viewDidLoad];

// 添加应用信息

// 0.总列数(一行最多3列)
int totalColumns = 3;

// 1.应用的尺寸
CGFloat appW = 85;
CGFloat appH = 90;

// 2.间隙 = (控制器view的宽度 - 3 * 应用宽度) / 4
CGFloat marginX = (self.view.frame.size.width - totalColumns * appW) / (totalColumns + 1);
CGFloat marginY = 15;

// 3.根据应用个数创建对应的框框(index 0 ~ 11)
for (int index = 0; index<self.apps.count; index++) {
// 3.1.创建view
MJAppView *appView = [MJAppView appViewWithApp:self.apps[index]];

appView.delegate = self;

//        appView.downloadBtn.tag = index;
//        [appView.downloadBtn addTarget:self action:@selector(download:) forControlEvents:UIControlEventTouchUpInside];
//        appView.vcView = self.view;

// 3.2.添加view
[self.view addSubview:appView];

// 3.3.设置frame
int row = index / totalColumns;
int col = index % totalColumns;
// 计算x和y
CGFloat appX = marginX + col * (appW + marginX);
CGFloat appY = 30 + row * (appH + marginY);
appView.frame = CGRectMake(appX, appY, appW, appH);

// 3.4.设置数据
//        appView.app = self.apps[index];
}
}

/**
*  当点击下载按钮时就会调用
*/
- (void)appViewClickedDownloadButton:(MJAppView *)appView
{
// 1.取出模型
MJApp *app = appView.app;

// 2.添加标签
UILabel *label = [[UILabel alloc] init];
label.text = [NSString stringWithFormat:@"成功下载%@", app.name];  //
label.font = [UIFont systemFontOfSize:12];
label.textAlignment = NSTextAlignmentCenter;
label.textColor = [UIColor whiteColor];
label.backgroundColor = [UIColor blackColor];
label.frame = CGRectMake(0, 0, 150, 25);
label.center = CGPointMake(160, 240);
label.alpha = 0.0;
label.layer.cornerRadius = 5; //要设置一个控件的圆角就要设置其图层 (layer就叫图层   cornerRadius叫圆角半径
//lable.layer.masksToBounds = YES  //这个lable的图层要跟随其边界来展示  超出其边界的就要减掉
label.clipsToBounds = YES;  //减掉子层那些找出边界的部分 ,这行代码和上面一行代码效果一样
[self.view addSubview:label];

// 3.动画  (alpha花1秒钟时间从0慢慢变到0.5,再用1秒钟时间从
[UIView animateWithDuration:1.0 animations:^{
label.alpha = 0.5;
} completion:^(BOOL finished) {
[UIView animateWithDuration:1.0 delay:1.0 options:UIViewAnimationOptionCurveLinear animations:^{
label.alpha = 0.0;
} completion:^(BOOL finished) {
[label removeFromSuperview];
}];
}];
}

- (NSArray *)apps
{
if (_apps == nil) {
// 初始化

// 1.获得plist的全路径
NSString *path = [[NSBundle mainBundle] pathForResource:@"app.plist" ofType:nil];

// 2.加载数组
NSArray *dictArray = [NSArray arrayWithContentsOfFile:path];

// 3.将dictArray里面的所有字典转成模型对象,放到新的数组中
NSMutableArray *appArray = [NSMutableArray array];
for (NSDictionary *dict in dictArray) {
// 3.1.创建模型对象
MJApp *app = [MJApp appWithDict:dict];

// 3.2.添加模型对象到数组中
[appArray addObject:app];
}

// 4.赋值
_apps = appArray;
}
return _apps;
}

@end


3.Delegate

3.1Delegate的使用场合

对象A内部发生了一些事情,想通知对象B

对象B想监听对象A内部发生了什么事情

对象A想在自己的方法内部调用对象B的某个方法,并且对象A不能对对象B有耦合依赖

对象A想传递数据给对象B

……

以上情况,结果都一样:对象B是对象A的代理(delegate)

3.2使用delegate的步骤

先搞清楚谁是谁的代理(delegate)

定义代理协议,协议名称的命名规范:控件类名 + Delegate

定义代理方法

代理方法一般都定义为@optional

代理方法名都以控件名开头

代理方法至少有1个参数,将控件本身传递出去

设置代理(delegate)对象 (比如myView.delegate = xxxx;)

代理对象遵守协议

代理对象实现协议里面该实现的方法

在恰当的时刻调用代理对象(delegate)的代理方法,通知代理发生了什么事情

(在调用之前判断代理是否实现了该代理方法)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: