接上文，我們已經(jīng)成功地在本地跑起了一個rails服務端，并且正確返回了JSON的接口數(shù)據(jù)，可以說萬事俱備只欠客戶端了。
終于來到了主戰(zhàn)場，對我來說這是最繁瑣但也是最簡單的一步 :)
工程搭建
二話不說，老規(guī)矩祭出Xcode，新建工程，新建Podfile
platform :ios, '7.0'
pod 'Masonry'
pod 'BFKit'
pod 'ReactiveCocoa'
pod 'AFNetworking'
pod 'YYModel'
pod 'YYWebImage'
然后安裝pod install
界面布局
我們可以先完成簡單的頁面布局，由于目前的數(shù)據(jù)非常單一，所以也就簡單單頁面實現(xiàn)，以一個CollectionView作為主控件，每個評測一個cell。
新增ReviewListView繼承自UICollectionView，自定義UICollectionViewFlowLayout子類ReviewListViewLayout，然后用Masonry手寫布局。
ReviewListView *colview = [[ReviewListView alloc] init];
colview.delegate = self;
colview.dataSource = self;
[colview registerClass:[ReviewSummaryCell class] forCellWithReuseIdentifier:@"ReviewSummaryCell"];
_reviewListView = colview;
[self.view addSubview:_reviewListView];
[_reviewListView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view);
}];
接著實現(xiàn)UICollectionViewDataSource的代理方法，這個時候需要新建UICollectionViewCell的子類ReviewSummaryCell，然后手寫添加控件，完成基本布局。
自此，一個簡單的頁面搭建已經(jīng)完成，下面是數(shù)據(jù)請求的接入。
網(wǎng)絡層
網(wǎng)絡層是在基于AFNetworkKit的基礎(chǔ)上，連接數(shù)據(jù)請求模塊和ViewController的中間層，我稍微封裝了一下，詳細的代碼可以在文末的源碼連接查看。
大致步驟是新建一個ReviewApiEngine類，繼承自BaseApiEngine
網(wǎng)絡請求大致代碼如下：
/**
* 獲取評測列表
*/
+ (void)fetchFeatureListWithSuccessHandler:(ResponseBlock)completeBlock
errorHandler:(ErrorBlock)errorBlock
translater:(Class<DataTranslate>)translater{
[[APIManager shareManager] sendRequestFromMethod:APIMethodGet
path:API_ReviewList
params:nil
onComplete:Default_Handle
onError:errorBlock];
}
然后在controller只需要調(diào)用
- (void)fetchData{
useWeakSelf
[ReviewApiEngine fetchReviewListWithSuccessHandler:^(id responseResult) {
[weakSelf.reviewListView reloadData];
} errorHandler:^(NSError *error) {
} translater:[GameReview class]];
}
便可以輕松完成網(wǎng)絡數(shù)據(jù)請求的任務。
我們可以先寫測試或者在App生命周期中先調(diào)用網(wǎng)絡請求，確保能正確無誤地拿到數(shù)據(jù)。
一切準備就緒后，我們在ReviewSummaryCell中添加配置方法：
- (void)configWithIndexPath:(NSIndexPath *)indexPath model:(GameReview *)review{
[_thumbImageView setImageURL:[NSURL URLWithString:review.cover_image]];
_titleLabel.text = review.title;
_summaryLabel.text = review.summary;
_scoreView.score = review.score;
}
最終完成效果如圖：
尾聲
這個實踐對我來說是一次非常有意義的技術(shù)探索，擴展起來，我們可以發(fā)揮更多想象力做更多有趣以及有意義的事情，技術(shù)改變生活不應是一句口號，而應當是我們行動的信念。
好了，打完收工。
所有的源代碼放在這里。
→_→
系列鏈接
從零開始開發(fā)一個App（1）- Scrapy爬蟲
從零開始開發(fā)一個App（2）- 簡易REST API服務端
從零開始開發(fā)一個App（3）- iOS客戶端
