iOS开发 - UICollectionView点击展开收起

结合SB,快速实现UICollectionView点击展开收起

iOS开发 - UICollectionView点击展开收起_第1张图片
效果图
iOS开发 - UICollectionView点击展开收起_第2张图片
SB正常布局

主要:要设置好对应的 Identifier


ViewController.swift

import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var collectionView: UICollectionView! {
        didSet {
            collectionView.delegate = self
            collectionView.dataSource = self
        }
    }

    var sectionState = [Bool]() // section 状态-记录 false 关 true 开
    var dataArray = [AnyObject]()
}

extension ViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        initCollectionData()
    }
    
    //初始化数据
    func initCollectionData() {
        
        let first = ["1","2","3","4","5","6","1","2","3","4"]
        let second = ["1","2","3","4","5","6","7","8"]
        let third = ["1","2","3","4","5","6"]
        dataArray = [first,second,third]
        
        dataArray.forEach {_ in
            sectionState.append(false) //默认是关闭状态
        }
    }
    
    //分区的头部 - 点击事件
    func buttonClick(sender: UIButton) {
        sectionState[sender.tag] = sectionState[sender.tag] == true ? false : true
        collectionView.reloadSections(NSIndexSet(index: sender.tag))
    }
}

// MARK: - UICollectionView 代理方法
extension ViewController: UICollectionViewDelegate, UICollectionViewDataSource {
    
    func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
        return dataArray.count
    }
    
    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        
        return sectionState[section] == true ? dataArray[section].count : 0
    }
    
    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCellWithReuseIdentifier("GroupCollectionCell", forIndexPath: indexPath)
        cell.backgroundColor = UIColor.grayColor()
        return cell
    }
    
    func collectionView(collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, atIndexPath indexPath: NSIndexPath) -> UICollectionReusableView {

        let header = collectionView.dequeueReusableSupplementaryViewOfKind(UICollectionElementKindSectionHeader, withReuseIdentifier: "GroupSection", forIndexPath: indexPath) as! GroupSection
        header.sectionTitle.text = sectionState[indexPath.section] ? "关闭" : "打开"
        header.sectionBtn.addTarget(self, action: #selector(ViewController.buttonClick(_:)), forControlEvents: .TouchUpInside) //增加点击事件
        header.sectionBtn.tag = indexPath.section
        return header
    }
}

// MARK: - 单元格的样式
extension ViewController: UICollectionViewDelegateFlowLayout {
    
    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
        
        let SCREEN_WIDTH = UIScreen.mainScreen().bounds.width
        return CGSizeMake(SCREEN_WIDTH / 4 - 10, SCREEN_WIDTH / 4 - 10) //单个Cell的大小
    }
    
    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets {
        
        return UIEdgeInsetsMake(0, 5, 0, 5) //上、左、下、右距四边的间距
    }
    
    func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
        
        return CGSizeMake(0, 40)//分组头部视图的高度
    }
}

GroupSection.swift //组头视图

import UIKit

class GroupSection: UICollectionReusableView {
    
    @IBOutlet weak var sectionTitle: UILabel!
    @IBOutlet weak var sectionBtn: UIButton!
}

你可能感兴趣的:(iOS开发 - UICollectionView点击展开收起)