[swift] IGListDiffKit을 이용한 드래그 앤 드롭 작업

20 Nov 2023

swift

이번 블로그 포스트에서는 Swift에서 IGListDiffKit을 사용하여 드래그 앤 드롭 작업을 구현하는 방법에 대해 알아보겠습니다.

IGListDiffKit 소개

IGListDiffKit은 Instagram에서 개발한 오픈 소스 라이브러리로, 컬렉션 뷰나 테이블 뷰와 같은 리스트 기반 UI를 더 효율적으로 관리할 수 있게 도와줍니다. IGListDiffKit은 컬렉션 뷰나 테이블 뷰의 데이터 소스를 업데이트할 때 발생하는 변화를 자동으로 계산하여 애니메이션 효과를 적용할 수 있도록 도와줍니다.

드래그 앤 드롭 작업 구현하기

IGListKit 설치하기

IGListDiffKit을 사용하기 위해 먼저 프로젝트에 IGListKit을 설치해야 합니다. Cocoapods를 사용하는 경우 Podfile에 다음과 같이 IGListKit을 추가합니다.
```
 pod 'IGListKit'
```
설치가 완료되면 프로젝트를 다시 빌드하여 IGListKit을 사용할 수 있습니다.
컬렉션 뷰 설정하기

드래그 앤 드롭 기능을 적용할 컬렉션 뷰를 설정합니다. IGListKit에서 제공하는 IGListCollectionView를 사용하면 됩니다. 컬렉션 뷰의 데이터 소스와 델리게이트를 설정해줍니다.
```
 let collectionView = IGListCollectionView(frame: view.bounds)
 collectionView.dataSource = self
 collectionView.delegate = self
```

드래그 앤 드롭 기능 활성화하기

드래그 앤 드롭 기능을 사용하려면 IGListCollectionViewDelegateUICollectionViewDelegate 프로토콜을 채택해야 합니다. 다음과 같이 해당 프로토콜을 채택한 뷰 컨트롤러의 확장을 작성합니다.

 extension MyViewController: IGListCollectionViewDelegateUICollectionViewDelegate {
     func collectionView(_ collectionView: UICollectionView, itemsForBeginning session: UIDragSession, at indexPath: IndexPath) -> [UIDragItem] {
         // 드래그 작업을 시작할 때 실행할 로직을 구현합니다.
         // 드래그 아이템을 생성하여 반환합니다.
     }

     func collectionView(_ collectionView: UICollectionView, performDropWith coordinator: UICollectionViewDropCoordinator) {
         // 드롭 액션을 수행할 때 실행할 로직을 구현합니다.
     }
 }

itemsForBeginning 메서드에서는 드래그 작업이 시작될 때 실행될 로직을 구현합니다. 드래그 아이템을 생성하여 반환합니다.

performDropWith 메서드에서는 드롭 액션이 수행될 때 실행될 로직을 구현합니다. 드롭된 아이템의 데이터를 가져와 처리합니다.

드래그 앤 드롭 애니메이션 효과 적용하기

IGListDiffKit은 자동으로 데이터 소스의 변화를 계산하여 애니메이션 효과를 적용해줍니다. 데이터 소스의 순서를 변경하는 경우, IGListDiffKit은 이를 감지하고 자동으로 애니메이션 효과를 적용하여 사용자에게 부드러운 드래그 앤 드롭 경험을 제공합니다.

드래그 앤 드롭 작업이 수행될 때마다 데이터 소스를 업데이트하고, IGListDiffKit을 호출하여 변화를 계산합니다. IGListDiffKit은 변화가 있는지 감지한 후 애니메이션 효과를 적용합니다.

마무리

이번 블로그 포스트에서는 IGListDiffKit을 사용하여 드래그 앤 드롭 작업을 구현하는 방법에 대해 알아보았습니다. IGListDiffKit은 컬렉션 뷰나 테이블 뷰의 데이터 소스 변화를 감지하고, 이를 자동으로 애니메이션 효과로 표현해주므로 사용자가 부드러운 드래그 앤 드롭 경험을 할 수 있습니다.

더 많은 IGListDiffKit의 기능과 예제는 공식 IGListKit Github 저장소에서 확인할 수 있으니 참고하시기 바랍니다.