ios开发-UI基础-应用管理(单纯界面)改进3-xib使用

　　[注意]转载请注明出处:http://www.cnblogs.com/hukezhu/　　

　　上篇文章是使用了字典转模型的方法实现的,本篇引入一个新的概念xib(描述局部界面的文件)(相对于storyboard描述全局界面来说).

　　使用xib可以使用可视化界面开发来代替完全代码开发.(当然这不是绝对的,一般实际开发中会结合使用).

　　xib文件的加载过程:
　　　　0> 根据路径, 搜索对应的xib文件(nib文件)
　　　　1> 加载xib文件的时候, 会按顺序加载xib文件中的每个控件。
　　　　2> 对于每个控件, 创建的时候都会查找对应的Class属性中配置的是那个类, 那么就创建对应的类的对象。
　　　　3> 获取到某个视图以后, 按照在xib中配置的属性的值, 放在数组中,
　　　　4> 最后返回一个数组, 这个数组中包含创建的所有元素对象。

　　使用xib封装一个自定义view的步骤
　　　　1> 新建一个AppView.xib文件来描述AppView内部的结构
　　　　2> 新建一个继承UIView的自定义view,假设类名叫做(appView)
　　　　3> 修改UIView的类型为appView真实类型
　　　　4> 将内部的子控件跟appView进行属性连线
　　　　5> appView提供一个模型属性
　　　　6> 重写模型属性的set方法,因为在set方法中可以拿到外界控制器传递的模型数据
　　　　7> 把模型数据拆开,分别设置数据到对应的子控件中
　　　　补充:提供一个创建AppView的类方法,将读取xib文件的代码屏蔽起来

　　xib文件的创建过程:

　　xcode界面下,commond+ N--->ios--->Users interface--->view---->create如下图:　　　

附上源代码:

KZAppView.h

//
//  KZAppModel.h
//  UI基础-03-05-14
//
//  Created by hukezhu on 15/5/15.
//
//

#import <Foundation/Foundation.h>
/*吃唐僧肉的小悟空-转载请注明出处http://www.cnblogs.com/hukezhu/*/
@interface KZAppModel : NSObject
/**
 *  应用图标
 */
@property (nonatomic ,copy) NSString *icon;
/**
 *  应用名称
 */
@property (nonatomic ,copy) NSString *name;

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

//类方法
+ (instancetype)appWithModelDict:(NSDictionary *)dict;

@end

KZAppView.m

//
//  KZAppModel.m
//  UI基础-03-05-14
//
//  Created by hukezhu on 15/5/15.
//
//

#import "KZAppModel.h"

@implementation KZAppModel
/*吃唐僧肉的小悟空-转载请注明出处http://www.cnblogs.com/hukezhu/*/
//对象方法
-(instancetype)initWithDict:(NSDictionary *)dict{

    //重写构造方法的默认写法
    if(self = [super init]){
    
        //将字典的所有属性赋值给模型
        self.icon = dict[@"icon"];
        self.name = dict[@"name"];
    }
    return self;
}
//类方法
+(instancetype)appWithModelDict:(NSDictionary *)dict{

    //注意此处是self
    return [[self alloc]initWithDict:dict];
}
@end

ViewController.m

//
//  ViewController.m
//  03-应用管理
//
//  Created by hukezhu on 15/5/14.
//
//

#import "ViewController.h"
#import "KZAppModel.h"

