Programming/iOS

[iOS/Swift3.0] iOS TodoList App 만들기 4 (Todo 삭제 기능)

devssun 2017. 9. 27. 23:26
728x90
반응형

Let's make iOS TodoList App (TodoList App 만들기)

그동안 배운 것을 활용해보기 위해 할일을 적고 체크하는 TodoList 앱을 만들어보기로 합니다.

  • 구현 기능

    • Todo List 조회 ✔️
    • Todo 등록 ✔️
    • Todo 삭제
    • Todo 완료 체크
  • 사용할 것

    • Navigation Controller
    • UIBarButtonItem
    • Auto Layout
    • UserDefaults (데이터 영구 저장)
    • UITableView (리스트 출력)
    • UITextField, UITextView (Todo 등록)


지난 시간까지 화면을 구성하고 객체를 연결하고 Todo를 등록하고 조회하는 기능을 구현했습니다

이번에는 Tableview의 editing을 사용하여 Todo를 삭제하는 기능을 구현하겠습니다

삭제는 앞서 했던 과정 중 가장 간단한 과정입니다 😀

  • 삭제는 다음과 같은 프로세스를 가지게 됩니다
    1. Navigation Bar Item - Edit 선택
    2. Tableview Editing Mode 설정
    3. Delete 선택 시 list에서 해당 row remove

1번부터 차근차근 해보겠습니다~! 🔨

지난 시간에 리스트조회 화면(ViewController.swift)에서 Navigation Bar의 Edit버튼을 @IBAction으로 객체를 연결시켜주었습니다 그럼 Edit버튼이 선택되면 테이블 뷰가 editing모드로 들어가도록 하면 됩니다. 또 list가 비어있는 경우는 수정이 불가능 하므로 작동하지 않게 guard 문법을 사용하여 비어있는 경우 editing mode로 들어가지 않도록 합니다

@IBAction func editButtonAction(_ sender: Any) {
        // 리스트 비어있을 때 return
        guard !list.isEmpty else {
            return
        }
        todoListTableView.setEditing(true, animated: true)  // tableview editing 모드
    }

[swift 문법 - guard]

보통 값을 체크할 때 if 문을 많이 사용합니다. 위에서 쓴 예제도 if문으로 쓸 수가 있죠 근데 if문을 많이 사용할 수록 depth가 깊어지고 방해요소가 될 수 있습니다

스위프트에는 guard 문법이 있는데 빠른 종료를 위해 사용한다. 그래서 return, break처럼 종료하는 구문을 반드시 적어줍니다

if let ~~ 으로 적어주었을 때는 if 문 안에서 정의한 변수는 밖에서 사용할 수 없습니다. 하지만 guard let으로 정의해준 변수는 밖에서도 사용할 수 있습니다




이대로 실행을 해볼까요? 그러면 아쉽게도 한번 수정모드에 들어가고 나면 해제를 할 수가 없습니다. 

별도의 버튼을 두고 수정이 끝나면 editing mode를 false로 바꿔줘야합니다. 이걸 하기 위해 새로 bar item을 코드로 만들어주겠습니다


let doneButton = UIBarButtonItem(barButtonSystemItem: .done, target: nil, action: #selector(doneButtonTap))


새로 만든 doneButton은 Edit모드일 때 나타납니다 그래서 editButtonAction(_:)self.navigationItem.leftBarButtonItem = doneButton를 추가하여 bar의 왼쪽에 표시될 아이템으로 설정해주겠습니다.


action의 #selector(doneButtonTap)은 doneButton이 선택되었을 때 실행될 메소드를 적어줍니다 우리는 Done을 누르면 editing mode를 해제하고 Done을 Edit로 바꿔줘야하니 아래와 같이 작성합니다


@objc
func doneButtonTap() {
    self.navigationItem.leftBarButtonItem = editButton
    todoListTableView.setEditing(false, animated: true)
}


@objc가 있는 이유는 Xcode9에서 저게 없으면 자꾸 에러가 나더라구요 저걸 추가하래서 했더니 오류가 사라집니다

그리고 viewdidload에 doneButton에 대한 target과 style을 잡아줍니다

doneButton.style = .plain
doneButton.target = self


마지막으로 삭제한 row는 list에서도 remove해줍니다 또 테이블도 갱신해줘야겠죠

// 수정모드
    func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
        list.remove(at: indexPath.row)
        todoListTableView.reloadData()
    }


그럼 사진처럼 테이블 목록을 삭제하는 기능을 완성하였습니다 삭제하기 위해서는 Edit버튼을 누른뒤 해당하는 row를 왼쪽으로 스와이프하면 Delete 버튼이 나타납니다 






Todo 삭제 기능을 완료하였습니다 👏👏

반응형