[swift] Swift IGListKit을 사용한 컬렉션 뷰 밀어내기 처리하기

27 Nov 2023

swift

IGListKit은 iOS 애플리케이션에서 컬렉션 뷰를 관리하기 위한 강력한 프레임워크입니다. 이 프레임워크는 컬렉션 뷰의 데이터 소스 및 UI 업데이트를 처리하는데 도움을 줄 뿐만 아니라, 다양한 기능들을 제공하여 개발자가 효율적으로 컬렉션 뷰를 구현할 수 있도록 도와줍니다.

이번 글에서는 IGListKit을 사용하여 컬렉션 뷰의 밀어내기 기능을 구현하는 방법을 알아보겠습니다. 밀어내기 기능은 사용자가 컬렉션 뷰의 셀을 좌우로 스와이프할 때 발생하는 액션을 처리하는 것으로, 일반적으로 삭제 또는 특정 작업을 수행하는데 사용됩니다.

1. IGListKit 설치 및 설정하기

먼저, IGListKit을 프로젝트에 설치해야 합니다. CocoaPods를 사용하거나 수동으로 IGListKit 프레임워크를 프로젝트에 추가할 수 있습니다. IGListKit 설치와 설정에 대한 자세한 내용은 이 문서를 참조하십시오.

2. 밀어내기 액션 뷰 셀 구현하기

밀어내기 기능을 구현하기 위해 먼저 밀어내기 액션을 보여주는 뷰 셀을 구현해야 합니다. 이 뷰 셀은 컬렉션 뷰의 각 항목의 오른쪽에 나타날 것이며, 밀어내기 동작에 따라 각각 다른 액션을 수행할 수 있습니다.

뷰 셀을 구현하기 위해 IGListSectionController를 상속받은 클래스를 생성하고, IGListBindable 프로토콜을 구현합니다. 이 프로토콜은 뷰 셀의 데이터를 바인딩하기 위한 메서드를 정의합니다.

import IGListKit

class SwipeActionCell: UICollectionViewCell {
    // 뷰 셀의 UI 요소들을 정의합니다.
    ...
}

class SwipeActionSectionController: NSObject, IGListSectionController, IGListBindable {
    
    var item: Any?
    
    // 데이터를 받아와서 뷰 셀에 바인딩합니다.
    func bindViewModel(_ viewModel: Any) {
        self.item = viewModel
    }
    
    // 뷰 셀과 뷰 모델을 연결합니다.
    func cellForItem(at index: Int) -> UICollectionViewCell {
        let cell = collectionContext?.dequeueReusableCell(of: SwipeActionCell.self, for: self, at: index) as! SwipeActionCell
        cell.configure(with: item)
        return cell
    }
    
    ...
}

3. 컬렉션 뷰 컨트롤러에서 IGListKit 설정하기

이제 밀어내기 기능을 구현하기 위해 IGListKit을 컬렉션 뷰 컨트롤러에서 설정해야 합니다. IGListKit에서는 IGListAdapter를 사용하여 컬렉션 뷰의 데이터 소스 및 UI 업데이트를 관리합니다.

import IGListKit

class ViewController: UIViewController, IGListAdapterDataSource {
    
    @IBOutlet weak var collectionView: UICollectionView!
    
    lazy var adapter: IGListAdapter = {
        return IGListAdapter(updater: IGListAdapterUpdater(), viewController: self)
    }()
    
    var data: [Any] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        collectionView.collectionViewLayout = UICollectionViewFlowLayout()
        adapter.collectionView = collectionView
        adapter.dataSource = self
    }
    
    // 컬렉션 뷰의 항목 개수를 반환합니다.
    func numberOfItems(in listAdapter: IGListAdapter) -> Int {
        return data.count
    }
    
    // 각 항목별로 적절한 뷰 모델을 반환합니다.
    func listAdapter(_ listAdapter: IGListAdapter, cellForItemAt index: Int) -> UICollectionViewCell {
        let sectionController = SwipeActionSectionController()
        sectionController.bindViewModel(data[index])
        return sectionController.cellForItem(at: index)
    }
    
    ...
}

4. 밀어내기 액션 처리하기

마지막으로, 밀어내기 동작에 대한 처리를 구현해야 합니다. IGListKit에서는 IGListAdapterDelegate 프로토콜을 통해 방금 구현한 동작들을 처리할 수 있습니다.

class ViewController: UIViewController, IGListAdapterDataSource, IGListAdapterDelegate {
    
    ...
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        ...
        
        adapter.collectionViewDelegate = self
    }

    // 사용자가 셀을 밀어내면 호출되는 메서드입니다.
    func collectionView(_ collectionView: UICollectionView, editActionsForItemAt indexPath: IndexPath, for trailingSwipeActionsConfiguration: UISwipeActionsConfiguration?) -> UISwipeActionsConfiguration? {
        let deleteAction = UIContextualAction(style: .destructive, title: "Delete") { (action, view, completion) in
            // 해당 항목 삭제 로직 구현
            completion(true)
        }
        // 추가적인 액션을 설정할 수 있습니다.
        
        return UISwipeActionsConfiguration(actions: [deleteAction])
    }
    
    ...
}

이렇게 하면 IGListKit을 사용하여 컬렉션 뷰의 밀어내기 기능을 구현할 수 있습니다. IGListKit은 데이터 소스 및 UI 업데이트 관리를 자동으로 처리하기 때문에, 개발자는 필요한 로직을 직접 구현하기보다 간결하고 효율적인 코드를 작성할 수 있습니다.

더 자세한 IGListKit의 기능과 사용법에 대해서는 공식 문서를 참고하시기 바랍니다.