@interface ViewController ()
@property (nonatomic,strong)NSArray *apps;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //每一行的应用的个数
    int totalCol = 3;
    /*吃唐僧肉的小悟空-转载请注明出处http://www.cnblogs.com/hukezhu/*/
    
    //添加一个小的view
    CGFloat appW = 80;
    CGFloat appH = 100;
    CGFloat marginX = 20;
    CGFloat marginY = 20;
    CGFloat hightMargin = 30;
    CGFloat leftMargin = (self.view.frame.size.width - totalCol * appW - (totalCol - 1) *marginX)* 0.5;
    
    
    
    for (int i = 0; i < self.apps.count; i++) {
        
        
        //计算行号和列号
        int row = i / totalCol;
        int col = i % totalCol;
        
        CGFloat appX = leftMargin + (marginX + appW)* col;
        CGFloat appY = hightMargin + (marginY + appH)* row;
        
        //1.添加view
    
       
        //首先拿到一个格子视图
        UIView *appView = [[NSBundle mainBundle]loadNibNamed:@"KZAppView" owner:nil options:nil][0];
        
        //1.2设置frame
        appView.frame = CGRectMake(appX, appY, appW, appH);
        //1.3设置背景色(便于代码阶段验证,之后会删除)
        //appView.backgroundColor = [UIColor redColor];
        //1.4将这个appView添加到view中
        [self.view addSubview:appView];
        
        //加载数据
        //NSDictionary *dict = self.apps[i];
        //将数据赋值给模型对象
        KZAppModel *appModel = self.apps[i];
        
        
        //通过数组的特性拿到里面的小控件,进行赋值
        UIImageView *imageView = (UIImageView *)appView.subviews[0];
        imageView.image = [UIImage imageNamed:appModel.icon];
        
        UILabel *label = appView.subviews[1];
        label.text = appModel.name;
        
        UIButton *downBtn = (UIButton *)appView.subviews[2];
        [downBtn addTarget:self action:@selector(btnOnClick:) forControlEvents:UIControlEventTouchUpInside];
        
        
//        //2.添加图片UIImageView
//        CGFloat imageW = 60;
//        CGFloat imageH = 50;
//        CGFloat imageX = (appW - imageW)*0.5;
//        CGFloat imageY = 0;
//        UIImageView *imageView = [[UIImageView alloc]init];
//        imageView.frame = CGRectMake(imageX, imageY, imageW, imageH);
//        //imageView.backgroundColor = [UIColor blueColor];
//        //imageView.image = [UIImage imageNamed:dict[@"icon"]];
//        //从模型对象中取出数据
//        imageView.image = [UIImage imageNamed:appModel.icon];
//        [appView addSubview:imageView];
//    
//        
//        //3.添加应用名称
//    
//        CGFloat labelW = 80;
//        CGFloat labelH = 25;
//        CGFloat labelX = 0;
//        CGFloat labelY = imageH;
//        UILabel *label = [[UILabel alloc]init];
//        label.frame = CGRectMake(labelX, labelY, labelW, labelH);
//        //label.backgroundColor = [UIColor grayColor];
//        //label.text = dict[@"name"];
//        //从模型对象中取出数据name
//        label.text = appModel.name;
//        
//        //设置字体大小
//        label.font = [UIFont systemFontOfSize:13];
//        //设置字体居中
//        label.textAlignment = NSTextAlignmentCenter;
//        [appView addSubview:label];
//        
//        //4.添加下载按钮
//        
//        CGFloat downloadW = 60;
//        CGFloat downloadH = 25;
//        CGFloat downloadX = 10;
//        CGFloat downloadY = labelH + labelY;
//        UIButton *downloadBtn = [[UIButton alloc]init];
//        downloadBtn.frame = CGRectMake(downloadX, downloadY, downloadW, downloadH);
//        //downloadBtn.backgroundColor = [UIColor yellowColor];
//        //设置背景图片
//        [downloadBtn setBackgroundImage:[UIImage imageNamed:@"buttongreen"] forState:UIControlStateNormal];
//        [downloadBtn setBackgroundImage:[UIImage imageNamed:@"buttongreen_highlighted"] forState:UIControlStateHighlighted];
//        //设置字体第一种方法
//        [downloadBtn setTitle:@"下载" forState:UIControlStateNormal];
//        
//        //设置字体第二种方法(不推荐使用)
//        downloadBtn.titleLabel.text = @"下载";
//        
//        //设置字体大小
//        downloadBtn.titleLabel.font = [UIFont systemFontOfSize:15];
//        [appView addSubview:downloadBtn];
//        
//        
//        [downloadBtn addTarget:self action:@selector(btnOnClick:) forControlEvents:UIControlEventTouchUpInside];
    }
    
 
    
    
    
}
/*吃唐僧肉的小悟空-转载请注明出处http://www.cnblogs.com/hukezhu/*/
/**
 *  按钮的点击方法
 *
 *  @param btn 将按钮本身传入方法中,哪个按钮被点击就调用这个方法
 */
