테이블뷰의 셀을 동적으로 추가, 삭제하는 방법

업데이트: November 02, 2019

테이블뷰의 셀을 동적으로 추가, 삭제하는 방법에 대해 설명하는 글입니다

이 방법이 무조건 좋은 방법이 아니니, 다른 좋은 방법이 있다면 댓글로 알려주시면 감사하겠습니다

이 글은 테이블뷰를 사용하는 방법을 안다는 전제하에 진행됩니다. 링크로 가시면 예제 프로젝트가 있으니 참고해주세요

셀 추가하기

data배열에 새로운 요소를 추가하고, 테이블뷰를 새로고침해줍니다.

주석순서대로 설명하겠습니다.

point는 sender의 좌표계 상의 점을 테이블뷰의 bounds로 변환한 것입니다. 간단하게 말하면, deleteBtnAction을 호출한 delete버튼이 테이블뷰의 어디에 위치했는지 알아내는 것이라고 할 수 있습니다.
- 링크에 convert(_:to:)메서드에 대한 자세한 설명이 있습니다.
indexPath는 1에서 만들었던 point를 가지고 테이블뷰의 indexPath를 찾는 것 입니다. 만약 indexPath를 찾지 못하면 바로 return 해줍니다.

indexPathForRow(at:)

매개변수로 받은 point와 연관된 행 및 섹션을 나타내는 indexPath를 반환합니다. 만약 point가 테이블뷰의 bounds의 범위에서 벗어난다면 nil을 반환합니다.
2에서 찾은 indexPath를 이용해 data[indexPath.row]를 삭제해줍니다.
테이블뷰에서 2에서 찾은 indexPath에 위치한 행을 삭제해줍니다.

deleteRows(at:with:)

테이블뷰에서 매개변수 indexPath배열의 요소에 위치한 행들을 삭제하는 메서드입니다. 행이 삭제될 때 나타나는 애니메이션을 지정해줄 수도 있습니다.