[swift] Swift IGListKit을 사용한 셀 선택상태 관리하기

IGListKit은 iOS 앱의 셀 기반 인터페이스를 구축하기 위한 강력한 프레임워크입니다. IGListKit은 UICollectionView의 대안으로 사용할 수 있으며, 셀 간의 선택 상태를 관리하는 기능도 제공합니다.

이 예제는 IGListKit을 사용하여 셀의 선택 상태를 관리하는 방법을 보여줍니다.

1. IGListKit 시작하기

먼저, IGListKit을 프로젝트에 추가해야 합니다. 이를 위해 CocoaPods를 사용하여 IGListKit을 설치합니다. Podfile에 다음과 같이 IGListKit을 추가합니다.

pod 'IGListKit'

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

2. 데이터 모델 및 셀 클래스 생성하기

셀의 선택 상태를 관리하기 위해 먼저 데이터 모델 클래스를 생성합니다. 선택 상태를 나타내는 isSelected 속성을 추가합니다.

class Item {
    let name: String
    var isSelected: Bool

    init(name: String, isSelected: Bool) {
        self.name = name
        self.isSelected = isSelected
    }
}

다음으로, 데이터 모델을 표시하는 셀 클래스를 생성합니다. 셀 클래스는 UICollectionViewCell을 상속받아야 합니다.

class ItemCell: UICollectionViewCell {
    @IBOutlet weak var nameLabel: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()
        // 셀 초기화 로직
    }

    func configure(with item: Item) {
        nameLabel.text = item.name

        if item.isSelected {
            contentView.backgroundColor = .blue
        } else {
            contentView.backgroundColor = .white
        }
    }
}

3. 셀 선택 상태 관리하기

이제, IGListKit을 사용하여 셀의 선택 상태를 관리하는 방법을 알아보겠습니다.

먼저, IGListSectionController를 상속받는 새로운 클래스를 생성합니다.

class ItemSectionController: ListSectionController {
    var item: Item?

    override func sizeForItem(at index: Int) -> CGSize {
        return CGSize(width: collectionContext?.containerSize.width ?? 0, height: 50)
    }

    override func cellForItem(at index: Int) -> UICollectionViewCell {
        guard let item = item else {
            fatalError("Item is nil")
        }

        guard let cell = collectionContext?.dequeueReusableCell(of: ItemCell.self, for: self, at: index) as? ItemCell else {
            fatalError("Failed to dequeue cell")
        }

        cell.configure(with: item)
        return cell
    }

    override func didUpdate(to object: Any) {
        self.item = object as? Item
    }

    override func didSelectItem(at index: Int) {
        guard let item = item else {
            return
        }

        item.isSelected = !item.isSelected
        collectionContext?.reload(self)
    }
}

위의 코드에서 didSelectItem(at:) 메서드는 셀이 선택되었을 때 호출됩니다. 해당 셀의 선택 상태를 변경한 후, IGListKit에게 해당 section controller를 리로드하도록 알려주어 선택 상태가 UI에 반영되게 됩니다.

4. IGListKit 이용하여 리스트 구성하기

마지막으로, IGListKit을 사용하여 리스트를 구성하는 과정입니다.

class ViewController: UIViewController {
    @IBOutlet weak var collectionView: UICollectionView!

    private var items: [Item] = [
        Item(name: "Item 1", isSelected: false),
        Item(name: "Item 2", isSelected: false),
        Item(name: "Item 3", isSelected: false)
    ]

    private lazy var adapter: ListAdapter = {
        return ListAdapter(updater: ListAdapterUpdater(), viewController: self)
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        // collection view 설정 및 리스트 등록
        adapter.collectionView = collectionView
        adapter.dataSource = self
    }
}

extension ViewController: ListAdapterDataSource {
    func objects(for listAdapter: ListAdapter) -> [ListDiffable] {
        return items as [ListDiffable]
    }

    func listAdapter(_ listAdapter: ListAdapter, sectionControllerFor object: Any) -> ListSectionController {
        return ItemSectionController()
    }

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

위의 코드에서 objects(for:) 메서드에서 리스트에 표시할 데이터를 반환하고, listAdapter(_:sectionControllerFor:) 메서드에서 해당 데이터에 대한 section controller를 반환합니다. 그리고 emptyView(for:) 메서드에서 리스트가 비어있을 경우 표시할 뷰를 반환할 수 있습니다.

결론

이제 IGListKit을 사용하여 셀의 선택 상태를 관리하는 방법을 알아보았습니다. IGListKit을 사용하면 더욱 간편하게 셀 간의 관계와 상태를 관리할 수 있습니다. IGListKit에 대해 더 자세히 알아보고 싶다면, IGListKit의 공식 문서를 참고하시기 바랍니다.

참고 자료