我是UICollectionView,我負責以一個一個格子的方式呈現資料。
我是UICollectionViewDataSource,我負責接受UICollectionView的資料委派工作,提供UICollectionView顯示用的資料。
第1步:建立一個名為"UICollectionView_UICollectionViewDataSource"的"Single View Application"專案。
第2步:加入CollectionView
第3步:建立UICollectionView的IBOutlet
- 加入UICollectionView的IBOutlet並取名為"collectionView"
第4步:調整樣板Cell,並加上UILabel
- 為UICollectionViewCell加上Identifier識別碼,以便後續取出時識別使用
- 加上UILabel以便顯示連絡人資訊,特別的是將Tag設為100,用以在後續依照此Tag將UILabel找出來,以將連絡人的資訊設定在其中
第5步:ViewController委派UICollectionViewDataSource的工作
- 於"ViewController.m"檔中,準備顯示的連絡人資料,宣告一個_contacts陣列變數,並於viewDidLoad方法中建立連絡人陣列,並存於_contacts陣列中
#import "ViewController.h"
@interface ViewController ()
{
//宣告一個存放連絡人的陣列變數,_contacts
NSArray * _contacts;
}
@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
//建立一個連絡人陣列物件,並存放於_contacts變數中
_contacts = [[NSArray alloc] initWithObjects:
@"Jack"
, @"Eric"
, @"Jason"
, @"Ray"
, @"Kevin"
, @"Jason"
, nil];
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
- 為"ViewController"加上"UICollectionViewDataSource" protocol協定,於UIViewController後方加上"<UICollectionViewDataSource>"
//實作UICollectionViewDataSource協定
@interface ViewController : UIViewController <UICollectionViewDataSource$gt;
@property (strong, nonatomic) IBOutlet UICollectionView *collectionView;
@end
- 於"ViewController.m"檔中實作"
collectionView:
numberOfItemsInSection:"方法,以回傳資料的格子數,在此回傳透過陣列回傳個數。
//UICollectionViewDataSource上的方法,
//用以表示有多少資料,
//在此回傳_contacts陣列的個數
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return [_contacts count];
}
- 於"ViewController.m"檔中實作 "collectionView:cellForItemAtIndexPath:"方法
- 透過dequeueReusableCellWithReuseIdentifier:訊息,向collectionView取得Identifier識別碼為"cell1"的cell樣板,此dequeueReusableCellWithReuseIdentifier:訊息可讓您重複使用同一個樣版,而不浪費重複建置樣板的資源
- 在cell樣板上透過viewTag:訊息找出Tag為100的UILabel,並將對應的連絡人資訊自_contacts陣列中取出,而後設定在UILabel上
- 透過setBackgroundColor:將cell的背景色設為藍色
- 最後透過return回傳cell
//UICollectionViewDataSource上的方法,
//回傳UICollectionView顯示每格資料用的UICollectionViewCell
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
//透過dequeueReusableCellWithReuseIdentifier:forIndexPath:訊息,
//將預先設計的cell樣本拿出來使用,
//其Identifier為cell1的樣本
UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell1" forIndexPath:indexPath];
//透過viewWithTag:訊息,
//找出Tag為100的view,
//此100的view即是在cell樣本上的Label,
//並自_contacts陣列取出對應位置的連絡人姓名,
//設定為label上的文字
UILabel * label = (UILabel*)[cell viewWithTag:100];
[label setText:[_contacts objectAtIndex:[indexPath row]]];
//設cell的背景色為blue
[cell setBackgroundColor:[UIColor blueColor]];
//回傳cell
return cell;
}
第6步:設定UICollectionView的dataSource委派
- 將實作"UICollectionViewDataSource"的ViewController(self),指派至UICollectionView的dataSource屬性中,好將UICollectionView取得資料的工作委派給ViewController(self)物件。當然,UICollectionView則會以"UICollectionViewDataSource"protocol協定向ViewController物件要資料。
- (void)viewDidLoad
{
[super viewDidLoad];
//建立一個連絡人陣列物件,並存放於_contacts變數中
_contacts = [[NSArray alloc] initWithObjects:
@"Jack"
, @"Eric"
, @"Jason"
, @"Ray"
, @"Kevin"
, @"Jason"
, nil];
//將實作UICollectionViewDataSource的ViewController(self),
//指派給UICollectionView的dataSource屬性中,
//好將UICollectionView取得資料的工作,
//委派給ViewController(self)物件。
self.collectionView.dataSource = self;
}
第7步:執行
- 這時畫面上會出現6格資料,這即是UICollectionView可以以格子列表的方式顯示資料,當然它會與UICollectionViewDataSource協定合作,透過實作UICollectionViewDataSource的物件(在此為ViewController)提供UICollectionView資料
更多的UICollectionView資訊: