[swift] IGListDiffKit을 활용한 데이터 시각화

IGListDiffKit은 Instagram에서 개발한 데이터 시각화 라이브러리입니다. 이 라이브러리를 사용하면 데이터의 변경 사항을 감지하여 효율적으로 업데이트할 수 있습니다. IGListDiffKit은 UICollectionView와 함께 사용되며, 데이터의 변경 사항을 전체적으로 업데이트하지 않고, 변경된 항목만 업데이트하여 성능을 향상시킵니다.

1. IGListDiffKit 설치하기

IGListDiffKit은 CocoaPods를 통해 쉽게 설치할 수 있습니다. Podfile에 다음과 같이 추가해주십시오.

pod 'IGListDiffKit'

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

2. 데이터 모델 생성하기

IGListDiffKit을 사용하기 위해 먼저 데이터 모델을 생성해야 합니다. 데이터 모델은 ListDiffable 프로토콜을 채택한 클래스나 구조체여야 합니다. ListDiffable 프로토콜은 두 개의 메서드를 요구합니다.

func diffIdentifier() -> NSObjectProtocol
func isEqual(toDiffableObject object: ListDiffable?) -> Bool

diffIdentifier()는 해당 객체의 유일한 식별자를 반환해야 합니다. isEqual(toDiffableObject:) 메서드는 두 개의 객체가 동일한지 비교하는 로직을 구현해야 합니다.

3. UICollectionView와 IGListAdapter 설정하기

IGListDiffKit을 사용하기 위해 UICollectionView를 설정해야 합니다. UICollectionView는 일반적인 방법으로 설정한 다음, IGListAdapter를 사용하여 데이터와 연결하고 업데이트를 처리합니다.

let collectionView: UICollectionView = UICollectionView(frame: .zero, collectionViewLayout: UICollectionViewFlowLayout())
let adapter: IGListAdapter = IGListAdapter(updater: IGListAdapterUpdater(), viewController: self, workingRangeSize: 0)

IGListAdapter의 생성자는 IGListAdapterUpdater 객체와 viewController를 파라미터로 받습니다. IGListAdapterUpdater는 데이터 변경 사항을 처리하고, viewController는 collectionView의 SuperView를 가리키는 뷰 컨트롤러입니다.

4. 데이터 변경 사항 처리하기

데이터 변경 사항을 처리하려면 IGListAdapterDataSource 프로토콜을 구현해야 합니다. IGListAdapterDataSource를 구현하면 listAdapter(_:sectionControllerFor:), listAdapter(_:viewFor:), listAdapter(_:sizeForItemAt:) 등의 메서드를 사용하여 데이터를 관리하고 셀을 설정할 수 있습니다.

extension ViewController: IGListAdapterDataSource {
    func objects(for listAdapter: IGListAdapter) -> [IGListDiffable] {
        return dataModel
    }

    func listAdapter(_ listAdapter: IGListAdapter, sectionControllerFor object: Any) -> IGListSectionController {
        return MySectionController()
    }

    func emptyView(for listAdapter: IGListAdapter) -> UIView? {
        return nil
    }
}

5. 샘플 코드

다음은 IGListDiffKit을 활용하여 데이터를 시각화하는 샘플 코드입니다.

import UIKit
import IGListKit

class ViewController: UIViewController {

    @IBOutlet weak var collectionView: UICollectionView!

    // 데이터 모델
    var dataModel: [MyDataModel] = []

    // IGListAdapter
    lazy var adapter: IGListAdapter = {
        return IGListAdapter(updater: IGListAdapterUpdater(), viewController: self, workingRangeSize: 0)
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        
        // UICollectionView 설정
        collectionView.collectionViewLayout = UICollectionViewFlowLayout()

        // IGListAdapter 설정
        adapter.collectionView = collectionView
        adapter.dataSource = self
        
        // 데이터 초기화
        dataModel = fetchData()

        // 데이터 변경 사항 감지하여 업데이트
        adapter.performUpdates(animated: true, completion: nil)
    }

    func fetchData() -> [MyDataModel] {
        // 데이터를 가져와서 반환하는 로직
    }
}

extension ViewController: IGListAdapterDataSource {
    // IGListDiffable 객체들을 반환하는 로직
        
    func objects(for listAdapter: IGListAdapter) -> [IGListDiffable] {
        return dataModel
    }

    // 섹션 컨트롤러를 반환하는 로직

    func listAdapter(_ listAdapter: IGListAdapter, sectionControllerFor object: Any) -> IGListSectionController {
        return MySectionController()
    }

    // 빈 화면을 처리하는 로직

    func emptyView(for listAdapter: IGListAdapter) -> UIView? {
        return nil
    }
}

위의 샘플 코드를 기반으로 IGListDiffKit을 활용하여 데이터를 시각화하는 코드를 작성해보세요. IGListDiffKit을 사용하면 UICollectionView의 데이터 변경을 효율적으로 처리할 수 있습니다.

참고 자료