大概如下图示：九个应用图标的样子
功能分析
(1)以九宫格的形式展示应用信息
(2)点击下载按钮后，做出相应的操作
步骤分析
(1)加载应用信息
(2)根据应用的个数创建对应的view
(3)监听下载按钮点击
思路整理
要在支持文件夹里，放入 plist 文件，且拖拽素材到 supporting files，注意勾选的项目的区别：
大多数情况，往项目中拖拽素材时，通常选择 Destination， Folders:选择第一项：创建组，这样 xcode 导航显式的是黄色文件夹，要知道，Xcode中资源素材是分文件夹存放的，但是在Bundle中所有素材所在，都在同一个文件夹下，这样勾选的开发效率很高，但是，不能出现文件重名的情况，会让美工不舒服。特点：可以直接使用[NSBundle mainBundle]作为资源路径，效率高！可以使用[UIImage imageNamed:]加载图像
如果选择第二项， 创建文件家的引用：xcode显得是蓝色文件夹，此时资源在Xcode中分文件夹，在Bundle中也分文件夹，因此，可以出现文件重名的情况，特点：需要在[NSBundle mainBundle]的基础上拼接实际的路径，效率较差！不能使用[UIImage imageNamed:]加载图像
app加载流程
1> app 从mainBundle中加载Plist
2> 按照plist中的数据数量先确定各个View的大小和位置
3>不过，类似这样的很多图标，控件很多的 UI 设计，建议不使用故事板，而是使用代码创建，否则后期维护也麻烦。
九宫格布局的计算方法
方法很多，不必死记硬背，要理解，不伦做什么，都是思想为主。九宫格的关键是要能够顺利计算出每一个小格子准确的坐标，建议：
1> 先创建若干小的视图
2> 找到自己理解比较容易的计算方法
3> 编写循环创建九宫格布局
要求：能够公用的常量尽量给抽取出来，以便增加九宫格布局的灵活性，尽量保证做到：根据要显示的数据自动调整小格子的位置和数量，一旦调整了要显示的列数，仅需要修改少量的数值即可做到
1#import"ViewController.h"23@interfaceViewController()4@PRoperty (nonatomic, strong) NSArray *appList;5@end67@implementationViewController89- (NSArray *)appList10{11if(!_appList) {12//1. 从mainBundle加载13NSBundle *bundle =[NSBundle mainBundle];14NSString *path = [bundle pathForResource:@"app.plist"ofType:nil];15_appList =[NSArray arrayWithContentsOfFile:path];1617NSLog(@"%@", _appList);18}19return_appList;20}2122- (void)viewDidLoad23{24[super viewDidLoad];25//九宫格总共有3列26inttotalCol =3;27//每一个格子的宽度28CGFloat viewW =80;29//每一个格子的高度30CGFloat viewH =90;31//横向间距的设定，把整个屏幕视图的宽度减去三个格子的宽度，剩下的宽度平均分为四份32CGFloat marginX = (self.view.bounds.size.width - totalCol * viewW) / (totalCol +1);33//纵向间距的设定34CGFloat marginY =10;35//第一行方格的纵向坐标的开始位置36CGFloat startY =20;37//self.appList.count一共需要绘制的方格的总数38for(inti =0; i < self.appList.count; i++) {39//行数 = 340//i = 0, 1, 2 / 3 = 041//i = 3, 4, 5 / 3 = 142introw = i /totalCol;43//列数 = 344//i = 0, 3, 6 % col 045//i = 1, 4, 7 % col 146//i = 2, 5, 8 % col 247intcol = i %totalCol;48//设置方格的绝对坐标49CGFloat x = marginX + (viewW + marginX) *col;50CGFloat y = startY + marginY + (viewH + marginY) *row;51//绘制方格52UIView *appView =[[UIView alloc] initWithFrame:CGRectMake(x, y, viewW, viewH)];53//把视图控件添加到 appView54[self.view addSubview:appView];5556//创建appView内部的细节57//读取数组中的字典58NSDictionary *dict =self.appList[i];5960//UIImageView61UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0, viewW,50)];62imageView.image = [UIImage imageNamed:dict[@"icon"]];63//按照比例显示图像64imageView.contentMode =UIViewContentModeScaleaspectFit;6566[appView addSubview:imageView];6768//UILabel69UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, imageView.bounds.size.height, viewW,20)];70//设置文字71label.text = dict[@"name"];72label.font = [UIFont systemFontOfSize:12.0];73label.textAlignment =NSTextAlignmentCenter;7475[appView addSubview:label];7677//UIButton78//UIButtonTypeCustom和[[UIButton alloc] init]是等价的79UIButton *button =[UIButton buttonWithType:UIButtonTypeCustom];80button.frame = CGRectMake(15,70, viewW -30,20);8182[button setTitle:@"下载"forState:UIControlStateNormal];83//不能使用如下代码直接设置title84//button.titleLabel.text = @"下载";85//@property中readonly表示不允许修改对象的指针地址，但是可以修改对象的属性86button.titleLabel.font= [UIFont systemFontOfSize:14.0];8788[button setBackgroundImage:[UIImage imageNamed:@"buttongreen"] forState:UIControlStateNormal];89[button setBackgroundImage:[UIImage imageNamed:@"buttongreen_highlighted"] forState:UIControlStateHighlighted];9091[appView addSubview:button];9293}94}
关于UIButton的一些补充
按钮的类型，在iOS的控件中，只有UIButton提供了类方法，可以在实例化按钮时指定按钮的不同类型。
UIButtonTypeCustom和[[UIButton alloc] init]是等价的
修改按钮字体
在UIButton中定义有两个readonly的属性：
1> titleLabel
2> imageView
@property中readonly表示不允许修改这两个属性的指针地址，但是可以修改其属性
注意：由于按钮的字体大小是所有状态共用的，因此可以通过
button.titleLabel.font= [UIFont systemFontOfSize:14.0];
修改按钮标签文本的字体大小，但是不能使用以下代码设置按钮标签的文本内容
button.titleLabel.text =@"下载";
因为按钮标签的文本内容是跟按钮的状态向关的
首尾式动画
如果只是修改控件的属性，使用首尾式动画还是比较方便的，但是如果需要在动画完成后做后续处理，就不是那么方便了
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];//修改属性的动画代码//......[UIView commitAnimations];
块动画
块动画相对来说比较灵活，尤为重要的是能够将动画相关的代码编写在一起，便于代码的阅读和理解
[UIView animateWithDuration:2.0animations:^{//修改控件属性动画label.alpha=0.0;
} completion:^(BOOL finished) {//删除控件[label removeFromSuperview];
}];
字典转模型的好处：
1> 降低代码的耦合度
2> 所有字典转模型部分的代码统一集中在一处处理，降低代码出错的几率
3> 在程序中直接使用模型的属性操作，提高编码效率
模型应该提供一个可以传入字典参数的构造方法
- (instancetype)initWithDict:(NSDictionary *)dict;+ (instancetype)xxxWithDict:(NSDictionary *)dict;
instancetype& id
1>instancetype在类型表示上，跟id一样，可以表示任何对象类型
2>instancetype只能用在返回值类型上，不能像id一样用在参数类型上
3>instancetype比id多一个好处：编译器会检测instancetype的真实类型
在模型中添加readonly属性
//定义属性时，会生成getter&setter方法，还会生成一个带下划线的成员变量//而如果是readonly属性，则只会生成getter方法，同时没有成员变量@property (nonatomic, strong,readonly) UIImage *image;@interfaceAppInfo()
{
UIImage*_imageABC;
}
- (UIImage *)image
{if(!_imageABC) {
_imageABC=[UIImage imageNamed:self.icon];
}return_imageABC;
}
在模型中合理地使用只读属性，可以进一步降低代码的耦合度。使用数据模型的好处：调用方不用关心模型内部的任何处理细节！
1#import"ViewController.h"2#import"AppInfo.h"34@interfaceViewController ()5@property (nonatomic, strong) NSArray *appList;6@end78@implementationViewController9//字典转模型10- (NSArray *)appList11{12if(!_appList) {13//1. 从mainBundle加载14NSBundle *bundle =[NSBundle mainBundle];15NSString *path = [bundle pathForResource:@"app.plist"ofType:nil];16//_appList = [NSArray arrayWithContentsOfFile:path];1718NSArray *array =[NSArray arrayWithContentsOfFile:path];19//将数组转换成模型，意味着self.appList中存储的是AppInfo对象20//1. 遍历数组，将数组中的字典依次转换成AppInfo对象，添加到一个临时数组21//2. self.appList = 临时数组22NSMutableArray *arrayM =[NSMutableArray array];2324for(NSDictionary *dictinarray) {25[arrayM addObject:[AppInfo appInfoWithDict:dict]];26}2728_appList =arrayM;29}30return_appList;31}3233- (void)viewDidLoad34{35[super viewDidLoad];3637//总共有3列38inttotalCol =3;39CGFloat viewW =80;40CGFloat viewH =90;4142CGFloat marginX = (self.view.bounds.size.width - totalCol * viewW) / (totalCol +1);43CGFloat marginY =10;44CGFloat startY =20;4546for(inti =0; i < self.appList.count; i++) {47//行数48//i = 0, 1, 2 / 3 = 049//i = 3, 4, 5 / 3 = 150introw = i /totalCol;51//列数52//i = 0, 3, 6 col 053//i = 1, 4, 7 col 154//i = 2, 5, 8 col 255intcol = i %totalCol;5657CGFloat x = marginX + (viewW + marginX) *col;58CGFloat y = startY + marginY + (viewH + marginY) *row;5960UIView *appView =[[UIView alloc] initWithFrame:CGRectMake(x, y, viewW, viewH)];6162[self.view addSubview:appView];6364//创建appView内部的细节65//读取数组中的AppInfo66//NSDictionary *dict = self.appList[i];67AppInfo *appInfo =self.appList[i];6869//UIImageView70UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0, viewW,50)];71imageView.image =appInfo.image;72//按照比例显示图像73imageView.contentMode =UIViewContentModeScaleAspectFit;7475[appView addSubview:imageView];7677//UILabel78UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, imageView.bounds.size.height, viewW,20)];79//设置文字80label.text =appInfo.name;81label.font = [UIFont systemFontOfSize:12.0];82label.textAlignment =NSTextAlignmentCenter;8384[appView addSubview:label];8586//UIButton87//UIButtonTypeCustom和[[UIButton alloc] init]是等价的88UIButton *button =[UIButton buttonWithType:UIButtonTypeCustom];89button.frame = CGRectMake(15,70, viewW -30,20);9091[button setTitle:@"下载"forState:UIControlStateNormal];92//不能使用如下代码直接设置title93//button.titleLabel.text = @"下载";94//@property中readonly表示不允许修改对象的指针地址，但是可以修改对象的属性95button.titleLabel.font= [UIFont systemFontOfSize:14.0];9697[button setBackgroundImage:[UIImage imageNamed:@"buttongreen"] forState:UIControlStateNormal];98[button setBackgroundImage:[UIImage imageNamed:@"buttongreen_highlighted"] forState:UIControlStateHighlighted];99100[appView addSubview:button];101button.tag =i;102103[button addTarget:self action:@selector(downloadClick:) forControlEvents:UIControlEventTouchUpInside];104}105}106107- (void)downloadClick:(UIButton *)button108{109NSLog(@"%d", button.tag);110//实例化一个UILabel显示在视图上，提示用户下载完成111UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(80,400,160,40)];112label.textAlignment =NSTextAlignmentCenter;113label.backgroundColor =[UIColor lightGrayColor];114115LFAppInfo *appInfo =self.appList[button.tag];116label.text = [NSString stringWithFormat:@"下载%@完成", appInfo.name];117label.font = [UIFont systemFontOfSize:13.0];118label.alpha =1.0;119[self.view addSubview:label];120121//动画效果122//动画效果完成之后，将Label从视图中删除123//首尾式动画，只能做动画，要处理完成后的操作不方便124//[UIView beginAnimations:nil context:nil];125//[UIView setAnimationDuration:1.0];126//label.alpha = 1.0;127//[UIView commitAnimations];128129//block动画比首尾式动画简单，而且能够控制动画结束后的操作130//在iOS中，基本都使用首尾式动画131[UIView animateWithDuration:2.0animations:^{132label.alpha =0.0;133} completion:^(BOOL finished) {134//删除label135[label removeFromSuperview];136}];137}138139@end
模型
#import<Foundation/Foundation.h>@interfaceAppInfo : NSObject//应用程序名称@property (nonatomic, copy) NSString *name;//应用程序图标名称@property (nonatomic, copy) NSString *icon;//图像//定义属性时，会生成getter&setter方法，还会生成一个带下划线的成员变量//如果是readonly属性，只会生成getter方法，同时没有成员变量@property (nonatomic, strong,readonly) UIImage *image;//instancetype会让编译器检查实例化对象的准确类型//instancetype只能用于返回类型，不能当做参数使用- (instancetype)initWithDict:(NSDictionary *)dict;/** 工厂方法*/+ (instancetype)appInfoWithDict:(NSDictionary *)dict;@end
m 文件
#import"AppInfo.h"@interfaceAppInfo()
{
UIImage*_imageABC;
}@end@implementationAppInfo- (instancetype)initWithDict:(NSDictionary *)dict
{
self=[super init];if(self) {
self.name= dict[@"name"];
self.icon= dict[@"icon"];
}returnself;
}+ (instancetype)appInfoWithDict:(NSDictionary *)dict
{return[[self alloc] initWithDict:dict];
}- (UIImage *)image
{if(!_imageABC) {
_imageABC=[UIImage imageNamed:self.icon];
}return_imageABC;
}@end
XIB:Xib文件可以用来描述某一块局部的UI界面
XIB & Storyboard
相同点：
1> 都用来描述软件界面
2> 都用Interface Builder工具来编辑
不同点
1> Xib是轻量级的，用来描述局部的UI界面
2> Storyboard是重量级的，用来描述整个软件的多个界面，并且能展示多个界面之间的跳转关系
7. View的封装思路
1> 如果一个view内部的子控件比较多，一般会考虑自定义一个view，把它内部子控件的创建屏蔽起来，不让外界关心
2> 外界可以传入对应的模型数据给view，view拿到模型数据后给内部的子控件设置对应的数据