- (void)btnOnClick:(UIButton *)btn{

    //NSLog(@"------%@",btn);
    btn.enabled = NO;
    [btn setTitle:@"已下载" forState:UIControlStateNormal];
    
    CGFloat labelW = 120;
    CGFloat labelH = 30;
    CGFloat labelX = (self.view.frame.size.width - labelW)* 0.5;
    CGFloat labelY = (self.view.frame.size.height - labelH)*0.5;
    UILabel *label = [[UILabel alloc]init];
    label.frame = CGRectMake(labelX, labelY, labelW, labelH);
    label.text = @"正在下载";
    //设置字体颜色
    label.textColor = [UIColor redColor];
    //设置字体居中
    label.textAlignment = NSTextAlignmentCenter;
    //设置 背景色
    label.backgroundColor = [UIColor blackColor];
    
    //设置圆角的半径
    label.layer.cornerRadius = 8;
    //将多余的部分减掉
    label.layer.masksToBounds = YES;
    //设置透明度
    label.alpha = 0.0;
    //将label添加到view中
    [self.view addSubview:label];
    //使用block动画,动画持续时间2秒
    [UIView animateWithDuration:2.0 animations:^{
        label.alpha = 0.5;
    } completion:^(BOOL finished) {
        if (finished) {
            [UIView animateWithDuration:2.0 delay:0.1 options:UIViewAnimationOptionCurveLinear animations:^{
                label.alpha = 0.0;
            } completion:^(BOOL finished) {
                //上面将透明度设置为0,界面上已经不显示这个label,但是它仍然在内存中,所以为了节约内存,仍要将其从内存中删除
                [label removeFromSuperview];
                
            }];
        }
    }];
    
}
/**
 *  "懒加载",加载应用数据
 *
 */
- (NSArray *)apps{

    //如果_apps为空,才加载数据
    if (_apps == nil) {
        //获取plist的全路径
        NSString *path = [[NSBundle mainBundle]pathForResource:@"app.plist" ofType:nil];

        //加载数组
        NSArray *dictArray = [NSArray arrayWithContentsOfFile:path];
        
        //创建一个可变数组,来动态接收模型对象
        NSMutableArray *array = [NSMutableArray array];
        
        //通过循环,将字典数组的字典取出,转成模型对象
        for (NSDictionary *dict in dictArray) {
            KZAppModel *appModel = [KZAppModel appWithModelDict:dict];
            [array addObject:appModel];
        }
        _apps = array;
    }
    return _apps;
    /*吃唐僧肉的小悟空-转载请注明出处http://www.cnblogs.com/hukezhu/*/
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

　　

　　xib文件加载的两种方式:

　　

//方法1:
NSArray *objs = [[NSBundle mainBundle] loadNibNamed:@"KZAppView" owner:nil options:nil];
//这个方法会创建xib中的所有对象，并且将对象按顺序放到objs数组中


//方法2
//bundle参数可以为nil，默认就是main bundle
UINib *nib = [UINib nibWithNibName:@"KZAppView" bundle:[NSBundle mainBundle]];
NSArray *objs = [nib instantiateWithOwner:nil options:nil];

　　获取xib中的控件有两种方式:

　　　　1.通过绑定tag来实现

　　　　2.利用subviews[index];的特性实现

　　　　注意:两种方式都需要强制类型转换

　　总结:分析本文中的实现代码,在控制器中使用了xib进行赋值,当然在这里只有一个控制器,假设开发过程中有多个控制器,每个控制器都要使用这个xib,那么每个控制器都要使用这些赋值语句在各自的控制器中实现,假设以后要增加控件或者修改,则需要在每个控制器中都要修改,不利于扩展,所以我们考虑将xib进行封装,使用xib时直接调用即可,假设有修改时,直接修改xib封装的文件,对于调用者没有影响.如下图:

　　

　　所以,下篇文章再次进行改进,将xib进行封装.