上一篇介紹了如何使用swift純代碼構(gòu)建UIColletionView缘揪,本篇繼續(xù)介紹如何對其分組耍群、設(shè)置分組標(biāo)題、cell 圓角找筝、選中變色蹈垢。
效果圖如下:
1.設(shè)置Header布局SHomeHeader,繼承自UICollectionReusableView袖裕。
//
// SHomeHeader.swift
//
// Created by wangjie on 16/5/4.
// Copyright ? 2016年 wangjie. All rights reserved.
//
import UIKit
class SHomeHeader: UICollectionReusableView {
var titleLabel:UILabel?//title
override init(frame: CGRect) {
super.init(frame: frame)
initView()
}
func initView(){
titleLabel = UILabel(frame: CGRectMake(0, 0, SCREEN_WIDTH, 30))
titleLabel?.backgroundColor = HEADER_BG_COLOR
self .addSubview(titleLabel!)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
2.為UICollectionReusableView注冊header曹抬。
//注冊header
collectionView!.registerClass(SHomeHeader.classForCoder(), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: headerIdentifier)
3.自定義Header并設(shè)置寬高。
//設(shè)置HeadView的寬高
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize{
return CGSize(width: SCREEN_WIDTH, height: headerHeight)
}
//返回自定義HeadView
func collectionView(collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, atIndexPath indexPath: NSIndexPath) -> UICollectionReusableView{
var v = SHomeHeader()
if kind == UICollectionElementKindSectionHeader{
v = collectionView.dequeueReusableSupplementaryViewOfKind(kind, withReuseIdentifier: headerIdentifier, forIndexPath: indexPath) as! SHomeHeader
let title:String = headerArr[indexPath.section] as! String
v.titleLabel?.text = title
}
return v
}
4.設(shè)置選中顏色及圓角Cell急鳄。
func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
let cell = collectionView.cellForItemAtIndexPath(indexPath)
cell!.layer.cornerRadius = 4
cell?.backgroundColor = UIColor.yellowColor()
}
func collectionView(collectionView: UICollectionView, didDeselectItemAtIndexPath indexPath: NSIndexPath) {
let cell = collectionView.cellForItemAtIndexPath(indexPath)
cell!.layer.cornerRadius = 4
cell?.backgroundColor = UIColor.whiteColor()
}
5.自定義圓角帶邊框的UICollectionViewCell谤民。
//
// SHomeCell.swift
//
// Created by wangjie on 16/5/4.
// Copyright ? 2016年 wangjie. All rights reserved.
//
import UIKit
class SHomeCell: UICollectionViewCell {
var titleLabel:UILabel?//title
override init(frame: CGRect) {
super.init(frame: frame)
initView()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func initView(){
titleLabel = UILabel(frame: CGRectMake(0, 0, (SCREEN_WIDTH - 20)/3, (SCREEN_WIDTH - 20)/3))
titleLabel?.layer.cornerRadius = 4
titleLabel?.layer.borderWidth = 0.5
titleLabel?.textAlignment = NSTextAlignment.Center
titleLabel?.layoutMargins = UIEdgeInsets(top:0, left:0, bottom:0, right:0)
self .addSubview(titleLabel!)
}
}
6. UIViewController 完整代碼堰酿。
//
// SHomeViewController.swift
//
// Created by wangjie on 16/5/4.
// Copyright ? 2016年 wangjie. All rights reserved.
//
import UIKit
class SHomeViewController:UIViewController,UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout{
var collectionView : UICollectionView?
var dataArr = NSMutableArray()//數(shù)據(jù)源
var headerArr = NSMutableArray()//分組標(biāo)題
let headerHeight:CGFloat = 30
let cellHeight:CGFloat = (SCREEN_WIDTH - 20)/3
let headerIdentifier:String = "headView"
override func viewDidLoad() {
super.viewDidLoad()
initView()
initData()
}
func initView(){
let layout = UICollectionViewFlowLayout()
self.view.backgroundColor = UIColor.whiteColor()
layout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5);
layout.minimumInteritemSpacing = 5; // this number could be anything <=5. Need it here because the default is 10.
layout.minimumLineSpacing = 4.0 //設(shè)置行間距
layout.itemSize = CGSizeMake((SCREEN_WIDTH - 20)/3, (SCREEN_WIDTH - 20)/3) // 20 is 2*5 for the 2 edges plus 2*5 for the spaces between the cells
collectionView = UICollectionView(frame: CGRectMake(0, 20, SCREEN_WIDTH, SCREEN_HEIGHT), collectionViewLayout: layout)
//注冊一個cell
collectionView!.registerClass(SHomeCell.self, forCellWithReuseIdentifier:"cell")
collectionView?.delegate = self;
collectionView?.dataSource = self;
collectionView?.backgroundColor = UIColor.whiteColor()
//設(shè)置每一個cell的寬高
self.view.addSubview(collectionView!)
//注冊header
collectionView!.registerClass(SHomeHeader.classForCoder(), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: headerIdentifier)
}
func initData(){
initHeaderData()
initSelectionData()
self.collectionView?.reloadData()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
//返回多少個組
func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
return headerArr.count
}
//返回多少個cell
func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return dataArr.count
}
//返回自定義的cell
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("cell", forIndexPath: indexPath) as! SHomeCell
let title = dataArr[indexPath.row]
cell.titleLabel?.text = title as? String
return cell
}
func initHeaderData() {
headerArr.addObject("header 1")
headerArr.addObject("header 2")
headerArr.addObject("header 3")
}
func initSelectionData() {
dataArr.addObject("selection 1")
dataArr.addObject("selection 2")
dataArr.addObject("selection 3")
}
//設(shè)置HeadView的寬高
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize{
return CGSize(width: SCREEN_WIDTH, height: headerHeight)
}
//返回自定義HeadView
func collectionView(collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, atIndexPath indexPath: NSIndexPath) -> UICollectionReusableView{
var v = SHomeHeader()
if kind == UICollectionElementKindSectionHeader{
v = collectionView.dequeueReusableSupplementaryViewOfKind(kind, withReuseIdentifier: headerIdentifier, forIndexPath: indexPath) as! SHomeHeader
let title:String = headerArr[indexPath.section] as! String
v.titleLabel?.text = title
}
return v
}
func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
let cell = collectionView.cellForItemAtIndexPath(indexPath)
cell!.layer.cornerRadius = 4
cell?.backgroundColor = UIColor.yellowColor()
}
func collectionView(collectionView: UICollectionView, didDeselectItemAtIndexPath indexPath: NSIndexPath) {
let cell = collectionView.cellForItemAtIndexPath(indexPath)
cell!.layer.cornerRadius = 4
cell?.backgroundColor = UIColor.whiteColor()
}
}