1.分析界面由哪些控件組成?
界面有兩行,可以用tableView的靜態(tài)cell來搭建
注意:靜態(tài)cell只能通過storyBoard來加載.xib不可以
下面還有一個(gè)九宮格樣式的view 我們可以用tableView的footView來搭建
view里面九宮格樣式的內(nèi)容我們可以用UICollectionView來搭建
UICollectionView作為tableView的footView
2.分析用什么方式搭建界面
因?yàn)榻缑媸枪潭ǖ? 我們可以是用xib 但是要用靜態(tài)cell 那么只能用storyBoard
3.怎么把storyBoard的界面顯示出來
3.1 第一種方法:首先要勾選 Is Initial View Controller (箭頭指向控制器)
加載storyBoard
UIStoryboard *storyboard = [UIStoryboard storyboardWithName:@"XTMeViewController" bundle:nil];
加載storyBoard中箭頭指向控制器
XTMeViewController *meVc = [storyboard instantiateInitialViewController];
3.2 第二種方法: 首先要給控制器綁定標(biāo)識(shí)
加載指定標(biāo)識(shí)的控制器.
UIViewController *vc = [storyBoard instantiateViewControllerWithIdentifier:@"VCStoryBoardID"];
4.UICollectionView的使用
UICollectionView使用步驟: 1.創(chuàng)建流水布局,初始化UICollectionView 2.設(shè)置數(shù)據(jù)源 3.cell必須注冊(cè)
4.自定義Cell
4.1 通過all init創(chuàng)建collectionView 發(fā)現(xiàn)顯示不了?
collectionView必須設(shè)置布局參數(shù)才能展示(流水布局,瀑布流)
默認(rèn)創(chuàng)建出來的collectionView是黑色的
// 創(chuàng)建流水布局
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
// 創(chuàng)建UICollectionView:黑色
UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, 0, 200) collectionViewLayout:layout];
4.2 collectionView怎么展示數(shù)據(jù)
collectionView要展示數(shù)據(jù)必須要有數(shù)據(jù)源(和tableView比較像)
4.3 collectionView每一個(gè)格子叫做cell(item)
4.4 collectionView的cell(Item)里面沒有默認(rèn)的子控件,我們使用cell需要自定義 通過xib描述
4.5 加載collectionView的cell 必須要通過注冊(cè)的方法加載 才能做緩存處理
只要使用了forIndexPath獲取緩存池中cell,必須通過注冊(cè)
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:ID forIndexPath:indexPath];
4.6 collectionView尺寸怎么設(shè)置?
去 UICollectionView頭文件去查找size 找不到
那么我們?nèi)ゲ季謪?shù)( UICollectionViewFlowLayout)頭文件里面查找 找到很多可以設(shè)置的屬性
layout.itemSize = CGSizeMake(itemWH, itemWH); 設(shè)置cell尺寸
layout.minimumLineSpacing = margin; 設(shè)置行間距
layout.minimumInteritemSpacing = margin; 設(shè)置列間距
注意:實(shí)際的列間距不一定就是我們?cè)O(shè)置的大小 它內(nèi)部會(huì)自動(dòng)根據(jù)每一行展示cell的個(gè)數(shù)來進(jìn)行調(diào)整
所以想要固定列間距 那么我們就要根據(jù)列間距來計(jì)算每個(gè)cell的寬度
4.7 怎么設(shè)置collectionView的分割線?
想要什么顏色的分割線 就給collectionView設(shè)置什么顏色的背景色 然后設(shè)置行間距和列間距 這樣就能看到分割線的效果
5.抽取方法
5.1 為什么要抽取方法
創(chuàng)建collectionView和設(shè)置布局參數(shù)代碼放在一起,閱讀性太差
5.2 怎么抽取
兩種抽取方式
5.2.1 常規(guī)方法抽取
1.先分析需要抽取幾個(gè)方法, 怎么分析?
先劃分模塊 設(shè)置同一個(gè)模塊的代碼抽取到一個(gè)方法里面
比如:設(shè)置布局參數(shù)抽取一個(gè)方法 創(chuàng)建collectionView抽取一個(gè)方法
2.先寫出一個(gè)沒有參數(shù)沒有返回值的方法名 - (void) xxxx;
3.把代碼拷貝進(jìn)方法里面
4.如果報(bào)錯(cuò)誤,那么我們就根據(jù)錯(cuò)誤補(bǔ)全參數(shù)或者返回值
優(yōu)點(diǎn):通俗易懂 各個(gè)階段的人都能看明白
缺點(diǎn):代碼太分散 不易閱讀和修改
5.2.2 大神抽取法(裝逼特技)
1.這種方法和逗號(hào)表達(dá)式的原理差不多,都是等于最后一個(gè)數(shù)據(jù)的值
2.一般用于封裝控件,能做到高內(nèi)聚
3.格式為: int i = ({
int a = 2;
int b = 3;
int c = 4;
i = a + b + c;
});
結(jié)果為 i = a + b + c = 9;
// 一般用于封裝控件
` // 思想:高聚合(代碼聚合) 低耦合
// 創(chuàng)建流水布局
UICollectionViewFlowLayout *layout = ({
layout = [[UICollectionViewFlowLayout alloc] init];
CGFloat margin = 1;
NSInteger cols = 4;
CGFloat itemWH = (XMGScreenW - (cols - 1) * margin) / cols;
layout.itemSize = CGSizeMake(itemWH, itemWH);
layout.minimumLineSpacing = margin;
layout.minimumInteritemSpacing = margin;
layout;
});
優(yōu)點(diǎn):高內(nèi)聚,閱讀性好 代碼容易修改
缺點(diǎn):一般只能用于封裝控件 需要積累一定的知識(shí)才能掌握
6.加載數(shù)據(jù)
6.1 查看接口文檔(基本url , 請(qǐng)求方式 , 請(qǐng)求參數(shù))
6.2 用AFN發(fā)送網(wǎng)絡(luò)請(qǐng)求
6.2.1創(chuàng)建請(qǐng)求會(huì)話管理者對(duì)象
6.2.2拼接請(qǐng)求參數(shù)
6.2.3發(fā)送請(qǐng)求
6.3 解析數(shù)據(jù)(寫成plist文件)
6.4 設(shè)計(jì)模型
6.5 字典轉(zhuǎn)模型
6.6 展示數(shù)據(jù) (如果是tableView 或 collectionView 需要刷新表格 reloadData)
6.6.1 在cell里面定義模型屬性來接收模型數(shù)據(jù)
6.6.2 拖線,獲取xib中的控件
6.6.3 重寫cell模型屬性的set方法
6.6.4 給需要接收數(shù)據(jù)的參數(shù)賦值