[swift] RxDataSources를 사용한 셀 삭제 및 이동 처리 방법

소개

RxDataSources는 RxSwift와 함께 사용되는 강력한 라이브러리로, UITableView와 UICollectionView를 쉽게 구성하고 업데이트하는데 도움을 줍니다. 이 라이브러리를 사용하면 데이터 소스와 바인딩하여 셀의 삭제 및 이동과 같은 작업을 간단하게 처리할 수 있습니다.

이번 글에서는 RxDataSources를 사용하여 UITableView에서 셀 삭제와 이동을 어떻게 처리할 수 있는지 알아보겠습니다.

셀 삭제 처리하기

먼저, 셀 삭제 작업을 처리하는 방법에 대해 알아보겠습니다. RxDataSources를 사용하면 삭제 작업을 처리하기 위해 EditCommand를 사용할 수 있습니다. EditCommand는 삭제를 나타내는 .delete와 삽입을 나타내는 .insert 두 가지 유형이 있습니다.

다음은 UITableView에서 셀 삭제를 처리하는 방법입니다.

let dataSource = RxTableViewSectionedAnimatedDataSource<SectionModel<String, String>>(
    configureCell: { dataSource, tableView, indexPath, item in
        // 셀 구성 코드
    })

let items = BehaviorSubject<[SectionModel<String, String>]>(value: [])

// 셀 삭제 코드
tableView.rx.itemDeleted
    .map { [unowned self] indexPath in
        self.items.value[indexPath.section].items.remove(at: indexPath.row)
        return self.items.value
    }
    .bind(to: items)
    .disposed(by: disposeBag)

// 셀 표시 코드
items.asObservable()
    .bind(to: tableView.rx.items(dataSource: dataSource))
    .disposed(by: disposeBag)

위의 코드에서 우리는 tableView.rx.itemDeleted 이벤트를 구독하여 셀 삭제를 처리합니다. 삭제한 셀의 indexPath를 통해 데이터 모델에서 해당 아이템을 제거하고 변경된 데이터 모델을 다시 items BehaviorSubject에 전달합니다. 이후 변경된 데이터 모델을 tableView.rx.items로 바인딩하여 새로운 셀 목록을 나타냅니다.

셀 이동 처리하기

셀 이동 작업을 처리하는 방법도 유사합니다. RxDataSources를 사용하면 .move 타입의 EditCommand를 사용하여 셀 이동 작업을 처리할 수 있습니다.

다음은 UITableView에서 셀 이동을 처리하는 방법입니다.

// 셀 이동 코드
tableView.rx.itemMoved
    .subscribe(onNext: { [unowned self] moveEvent in
        self.items.value[moveEvent.sourceIndexPath.section].items
            .swapAt(moveEvent.sourceIndexPath.row, moveEvent.destinationIndexPath.row)
    })
    .disposed(by: disposeBag)

위의 코드에서 우리는 tableView.rx.itemMoved 이벤트를 구독하여 셀 이동을 처리합니다. 이벤트에서 소스 indexPath와 대상 indexPath를 얻어 데이터 모델에서 해당 아이템을 이동시킵니다.

결론

RxDataSources는 UITableView 및 UICollectionView와 같은 데이터 소스를 쉽게 설정하고 업데이트하는데 큰 도움이 될 수 있습니다. 셀 삭제 및 이동 작업도 간편하게 처리할 수 있으며, 위의 예제를 참고하여 사용해 보시기 바랍니다.


참고 자료