UICollectionView?組件和?UITableView?組件一樣邮利,也是可以設(shè)置多個(gè)?section(分區(qū)缕题、分組)淤毛。每個(gè)?section?我們可以設(shè)置不同的?header?和?footer,同時(shí)每個(gè)分區(qū)內(nèi)還可以顯示不同數(shù)量和內(nèi)容的單元格察皇。
雖然我們也可以在?tableViewCell?中嵌入?collectionView?來實(shí)現(xiàn)同樣的效果不傅,但會(huì)更加麻煩些欺旧,特別是如果每個(gè)?collectionView?內(nèi)單元格數(shù)量不同,collectionView?還要實(shí)現(xiàn)動(dòng)態(tài)高度蛤签。
所以如果能滿足需求的話辞友,還是建議使用多?section?的?collectionView?來實(shí)現(xiàn)。
1震肮,效果圖
(1)collectView?的每一個(gè)分區(qū)對(duì)應(yīng)一個(gè)月份的圖書列表称龙。
(2)分區(qū)頭顯示月份標(biāo)題。分區(qū)尾背景設(shè)為灰色戳晌,內(nèi)容為空鲫尊。
(3)分區(qū)內(nèi)單元格顯示當(dāng)月所有書籍封面圖片,數(shù)量不定沦偎,分區(qū)高度自適應(yīng)疫向。
2,實(shí)現(xiàn)步驟
(1)打開?StoryBoard豪嚎,刪除默認(rèn)的?View Controller搔驼。拖入一個(gè)?Collection View Controller,并將其設(shè)置為初始?VC侈询。
(2)選中這個(gè)?Scene舌涨,點(diǎn)擊菜單“Editor”->“Embed In”->“Navigation Controller”添加一個(gè)導(dǎo)航控制器。
(3)選中?Collection View扔字,在其屬性面板中保持?Layout?屬性為?Flow?不變囊嘉。勾選上“Section Header”和“Section Footer”,分別增加分區(qū)頭和分區(qū)尾革为。
(4)調(diào)整好頭部的尺寸扭粱,并將其?Identifier?設(shè)置為?HeaderView
(5)往頭部中拖入一個(gè)?Label?并設(shè)置好相關(guān)約束。同時(shí)將?Label?的?Tag?設(shè)置為?1震檩。
(6)調(diào)整好分區(qū)尾部的尺寸琢蛤,將其背景色設(shè)為灰色。同時(shí)將其?Identifier?設(shè)置為?FooterView。
(7)調(diào)整好單元格尺寸虐块,將其?Identifier?設(shè)置為?MyCell
(8)往單元格里拖入一個(gè)?ImageView俩滥,并設(shè)置好相關(guān)約束嘉蕾。同時(shí)將?ImageView?的?Tag?設(shè)為?1贺奠。
(9)選中?Collection View,在尺寸樣式面包中設(shè)置好內(nèi)邊距和單元格間距错忱。
(10)新建一個(gè)?CollectionViewController?類(繼承?UICollectionViewController)儡率。并在?StoryBoard?中作綁定。
(11)CollectionViewController.swift?完整代碼如下
本文轉(zhuǎn)載自:http://www.hangge.com/blog/cache/detail_1592.html