[iOS基础控件 - 4.1] APP列表

需求

1.以N宫格的形式展示应用信息

2.APP信息包括图标、名字、下载按钮

3.使用尽可能少的代码，从plist读取app信息，计算每个app图标的位置尺寸信息

 

 

A.思路

1.UI布局：N宫格

2.事件监听

3.动态添加 (by plist)

4.整体封装，组合每个应用信息，使用View的层级包装帮助布局

 

B.实现 (使用纯代码方式)

 

  1 //
  2 //  ViewController.m
  3 //  01-应用管理
  4 //
  5 //  Created by hellovoidworld on 14/11/24.
  6 //  Copyright (c) 2014年 hellovoidworld. All rights reserved.
  7 //
  8
  9 #import "ViewController.h"
 10
 11 #define APP_WIDTH 85
 12 #define APP_HEIGHT 90
 13 #define MARGIN_HEAD 20
 14 #define ICON_WIDTH 50
 15 #define ICON_HEIGHT 50
 16 #define NAME_WIDTH APP_WIDTH
 17 #define NAME_HEIGHT 20
 18 #define DOWNLOAD_WIDTH (APP_WIDTH - 20)
 19 #define DOWNLOAD_HEIGHT 20
 20
 21 @interface ViewController ()
 22
 23 /** 存放应用信息 */
 24 @property(nonatomic, strong) NSArray *apps; // 应用列表
 25
 26 @end
 27
 28 @implementation ViewController
 29
 30 - (void)viewDidLoad {
 31     [super viewDidLoad];
 32     // Do any additional setup after loading the view, typically from a nib.
 33
 34     [self loadApps];
 35 }
 36
 37 - (void)didReceiveMemoryWarning {
 38     [super didReceiveMemoryWarning];
 39     // Dispose of any resources that can be recreated.
 40 }
 41
 42 #pragma mark 取得应用列表
 43 - (NSArray *) apps {
 44     if (nil == _apps) {
 45         NSString *path = [[NSBundle mainBundle] pathForResource:@"app.plist" ofType:nil];
 46         _apps = [NSArray arrayWithContentsOfFile:path];
 47     }
 48
 49     return _apps;
 50 }
 51
 52 #pragma mark 加载全部应用列表
 53 - (void) loadApps {
 54     int appColumnCount = [self appColumnCount];
 55     int appRowCount = [self appRowCount];
 56
 57     CGFloat marginX = (self.view.frame.size.width - APP_WIDTH * appColumnCount) / (appColumnCount + 1);
 58     CGFloat marginY = (self.view.frame.size.height - APP_HEIGHT * appRowCount) / (appRowCount + 1) + MARGIN_HEAD;
 59
 60     int column = 0;
 61     int row = 0;
 62     for (int index=0; index<self.apps.count; index++) {
 63         NSDictionary *appData = self.apps[index];
 64
 65         // 每个app信息
 66         UIView *appView = [[UIView alloc] init];
 67
 68         CGFloat appX = marginX + column * (marginX + APP_WIDTH);
 69         CGFloat appY = marginY + row * (marginY + APP_HEIGHT);
 70
 71         appView.frame = CGRectMake(appX, appY, APP_WIDTH, APP_HEIGHT);
 72
 73         // 1.设置APP图片
 74         UIImageView *iconView = [[UIImageView alloc] init];
 75
 76         CGFloat iconMarginX = (appView.frame.size.width - ICON_WIDTH) / 2;
 77         CGFloat iconMarginY = 0;
 78         iconView.frame = CGRectMake(iconMarginX, iconMarginY, ICON_WIDTH, ICON_HEIGHT);
 79
 80         iconView.image = [UIImage imageNamed:appData[@"icon"]];
 81         [appView addSubview:iconView];
 82
 83         // 2.设置APP名字
 84         UILabel  *nameLabel = [[UILabel alloc] init];
 85         nameLabel.text = appData[@"name"];
 86         CGFloat nameMarginX = (appView.frame.size.width - NAME_WIDTH) / 2;
 87         CGFloat nameMarginY = iconMarginY + ICON_HEIGHT;
 88         nameLabel.frame = CGRectMake(nameMarginX, nameMarginY, NAME_WIDTH, NAME_HEIGHT);
 89         [nameLabel setFont:[UIFont systemFontOfSize:16]];
 90         [nameLabel setTextAlignment:NSTextAlignmentCenter];
 91         [appView addSubview:nameLabel];
 92
 93         // 3.设置下载按钮
 94         UIButton *downloadButton = [UIButton buttonWithType:UIButtonTypeCustom];
 95         CGFloat downloadMarginX = (appView.frame.size.width - DOWNLOAD_WIDTH) / 2;
 96         CGFloat downloadMarginY = nameMarginY + NAME_HEIGHT;
 97         downloadButton.frame = CGRectMake(downloadMarginX, downloadMarginY, DOWNLOAD_WIDTH, DOWNLOAD_HEIGHT);
 98
 99         UIImage *downloadNormalImage = [UIImage imageNamed:@"buttongreen"];
100         [downloadButton setBackgroundImage:downloadNormalImage forState:UIControlStateNormal];
101
102         UIImage *downloadHighlightedImage = [UIImage imageNamed:@"buttongreen_highlighted"];
103         [downloadButton setBackgroundImage:downloadHighlightedImage forState:UIControlStateHighlighted];
104
105         [downloadButton setTitle:@"下载" forState:UIControlStateNormal];
106
107         // 不要直接取出titleLabel属性进行操作，因为这样就不能为全部状态进行设置
108         [downloadButton.titleLabel setFont:[UIFont systemFontOfSize:13]];
109
110         [appView addSubview:downloadButton];
111
112
113         [self.view addSubview:appView];
114
115         column++;
116         if (column == appColumnCount) {
117             column = 0;
118             row++;
119         }
120     }
121 }
122
123 #pragma mark 计算列数
124 - (int) appColumnCount {
125     int count = 0;
126     count = self.view.frame.size.width / APP_WIDTH;
127
128     if ((int)self.view.frame.size.width % (int)APP_WIDTH == 0) {
129         count--;
130     }
131
132     return count;
133 }
134
135 #pragma mark 计算行数
136 - (int) appRowCount {
137     int count = 0;
138     count = (self.view.frame.size.height - MARGIN_HEAD) / APP_HEIGHT;
139
140     if ((int)(self.view.frame.size.height - MARGIN_HEAD) % (int)APP_HEIGHT == 0) {
141         count--;
142     }
143
144     return count;
145 }
146 @end

#1. 放入了Images.xcassets中的文件只能通过[UIImage imageNamed:(NSString *) imageName] 访问吗?