나만의 IOS 앱개발 입문 : IOS개발 강의 흔적 남기기 4일차

박경현·2022년 3월 9일
0

원래 하던거를 마무리 하기전에 TODOLIST정리를 하고 마무리 하려고 한다
이게 조금 더 쉬워서는 절대 아니다ㅋㅋ

TodoList에서 사용한 대표적인 UI인 UITableView에 대한 설명을 하고 적을거다ㅎ

UITableView

데이터들을 목록형태로 보여줄 수 있는 가장 기본적인 UI컴포넌트
UIScrollerController를 상속받고 있어서 스크롤도 기본적으로 가능!!

여러개의 Cell을 가지고 있으며 하나의 열과 여러개의 행을 지니고 있다
수직으로만 스크롤이 가능!

차고로 섹션을 이용해 그룹화 할 수도 있으며 그로인해 콘텐츠를 좀 더 쉽게 탐색할 수 있습니다.
섹션의 헤더와 푸터에 View를 구성하여 추가적인 정보를 표시할 수도 있다

UITableView를 사용하기 위해서는 Delegate, DataSource를 채택해야 사용가능하다

DataSource는 데이터를 받아와서 뷰를 그려주는 역할!!

Delegate는 테이블 뷰의 외곽 즉 보여지는 부분과 동작을 담당한다

차고로 뷰는 Delegate에 의존하여 업데이트 된다
이 두개를 사용하여 사용자에게 어떻게 보여줄지 정한다

Ex) DataSource는 행이 몇개인지 어떤정보를 표시할지
-Delegate는 행의 높이나 행을 눌렀을때 액션을 정한다.

차고로 둘 다 프로토콜이라 optional이 안붙어 있는 함수는 필수로 채택해서 적어줘야한다!!

TodoList 프로젝트 생성 -1

한번 하나씩 전부 다 적어보자
일단 Main storyboard에 navigationcontroller를 설치한다 -> 할 일을 등록해서 보여주는 페이지와 편집 페이지를 나누기 위해서 ...


그 다음에는 기본으로 설정되어있던 rootView를 삭제하고 내 View를 root view Controller로 설정해준다.

그 다음 이제 화면 전환을 하기 위해서 버튼을 두개 만들거다. 1번째는 Edit 즉 편집관련 페이지로 들어가는 버튼이고, 2번째는 Add 즉 등록할때 쓸 버튼이다.

BarButtonItem을 적당한 위치에 추가해주고 그 다음 속성 Inspector부분에 System Item을 Edit으로 바꿔주면 편집할 때 쓰는 버튼이 된다.

추가로 Add도 System Item에 있으니까 BarButtonItem을 가져와서 비슷한 방식으로 설정해두자

그 다음 목록들을 적을 tableView를 중간에 놔두고 constraint를 걸어서 모든 ios기기에 대해 같은 제약을 설정한다

4방향 다 0으로 설정 후 확인 누르면 끝 -> 이거는 정렬과 제약의 차이를 좀 더 공부해보자!

tableView를 클릭하고 Prototype Cells를 추가한다 그러면 Cell이 하나 생성되는데 클릭하고 Cell의 속성에서 Style이 Custom으로 되어있는데 우리는 가장 기본을 사용할 것이기 때문에 Basic으로 바꾼다!

TodoList 프로젝트 생성 -2

이제 기본 설정은 끝났으니까 코드에서 제어할 수 있게 assitant로 연결하자

Edit , Add 버튼은 눌렸을때 각각 액션을 취할 수 있도록 @IBAction으로 놔둔다 ->
꼭 sender를 BarButtonItem으로 놔두자 !!!!

그리고 테이블 뷰도 작성해줘야하니까 @IBOutlet으로 설정한다

tabAddButton이 눌렸을때 alert가 나오게 끔 설정하려고 한다
이럴때는 UIAlertController를 사용해서 창을 띄워주면 된다

코드를 구체적으로 파헤쳐보고 전체적인 흐름에 관해 알아보자 ㅎㅎ

alert라는 상수에 UIAlertController를 설정했다

UIAlertController는 인자가 3개가 있는데
title =>> 화면에 보여주는 거(가장위에)
message ==>> 화면에 보여주는거(title 아래에)
preferredStyle ==> .alert 와 .action이 있다!!

.action이 오른쪽 처럼 화면 아래에 alert를 보여주게 하고
.alert가 화면 중앙에 alert를 보여주게 한다

그 다음에는 alert안에 등록버튼과 취소버튼을 만들려고 하는데 그래서 UIAlertAction을 적었다

registerButton 안에는 UIAlertAction을 받게 했다. 인자가 3개가 있는데
title =>> 버튼이 보여질때 이름을 뜻한다
style =>> .default, .cancel, .destructive가 있다

  • .default는 가장 기본적인 스타일이고 일반적인 버튼에 사용된다
  • .cancel은 아무것도 실행되지 않은 채 메시지 창의 액션이 취소된다는것을 뜻하며, 메세지 창 내에서 한번만 사용할 수 있습니다(두번사용시 오류 뜬다고 함)
  • .destructive는 주의!! 빨강색으로 드럽게 강조하는데 중요한 내용을 변경하게너 삭제해서 되돌릴수없는 결정을 하는 버튼

handler: _ in / handler: nil 등을 적었는데 이 인자는 눌렸을 때 그 다음 실행한 무언가가 있으면 클로저로 작성한다 nil은 아무것도 없을때, __ in은 따로 명칭 적지않고 사용할 때 쓴다

그리고 이 두 ActionButton을 alertController에 추가한다!

alert.addAction(cancelButton) 왼쪽에 취소버튼 보여줘야하니까 애 부터 적었다

결국 tapAddButton이 눌렸을 때 alert가 작동해야하니까 present방식을 사용해서 alert가 보이게 한다

self.present(alert, animated:true, completion:nil)

profile
SW로 문제를 해결하려는 열정만 있는 대학생

0개의 댓글