iOS开发 - Xib 九宫格应用管理

Xib 九宫格应用管理

使用xib封装一个自定义view的步骤

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

#import "ViewController.h"
#import "MyApp.h"
#import "MyAppView.h"

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

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //添加应用信息
    //0.总列数（一行最多三列）
    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
        MyAppView *appView = [MyAppView 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);
    }
}


- (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.创建模型对象
            MyApp* app=[MyApp appWithDict:dict];

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

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

#import <UIKit/UIKit.h>
@class MyApp;
@interface MyAppView  : UIView
/**
 *  数据模型
 */
@property(nonatomic,strong)MyApp* app;

+(instancetype)appView;

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

#import "MyAppView.h"
#import "MyApp.h"



@interface MyAppView ()
@property (weak, nonatomic) IBOutlet UIImageView *iconView;
@property (weak, nonatomic) IBOutlet UILabel *nameLabel;

@end



@implementation MyAppView

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

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

- (void)setApp:(MyApp *)app
{
    _app=app;
    //1.设置图标
    self.iconView.image=[UIImage imageNamed:app.icon];
    //2.设置名称
    self.nameLabel.text=app.name;
}
@end

Xib

Model

@interface MyApp : NSObject

/**
 *  名称
 */
@property(nonatomic,copy)NSString* name;

/**
 *  图标
 */
@property(nonatomic,copy)NSString* icon;

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

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


@end

@implementation MyApp
- (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

实例图