UITableVIew 동적으로 추가 / 삭제 하는 방법

안녕하세요. 임대리 입니다. 

 

오늘 하루도 마무리 잘 하셨나요?

 

오늘도 저번에 올렸던 포스팅에 이어 추가적인 작업을 해보려고 합니다. 

 

기능을 개발하다 보면 UITableView에 동적으로 Row를 추가하거나 삭제해야하는 경우가 필요로 합니다. 

 

오늘 저는 아래의 UITableViewDiffableDataSource, NSDiffableDataSourceSnapshot을 사용해서 동작을 구현해 볼 생각입니다. 

 

typealias DataSource = UITableViewDiffableDataSource<Section, Feed>

typealias SnapShot = NSDiffableDataSourceSnapshot<Section, Feed>

 

 

아래의 순서대로 구현 방법을 공유 해볼게요 :) 

 

1. 버튼을 누를 때 마다 첫번째 아이템을 삭제하는 방법

2. 버튼을 누를 때 마다 새로운 row가 추가되는 방법

3. cell의 contents를 업데이트 하는 방법 

 

feedList가 이렇게 있다고 가정해보겠습니다. 

    var feedList: [Feed] = [

        Feed(content: "첫 번째 피드의 내용입니다."),

        Feed(content: "두 번째 피드의 내용입니다."),

        Feed(content: "세 번째 피드의 내용입니다."),

        Feed(content: "네 번째 피드의 내용입니다."),

        Feed(content: "다섯 번째 피드의 내용입니다.")

    ]

 

 

1.  버튼을 누를 때 마다 첫번째 아이템을 삭제하는 방법

주의할 사항 : dataSource에서 snapShot을 가지고 와야 합니다. 그렇게 안하고 새로운 snapShot을 만들어서 apply 했을 경우 새로운 state로 간주되어 기존에 있던 cell이 모두 사라지게 됩니다.

 

 

 

2. 버튼을 누를 때 마다 새로운 row가 추가되는 방법 / cell 데이터 변경

주의할 사항 :  이번에는 dataSource에서 snapShot을 꺼내오면 런타임 오류가 발생합니다. 그 이유는 기존에 있는 아이템과 동일한 아이템들이 append 되기 때문에 Ientifiers가 중복되어 오류가 발생합니다. 

 

이럴 경우에는 새로운 SnapShot을 만들어서 추가를 해줘야 합니다.

 

3. cell의 UI를 업데이트 해야할 경우

reconfigureItems(_:)

Updates the data for the items you specify in the snapshot, preserving the existing cells for the items.

 

- 기존의 cell을 보존하며 사용자가 정의한 스냅샷에 있는 데이터를 업데이트 한다고 합니다.

- 해당 매서드를 호출할 경우 cell의 size도 resizing 된다고 합니다.

reloadSections(_:)

Reloads the data within the specified sections of the snapshot.

 

- 특정 섹션의 여러 아이템들이 UI가 변경이 발생하면 해당 매서드를 호출하는게 좋습니다. 

- 해당 섹션에 정의된 cell들이 새로운 reload 되며 reloadSections 호출시 새로운 cell이 들어와 주소값이 틀려집니다.

 

reloadItems(_:)

Reloads the data within the specified items in the snapshot.

 

- 새로운 cell을 그리며 업데이트를 합니다.

- reloadSections과 마찬가지로 새로운 cell이 그려지는 것을 볼 수 있습니다.

 

3번의 경우 저는 cell 내 컨텐츠 크기가 커지거나 작았을 때 cell 외부에 알려주고 다시 사이즈를 계산할 수 있도록 해주는 용도로 사용했습니다.

 

작은 도움이 되었으면 해서 이렇게 글을 쓰게 되었습니다. 

 

읽어 주셔서 감사합니다.