[RxDataSources] RxDataSources 맛보기

안녕하세요.

 

이번에는 RxDataSources에 대해 알아볼게요.

 

(전체 코드는 여기를 참고해주세요 ^^)

---

 

# RxDataSources란?

이름에서부터 알 수 있듯이, RxDataSources는 RxSwift 용 UITableView와 UICollectionView의 DataSources 관련 라이브러리입니다.

 

 

RxSwift와 RxCocoa만을 사용해서 UITableView를 만든다고 했을 때, 아래 코드는 가장 쉽고 빠르게 구현한 방법일 거예요.

 

 

 

다만, 여러 Section이 존재하는 경우 또는 insert, move, delete 할 때 애니메이션이 들어가야 하는 경우는 처리할 수가 없어요.

 

이때 RxDataSources를 사용하면 쉽게 처리할 수 있다고 합니다ㅎㅎ

 

 

RxDataSources는 크게 아래 4가지 스텝으로 이루어집니다.

1. Item 구조체 생성
2. SectionModelType 프로토콜을 준수하는 Section 구조체 생성
3. dataSource 객체 생성
4. TableView(또는 CollectionView)에 dataSource 등록

 

 

설명은 이쯤 하고.. RxDataSources를 사용해서 TableView를 한번 만들어볼게요.

 

 

 

# 예제

우선 스토리보드로 화면을 만들어줄게요.

 

 

 

Cell에 대응되는 Model(= data 또는 item)가 있어야겠죠?

 

BasicData라는 구조체를 만들어줄게요. (title 프로퍼티는 Cell의 title이 될 예정입니다.)

 

 

 

Section 정보를 담을 SectionOfBasicData라는 구조체를 만들어줄게요.

(header는 Section 헤더이고, items는 Section 안에 있는 item 정보입니다.)

 

 

이때, Section 정보를 가진 구조체(Model)를 RxDataSources에서 사용하려면 SectionModelType 이란 프로토콜을 준수해야 합니다.

 

SectionOfBasicData 구조체를 아래처럼 수정해줄게요.

 

 

 

이로써 Item, Section 관련 구조체 정의는 끝났습니다.

 

이제부터는 ViewController에다가 RxDataSources를 적용해볼게요.

(아래는 깡통 ViewController 코드입니다. 이제부터 여기에 살을 붙여나갈게요!)

 

 

 

section 데이터를 만들어주고,

 

 

 

RxTableViewSectionedReloadDataSource라는 클래스를 사용해서 dataSource 객체를 만들어줄게요. 

 

이때 SectionOfBasicData 타입을 함께 넘겨줘야 합니다.

(RxTableViewSectionedReloadDataSource가 SectionModelType을 준수하는 타입을 제네릭으로 입력받기 때문이죠..)

 

 

 

필요하다면 dataSource에 추가 설정을 해줄 수 있습니다.

• header 설정
• footer 설정
• canEditRow
• canMoveRow

 

 

header를 설정해줄게요.

 

 

 

dataSource 생성 및 추가 설정이 끝났다면, tableView에 binding 시켜주세요.

 

 

 

끝이에요!!!ㅎㅎㅎ

 

 

 

마지막으로 하나만 더 살펴볼게요.

 

이번에는 cell은 움직이지 못하게 설정하고, cell 삭제하는 기능만 넣어볼게요.

 

 

 

 

 

cell 삭제는 잘 된다만.... 뭔가 어색하죠??

 

RxTableViewSectionedReloadDataSource는 애니메이션 처리가 안되어 있다는 단점이 있어요.

 

 

애니메이션 처리를 하고 싶다면 RxTableViewSectionedAnimatedDataSource를 사용해야 합니다.

 

이 부분은 다음 글에서 알아볼게요!!

 

 

 

완성 코드도 첨부해놓을 테니 참고해주시면 되고, 전체 코드는 여기를 참고해주세요.

 

 

 

 

 

 

# 참고

- https://github.com/RxSwiftCommunity/RxDataSources

GitHub - RxSwiftCommunity/RxDataSources: UITableView and UICollectionView Data Sources for RxSwift (sections, animated updates,

 

 

 

---

 

이번 글은 여기서 마무리.