[swift] Swift DeepDiff를 사용하여 컬렉션 데이터 변경 시 스크롤 위치 유지하기

앱을 개발하다보면 테이블 뷰나 컬렉션 뷰 등의 UI 요소에서 데이터를 변경할 때 스크롤 위치를 유지하는 것이 중요한 경우가 있습니다. 예를 들어, 사용자가 스크롤하여 특정 아이템을 선택한 후 데이터가 변경되었을 때, 사용자가 선택한 아이템이 스크롤 위치에 그대로 보이도록 유지해야 합니다.

이번 블로그 포스트에서는 Swift에서 DeepDiff 라이브러리를 사용하여 컬렉션 데이터 변경 시 스크롤 위치를 유지하는 방법에 대해 알아보겠습니다.

DeepDiff 소개

DeepDiff는 Swift로 작성된 라이브러리로, 두 개의 컬렉션 데이터를 비교하여 변경된 아이템을 식별하는 기능을 제공합니다. 이를 통해 데이터 변경 시 화면을 최소한으로 업데이트할 수 있습니다.

설치

DeepDiff는 Swift Package Manager를 통해 설치할 수 있습니다. Package.swift 파일에 다음 종속성을 추가합니다.

.package(url: "https://github.com/onmyway133/DeepDiff.git", from: "2.0.0")

컬렉션 데이터 변경 시 스크롤 위치 유지하기

이제 DeepDiff를 사용하여 컬렉션 데이터 변경 시 스크롤 위치를 유지하는 방법을 살펴보겠습니다.

  1. 첫 번째로, UICollectionViewUITableView에서 데이터 변경 전에 현재 스크롤 위치를 저장해야 합니다.
let currentIndexPath = collectionView.indexPathsForVisibleItems.first
  1. 데이터 변경 후에는 변동된 아이템을 DeepDiff로 비교하여 식별합니다.
let changes = diff(old: oldData, new: newData)
  1. 식별된 변경 사항을 이용하여 UI를 업데이트하고, 스크롤 위치를 복원합니다.
collectionView.performBatchUpdates({
    collectionView.reload(changes: changes, section: 0, updateData: { data in
        self.data = data
    })
}, completion: { _ in
    // 이전 스크롤 위치로 스크롤
    if let indexPath = currentIndexPath {
        self.collectionView.scrollToItem(at: indexPath, at: .top, animated: false)
    }
})

위의 코드에서 collectionView.reload(changes:section:updateData:) 함수는 DeepDiff 라이브러리에 포함된 확장 함수로, 변경된 데이터를 기반으로 컬렉션 뷰의 업데이트를 처리합니다. 스크롤 위치를 복원하기 위해 scrollToItem(at:at:animated:) 함수를 사용합니다.

이제 컬렉션 데이터 변경 시 스크롤 위치를 유지할 수 있습니다. DeepDiff를 사용하면 최소한의 리로드만 수행하여 UI 성능을 향상시킬 수 있습니다.

이상으로 Swift DeepDiff를 사용하여 컬렉션 데이터 변경 시 스크롤 위치를 유지하는 방법에 대해 알아보았습니다. 이 기술을 사용하여 사용자 경험을 향상시킬 수 있습니다. 자세한 내용은 DeepDiff GitHub 저장소를 참고하시기 바랍니다.