[swift] Swift IGListKit에서 데이터 소스 구현하기

27 Nov 2023

swift

IGListKit은 iOS 애플리케이션에서 컬렉션 뷰를 관리하기 위한 강력한 도구입니다. IGListKit을 사용하면 데이터 소스를 구현하여 컬렉션 뷰에 데이터를 쉽게 제공할 수 있습니다. 이 글에서는 Swift 5와 IGListKit 4를 기준으로 IGListKit의 데이터 소스를 구현하는 방법을 알아보겠습니다.

IGListDataSource 프로토콜 채택하기

먼저, IGListDataSource 프로토콜을 채택하여 데이터 소스를 구현합니다. IGListDataSource는 컬렉션 뷰의 데이터를 제공하는 메서드를 정의합니다.

import IGListKit

class MyDataSource: NSObject, IGListDataSource {
    
    var data: [Any] = []
    
    func objects(for listAdapter: IGListAdapter) -> [IGListDiffable] {
        return data.compactMap { $0 as? IGListDiffable }
    }
    
    func listAdapter(_ listAdapter: IGListAdapter, sectionControllerFor object: Any) -> IGListSectionController {
        // 섹션 컨트롤러를 리턴하는 로직을 작성합니다.
        // object의 타입에 따라 적절한 섹션 컨트롤러를 생성하여 리턴합니다.
    }
    
    func emptyView(for listAdapter: IGListAdapter) -> UIView? {
        // 데이터가 비어있을 때 보여줄 뷰를 리턴합니다.
        // 예를 들어, "데이터가 없습니다." 라벨 등을 리턴할 수 있습니다.
    }
    
}

위의 코드는 MyDataSource라는 클래스를 정의하고 IGListDataSource 프로토콜을 채택하여 데이터 소스를 구현한 예시입니다. data 변수는 컬렉션 뷰에 표시할 데이터를 저장하는 배열입니다. objects(for:) 메서드는 data 배열에서 IGListDiffable 프로토콜을 준수하는 객체들을 리턴하며, listAdapter(_:sectionControllerFor:) 메서드는 object의 타입에 따라 적절한 섹션 컨트롤러를 생성하여 리턴합니다. emptyView(for:) 메서드는 데이터가 비어있을 때 보여줄 뷰를 리턴합니다.

섹션 컨트롤러 구현하기

데이터 소스에서 리턴한 객체들에 대한 섹션 컨트롤러를 구현해야 합니다. 섹션 컨트롤러는 컬렉션 뷰의 각 섹션을 관리하며, 해당 섹션에 표시할 셀 및 뷰를 정의합니다.

import IGListKit

class MySectionController: IGListSectionController {
    
    var object: Any?
    
    override func numberOfItems() -> Int {
        // 섹션에 표시할 아이템의 개수를 리턴합니다.
    }
    
    override func cellForItem(at index: Int) -> UICollectionViewCell {
        // 인덱스에 해당하는 셀을 리턴합니다.
        // UICollectionViewCell을 상속받는 셀을 리턴해야 합니다.
    }
    
    override func sizeForItem(at index: Int) -> CGSize {
        // 인덱스에 해당하는 셀의 크기를 리턴합니다.
    }
    
    override func didUpdate(to object: Any) {
        // object가 변경될 때 호출되는 메서드입니다.
        // 필요한 작업을 수행하십시오.
    }
    
    override func didSelectItem(at index: Int) {
        // 특정 아이템이 선택됐을 때 호출되는 메서드입니다.
        // 필요한 작업을 수행하십시오.
    }
    
}

위의 코드는 MySectionController라는 클래스를 정의하고 IGListSectionController를 상속하여 섹션 컨트롤러를 구현한 예시입니다. object 변수는 해당 섹션에 대한 데이터를 저장합니다. numberOfItems() 메서드는 섹션에 표시할 아이템의 개수를 리턴하고, cellForItem(at:) 메서드는 해당 인덱스에 해당하는 셀을 리턴합니다. sizeForItem(at:) 메서드는 인덱스에 해당하는 셀의 크기를 리턴하며, didUpdate(to:) 메서드는 object가 변경될 때마다 호출됩니다. didSelectItem(at:) 메서드는 특정 아이템이 선택되었을 때 호출됩니다.

사용하기

이제 데이터 소스와 섹션 컨트롤러를 구현했으니 IGListKit을 사용하여 컬렉션 뷰에 연결해보겠습니다.

import IGListKit

class MyViewController: UIViewController {
    
    let collectionView = UICollectionView(frame: .zero, collectionViewLayout: UICollectionViewFlowLayout())
    let adapter = IGListAdapter(updater: IGListAdapterUpdater(), viewController: nil)
    let dataSource = MyDataSource()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        adapter.collectionView = collectionView
        adapter.dataSource = dataSource
        
        // 데이터를 초기화하고 컬렉션 뷰를 리로드합니다.
        dataSource.data = [/* 데이터 배열 */]
        adapter.reloadData()
    }
    
}

위의 코드는 MyViewController라는 클래스를 정의하고 IGListAdapter와 MyDataSource를 사용하여 컬렉션 뷰를 구성한 예시입니다. collectionView는 컬렉션 뷰 인스턴스를 생성하고, adapter는 IGListAdapter 인스턴스를 생성합니다. dataSource는 우리가 구현한 데이터 소스 객체입니다. viewDidLoad() 메서드에서 adapter의 collectionView와 dataSource를 설정하고, 데이터를 초기화하고 컬렉션 뷰를 리로드합니다.

IGListKit을 사용하여 데이터 소스를 구현하는 방법에 대해 알아보았습니다. IGListKit은 매우 강력하고 유연한 도구이므로 적절히 사용하면 복잡한 컬렉션 뷰 관리 작업을 더욱 쉽게 처리할 수 있습니다.

참고 자료

IGListKit 공식 문서: https://github.com/Instagram/IGListKit