[ios] 스토리보드 없이 CRUD - Create

스토리보드 없이 CRUD - Create

안녕하세요. 오늘은 저번 포스팅에 이어서 본격적으로 데이터를 추가시켜주는 Create를 만들어보도록 하겠습니다. 이번 포스팅에서는 클로저에 대한 기본적인 이해가 있으셔야 합니다. 다음의 포스팅들을 참고해주시면 많은 도움이 되실 것입니다.

• 스토리보드 없이 CRUD - Setting
• 스토리보드 없이 CRUD - List

클로저

• Closure[01]
• Closure[02]

그럼 본격적으로 시작해보도록 하겠습니다.

---

EditFriendViewController

EditFriendViewController에서는 기본적인 데이터를 편집하는 모든 행위를 할 것입니다. 그 행위들에는 데이터를 추가하는 Create도 해당됩니다. 먼저 이전에 해왔던 것과 마찬가지로 View Controllers 그룹 안에서EditFriendViewController를 xib파일과 함께 만들어줍니다. 그리고 이전의 포스팅들과는 다르게 데이터를 입력하는TextField 역시 테이블 뷰의 셀을 활용해 화면에 보여줄 것입니다.

 

EditFriendViewController

우선 EditFriendViewController.xib파일에 하나의 테이블 뷰를 올려주고 화면을 꽉 채워주게끔 Constraints를 지정합니다. 그리고 EditFriendViewController.swift에서 좌측에는 취소 버튼을 우측에는 저장 버튼을 코드로 추가합니다.

그 다음으로는 테이블 뷰를 사용하기 위한 프로토콜을 준수하고 빈 메소드들을 구현합니다.

1. 2를 반환하는 이유는 두 개의 셀의 TextField를 통해 입력을 받을 것이기 때문입니다.

 

TextFieldCell

이젠 EditFriendViewController에서 데이터를 입력 받기 위해 TextField가 올라가 있는 셀을 만들어보도록 하겠습니다. Cell 그룹 안에서 TextFieldCell이라는 이름으로 UITableViewCell 클래스 파일을 xib와 함께 생성합니다.

그리고 다음과 같이 셀을 디자인해줍니다

TextFieldCell.swift에는 다음과 같이 코드를 작성합니다.

1. selectionStyle = .none 을 하는 이유는 이 셀은 입력만을 위한 셀이기 때문에 탭으로 인한 선택 효과를 주지 않기 위해서 입니다.

 

TextFieldCell Register

이제 만들어진 셀을 EditFriendViewController 에 등록합니다.

그리고 메소드들을 마저 구현합니다. UITextField 변수 두개를 선언한 이유는 아래에서 설명하도록 하겠습니다.

• 우리는 추후 입력된 데이터를 저장하는 메소드에서 셀의 TextField의 text에 접근해야하기 때문에 셀을 만드는 이 메소드 내부에서 미리 TextField에 대한 참조를 가져와야 입력된 데이터에 접근하기에 용이합니다.

 

save

이제 본격적으로 데이터를 저장하는 save()메소드를 구현해보도록 하겠습니다. 저는 이번 예제에서는 클로저를 통해 데이터를 추가해줄 것입니다. 이전의 포스팅한 방법으로는 Delegate를 활용한 방법과 Segue를 활용한 방법을 다룬적이 있습니다.

• Segue를 이용한 Data 전달
• Delegate를 이용한 Data 전달

 

클로저로 데이터를 전달하기 위해서는 우선 EditFriendViewController내에 해당 클로저 변수를 선언해줍니다.

1. 위와 같이 클로저 변수를 선언해주고 EditFriendViewController에서는 호출만 해줍니다. 구현은 EditFriendViewController를 띄우는 MainViewController에서 해주게 됩니다. 명확하게 와닿지 않으시죠? 밑에서 더욱 자세히 다뤄보도록 하겠습니다.
2. guard-let을 통해 데이터의 유효성을 검사합니다. 그리고 이렇게 nameTextField 와 phoneTextField의 변수를 선언하고 참조를 유지하였기 때문에 쉽게 입력된 데이터에 접근할 수 있습니다.

 

EditFriendViewController 호출

이젠 EditFriendViewController를 띄어주고 위에서 언급했듯이 editFriend 클로저를 구현해주어야 합니다. 해당 코드는 MainViewController에서 구현합니다.

1. 먼저 MainViewController의 우측 Bar 버튼에 Target-Action으로 선언한 add 메소드 내부에서 EditFriendViewController를 띄우는 코드를 작성합니다.

2. 그리고 위에서 언급한 editFriend 클로저를 여기서 구현해줍니다. 그 이유는 몇 가지가 있습니다

   1. 데이터들의 배열인 friends에 접근하여 데이터를 추가하고 reload하기 용이
   2. 목적마다 editFriend 클로저를 다르게 구현하기 용이. 현재는 단순히 추가를 위한 클로저이지만 수정을 할 때에는 수정을 위한 editFriend를 코드를 다르게 구현할 수 있습니다. 이는 다음 Update에 관한 포스팅에서 살펴보도록 하겠습니다.

---

마무리

이제 프로그램을 실행시키면 정상적으로 데이터를 입력하고 입력된 데이터를 테이블 뷰를 통해 확인할 수 있습니다. 클로저를 통한 데이터 추가가 많이 헷갈리실 수 있다고 생각합니다. 이를 위해서는 반드시 클로저를 숙지하셔야 보다 쉽게 이해하실 수 있을 것 같습니다.

그럼 다음 포스팅에서는 데이터를 수정하는 Update 부분을 포스팅하도록 하겠습니다. 감사합니다.

Source : github

Next : [ios] 스토리보드 없이 CRUD - Update