UITableView를 작업하다가 삭제버튼을 좀 안쪽으로 당겨보고 싶은 생각이 들었습니다.
굳이??? 혹시 그렇게 만들고 싶을 때가 있잖아요~
그리고, 이걸 응용하면, 삭제될 때 다양한 시각적 효과를 넣을수도 있겠단 생각이 들더라구요.
시작하기 전에, 이 방법을 사용하려면, UITableViewCell 을 상속하는 클래스를 하나 만들어야 합니다.
1. 기본 테이블을 만들고 아무 데이터나 넣어 봅니다.
삭제 버튼이 뜨도록 하는 작업 까지는 여기 저기서 많은 자료를 찾아볼 수 있다고 생각해서 자세한 설명은 생략하도록 하겠습니다.
2. UITableViewCell 을 상속하는 클래스를 만듭니다.
프로젝트 네비게이터(Project Navigator, 왼쪽 창에 파일 목록 떠 있는거)에서 오른쪽 버튼 눌러서 New File 누르고 'Objective-C class'를 선택합니다.
그럼 다음과 같은 화면이 뜨는데, Class 이름으로 적당한 이름을 넣고 'next->Create'를 눌러서 클래스를 만듭니다.
3. 기존에 만들어 둔 TableView에서 사용하는 tableViewCell을 지금 만든걸로 바꿔줘야 합니다.
tableView를 만들었다면, 아마도 저런 코드를 쓰지 않았을까 생각이 됩니다.
저는 tCell 이라는 이름으로 클래스를 만들었으므로 저 동그라미 친 부분을 'tCell'로 바꾸어 줄 겁니다.
그리고!!! Header 파일에 새로 만든 클래스를 입력해 줘야 사용 가능하겠지요???
제 경우에는 ViewController.h 에 가서 '#import "tCell.h"' 라는 줄을 입력해 줬습니다.
여기까지 하시면, 정상적으로 컴파일이 되고, 스와이프 했을 때 Delete 버튼도 잘 보여야 됩니다.
4. 이제 삭제 버튼을 왼쪽으로 당겨 봅시다!
tCell.m 파일에서 함수를 하나 만들어 봅시다.
- (void)willTransitionToState:(UITableViewCellStateMask)state; 라는 함수를 작성해 주면 됩니다.
작동 원리는, 삭제 버튼을 보여주라는 명령이 있을 때, 삭제 버튼이 들어있는 View를 찾아서 새로운 뷰로 교체하고 그 안에 삭제 버튼을 도로 집어넣어서 공간을 띄워 주는 것입니다.
위의 코드에서는 왼쪽으로 50 만큼을 띄워 줬어요~
5. 완성된 모습입니다. 생각보다 쉽죠?
[오른쪽으로 부터 애매한 거리만큼 떨어져 있는 삭제 버튼]
