前言
上一篇文章MyDaily 開發(fā)過程1 -- UIScrollView中介紹了有關(guān)UIScrollView的使用方法穴豫。但是一個(gè)App里只有文字沒有圖片怎么能行呢?尤其是作為一個(gè)高(da)富(diao)帥(si)程序猿,有圖片沒有美女簡(jiǎn)直是不能原諒的錯(cuò)誤呀浑测。于是在這個(gè)看臉的世界芥颈,我在App里滿足了自己的愿望。啥也不說了先上圖角钩!
聽說美女鎮(zhèn)樓你們都會(huì)點(diǎn)贊(滿滿的都是套路)吝沫!
然而這和今天要說的UICollectionView有什么關(guān)系嗎?別著急彤断,一個(gè)美女怎么夠野舶?因此....
美女當(dāng)然是越多越好,所以UICollectionView在這里就派上了用場(chǎng)宰衙。
讓我們看看動(dòng)圖的效果吧平道!
好了下面就讓我們認(rèn)識(shí)一下UICollectionView吧!
正文
一供炼,UICollectionView簡(jiǎn)介
The UICollectionView class manages an ordered collection of data items and presents them using customizable layouts. Collection views provide the same general function as table views except that a collection view is able to support more than just single-column layouts. Collection views support customizable layouts that can be used to implement multi-column grids, tiled layouts, circular layouts, and many more. You can even change the layout of a collection view dynamically if you want.
從這段Apple官方給出的定義我們可以知道以下幾點(diǎn)內(nèi)容
- UICollectionView 是用來管理和顯示一系列有序數(shù)據(jù)的一屋。
- UICollectionView和UITableView具有很多相同的功能,但是UICollectionView可以顯示多列布局袋哼。
- UICollectionView支持自定義布局冀墨,因此你可以使用能它顯示多列網(wǎng)格,平鋪布局涛贯,環(huán)形布局....
- 你可以動(dòng)態(tài)的改變UICollectionView的布局如果你閑著沒事做诽嘉。
從上面幾點(diǎn)我看出來了一點(diǎn),UICollectionView很牛X!
所以UICollectionView要怎么使用呢?
二,UICollectionView基本元素介紹
從這兩張圖中大家可以看到虫腋,在顯示的頁面當(dāng)中有三個(gè)元素是我們需要知道的骄酗。
- Cells
- Supplementary Views
- Decoration Views
個(gè)人理解Cells是用來顯示你想要展示的數(shù)據(jù)的,也就是說無論是圖片悦冀,文字或者其他的數(shù)據(jù)趋翻,你都可以用Cells來展示。
Supplementary Views就如同它的名字一樣盒蟆,補(bǔ)充視圖踏烙。你可以使用它來展示你想要補(bǔ)充說明的信息,比如不同Section的名字历等。
Decoration Views讨惩,我認(rèn)為這就是一個(gè)背景裝飾視圖。
三募闲,如何創(chuàng)建UICollectionView
1, 我們要遵循一些UICollectionView的協(xié)議
- UICollectionViewDelegate
- UICollectionViewDataSource
看著是不是很眼熟步脓,其實(shí)這兩個(gè)協(xié)議中的方法也和UITableVeiw中的方法差不多。
2, 開始創(chuàng)建UICollectionView對(duì)象
- initWithFrame:collectionViewLayout:
在這里我要解釋一下layOut對(duì)象浩螺,我們想要?jiǎng)?chuàng)建UICollectionView對(duì)象就必須要告訴collectionView以什么方式布局靴患,因此layOut對(duì)象就如同一個(gè)布局文件,告訴collectionView應(yīng)該如何放置Cells要出。
3鸳君,創(chuàng)建Cells和Supplementary View
- registerClass:forCellWithReuseIdentifier:
使用代碼創(chuàng)建Cell - registerNib:forCellWithReuseIdentifier:
使用Nib創(chuàng)建Cell - registerClass:forSupplementaryViewOfKind:withReuseIdentifier:
使用代碼創(chuàng)建Supplementary View - registerNib:forSupplementaryViewOfKind:withReuseIdentifier:
使用Nib創(chuàng)建Supplementary Viw - dequeueReusableCellWithReuseIdentifier:forIndexPath:
返回一個(gè)重復(fù)使用的Cell對(duì)象 - dequeueReusableSupplementaryViewOfKind:withReuseIdentifier:forIndexPath:
返回一個(gè)重復(fù)使用的Supplementary View對(duì)象
4,實(shí)現(xiàn)協(xié)議中的方法
協(xié)議中的方法比較多,根據(jù)自己的需要進(jìn)行實(shí)現(xiàn)患蹂,要說明的是UICollectionViewDataSource中的這幾個(gè)方法是必須要實(shí)現(xiàn)的
- collectionView:numberOfItemsInSection:
設(shè)置每個(gè)Section中的Cell數(shù)量 - collectionView:cellForItemAtIndexPath:
為每個(gè)Cell設(shè)置要顯示的數(shù)據(jù)
最后千萬不要忘記這幾行代碼
collectionView.dataSource = self;
collectionView.delegate = self;
設(shè)置好要實(shí)現(xiàn)協(xié)議的代理之后或颊,一定要記住在數(shù)據(jù)獲取完畢后使用
[collectionView reloadData] 來刷新Cell
結(jié)語
在這里我就不貼出自己的代碼了,因?yàn)槲蚁肴绻鞘褂眠^UITableVeiw的同學(xué)看到以上的解釋應(yīng)該很快就能夠使用UICollectionView传于。個(gè)人認(rèn)為要想很好的使用UICollectionVeiw關(guān)鍵還是要能夠創(chuàng)造自定義布局囱挑。如果大家對(duì)于我展示的布局比較感興趣可以猛戳這里。你可以下載MyDaily這個(gè)項(xiàng)目的所有代碼沼溜。我還會(huì)不斷更新這個(gè)項(xiàng)目平挑,加入一些新的功能。最后如果你覺得篇文章對(duì)你有一分錢的幫助的話請(qǐng)給我點(diǎn)個(gè)贊系草,謝謝大家通熄!