[TIL],[UIKit],[UICollectionView],[테이블 뷰에서 컬렉션뷰 전환]

Why?

메모 앱의 기능중 갤러리로 보기를 구현하기 위해 CollectionView가 필요하여 구현하게 됨

TIL

 

문제 상황: 버튼을 누를시 리스트 형식의 뷰에서 갤러리 형식으로 바꿔서 보여줘야함

-> 데이터의 isTable 프로퍼티에 따라 tableview와 collectionview의 히든 값을 조정하여 구현

dataManager.isTable ? tableViewOn() : collectionViewOn()

동일한 위치에 tableview와 collectionview를 둠으로써 hidden값을 이용해 화면 구성이 가능해짐

 

 

CollectionView 코드

extension Page2ViewController: UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
    
    // header 설정
    func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
        
        
        let headerview = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: "CollectionSectionView", for: indexPath) as! CollectionSectionView
        let sectionName = dataManager.data[folderSectionIndex].folderDatas[folderIndex].memoSection[indexPath.section].sectionName
        headerview.SectionLabel.text = sectionName == dataManager.getDate() ? "오늘" : sectionName
        return headerview
    }
    
    // header 크기 지정
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
        let width: CGFloat = collectionView.frame.width
        let height: CGFloat = 50
        return CGSize(width: width, height: height)
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)
    }
    
    // 그리드의 항목 줄 사이에 사용할 최소 간격
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 30
    }
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 10
    }
    
    // 셀 크기 지정
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        
        let width = collectionView.bounds.width
        let numberOfItemsPerRow: CGFloat = 3
        let spacing: CGFloat = 10
        let availableWidth = width - spacing * (numberOfItemsPerRow + 1)
        let itemDimension = floor(availableWidth / numberOfItemsPerRow)
        
        return CGSize(width: itemDimension, height: itemDimension)
    }
    
    
    //section 갯수 설정
    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return dataManager.data[folderSectionIndex].folderDatas[folderIndex].memoSection.filter{$0.memoDatas.count != 0}.count
    }
    
    
    //cell 갯수 설정
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return dataManager.data[folderSectionIndex].folderDatas[folderIndex].memoSection[section].memoDatas.count
    }
    
    //cell data 설정
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        
        let nibName = UINib(nibName: "CollectionViewCell", bundle: nil)
        collectionView.register(nibName, forCellWithReuseIdentifier: "CollectionViewCell")
        let cell = myCollectionView.dequeueReusableCell(withReuseIdentifier: "CollectionViewCell", for: indexPath) as! CollectionViewCell
        cell.label.text = dataManager.data[folderSectionIndex].folderDatas[folderIndex].memoSection[indexPath.section].memoDatas[indexPath.row].content
        cell.cellName.text = dataManager.data[folderSectionIndex].folderDatas[folderIndex].memoSection[indexPath.section].memoDatas[indexPath.row].content
        
        return cell
    }
    
    //cell 눌렀을 때
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        print("cell Tapped")
        memoIndex = indexPath.row
        memoSectionIndex = indexPath.section
        performSegue(withIdentifier: "Page3ViewController", sender: nil)
    }
    
    
}