Colin's Blog
[swift] Swift IGListKit에서 컬렉션 뷰 셀 확장/축소 처리하기

IGListKit은 iOS 애플리케이션에서 컬렉션 뷰를 사용하는 데 도움이 되는 강력한 라이브러리입니다. 이 라이브러리를 사용하면 컬렉션 뷰의 데이터 관리와 표시를 쉽게 할 수 있습니다. 이번 글에서는 IGListKit을 사용하여 컬렉션 뷰 셀의 확장과 축소를 처리하는 방법에 대해 알아보겠습니다.

IGListKit 설치

먼저, IGListKit을 프로젝트에 설치해야 합니다. IGListKit은 CocoaPods를 통해 설치할 수 있습니다. Podfile에 다음과 같이 추가합니다:

pod 'IGListKit'

그리고 터미널에서 pod install 명령을 실행하여 IGListKit을 설치합니다.

컬렉션 뷰 셀 확장/축소 처리하기

  1. IGListKit에서는 IGListSectionController를 사용하여 컬렉션 뷰의 섹션을 관리합니다. 따라서 셀의 확장/축소 처리를 하려면 해당 섹션 컨트롤러에서 처리해야 합니다.

  2. 먼저, IGListSectionController를 상속받은 새로운 클래스를 만들어서 사용합니다. 이 클래스에서 컬렉션 뷰의 셀을 표시하고 관리합니다.

class ExpandableCellSectionController: ListSectionController {
    // 필요한 속성 및 변수들을 선언합니다
    
    override func cellForItem(at index: Int) -> UICollectionViewCell {
        guard let cell = collectionContext?.dequeueReusableCell(of: ExpandableCell.self, for: self, at: index) as? ExpandableCell else {
            fatalError("Could not dequeue ExpandableCell")
        }
        
        // cell의 내용을 설정합니다
        
        return cell
    }
    
    override func didUpdate(to object: Any) {
        // object에 관련된 정보를 받아서 필요한 작업을 수행합니다
    }
    
    override func sizeForItem(at index: Int) -> CGSize {
        // cell의 크기를 계산하여 반환합니다
    }
    
    // 셀을 선택했을 때의 동작을 처리합니다
    override func didSelectItem(at index: Int) {
        // 셀의 확장/축소 처리를 해주는 로직을 작성합니다
    }
}
  1. 컬렉션 뷰 셀의 확장/축소 상태를 나타내기 위한 변수를 선언합니다. 이 변수는 didSelectItem(at:) 메서드에서 토글됩니다.
private var isExpanded = false
  1. sizeForItem(at:) 메서드를 사용하여 확장/축소에 따라 셀의 크기를 조정합니다.
override func sizeForItem(at index: Int) -> CGSize {
    let width = collectionContext?.containerSize.width ?? 0
    let height: CGFloat = isExpanded ? 200 : 100
    
    return CGSize(width: width, height: height)
}
  1. didSelectItem(at:) 메서드에서 확장/축소의 토글을 처리합니다.
override func didSelectItem(at index: Int) {
    isExpanded = !isExpanded
    
    UIView.animate(withDuration: 0.3) {
        self.collectionContext?.invalidateLayout(for: self)
    }
}
  1. 마지막으로, 컬렉션 뷰 컨트롤러에서 새로 만든 섹션 컨트롤러를 설정해줍니다.
class ViewController: UIViewController {
    // 필요한 속성 및 변수들을 선언합니다
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // IGListKit 컨트롤러를 설정하는 코드
        
        adapter.collectionView = collectionView
        adapter.dataSource = self
    }
    
    // IGListKit의 ListAdapterDataSource 프로토콜을 구현합니다
}

extension ViewController: ListAdapterDataSource {
    func objects(for listAdapter: ListAdapter) -> [ListDiffable] {
        // 데이터 소스에서 필요한 객체들을 반환합니다
    }
    
    func listAdapter(_ listAdapter: ListAdapter, sectionControllerFor object: Any) -> ListSectionController {
        return ExpandableCellSectionController()
    }
    
    func emptyView(for listAdapter: ListAdapter) -> UIView? {
        return nil
    }
}

위와 같이 IGListKit을 사용하여 컬렉션 뷰의 셀을 확장/축소하는 기능을 구현할 수 있습니다. 이를 활용하여 애플리케이션의 사용자 인터페이스를 더욱 유연하고 동적으로 만들 수 있습니다.

자세한 내용은 IGListKit 공식 문서를 참조해주세요.

© 2018 Colin. All rights reserved.