[230227] 스파르타 코딩 클럽 2일차 'View Controller' | TIL

빌드 목표

화면 전환이 원활하게 이루어지는 테이블 뷰를 구현하기 위함이었다.

네이버 웹툰의 느낌을 내보고자 view.backgroundColor = .green 을 활용하여 배경색을 모두 초록색으로 통일했다.

어떠한 웹툰의 이름을 눌렀을 때, 비로그인 상태이기에 접근이 불가한 화면을 띄우고, ID/PW 입력이 가능한 Text Field 2개와

ID/PW찾기, LOG IN은 버튼으로 구현하였다. ID/PW찾기를 누를 경우 3번 화면으로 이동되며 LOG IN 버튼은 구현하지 않았다. (못했다)

iPhone SE2에서도 구동시키기 위해 모든 오브젝트는 구속을 잡아둔 상태이다.

스토리 보드

Table View 내부에 Table View Cell을 넣었다.

나머지는 전부 Label, Button, Text Field로만 이루어져있다.

View Controller를 사용하여 이동할 화면을 달아주었다.

Navigation Controller를 달아 1 -> 2로 이동할 경우 show, 2 -> 3으로 이동할 경우 show detail 방법을 사용했다.

Navigation Controller 내용은 Day 1 게시글에 있어서 이번 게시글에서는 설명하지 않는 것이 좋겠다.

뷰 컨트롤러

View Controller로 새 화면을 불러왔을 때, 만약 새로운 화면이 어플 실행 시 기본 화면이 되고싶다면

해당 View Controller를 클릭하고 우측 상단의 'IS Initial View Controller'를 체크해주면 해당 화면이 기본 화면이 된다.

그리고 새 View Controller를 삽입하였다면 반드시 해야할 일이 있는데

새 View Controller에 대한 Cocoa Touch Class를 생성해야한다는 것이다.

새로운 화면에서 작동하거나 담길 정보들을 보관하기 위한 곳이니 당연한 이치이다.

그럼 이제 방금 만든 Cocoa Touch Class와 스토리보드상의 View Controller를 연결해야한다.

우측 상단 Custom Class에 대해서 어떤 클래스로 이 페이지가 작동하게할건지 Class 이름을 쓰면 된다.

Cocoa Touch Class의 이름을 tableViewController로 생성하였다면 사진처럼 똑같이 입력하면 된다.

코드

ViewController 탭, IDPWViewController라는 이름으로 두 개가 더 있긴 하지만, 어차피 Button, Label, Navigation, BackgroundColor 밖에 들어가있지않다. 결국 메인 화면에 대한 코드만 가지고 왔다.

19~20

= self

이게 뭘까?

해당 내용은 아래 extension과 관련된 것인데, mainTableview의 deligate와 dataSource에 대한 권한을 self로 설정함으로써

스토리보드 1번 화면속의 Table View의 권한이 Class tableVIewController에게 주어지는 것이다.

물론 dataSource도 위임된다.

25~35

extension?

말 그대로 '확장'의 개념이다. tableViewController라는 Class를 확장시킬 때 사용하는데 사용하는 이유는 Class 내부에 전부 넣어버려도 상관없지만 가독성이 현저히 떨어지는 문제가 발생하게된다.

tableview와 관련된 모든 내용을 extension에 넣어둠으로써 기존 class에는 화면 구성을 위한 최소한의 정보만 남게되어 알아보기 쉬워진다.

첫 번째 func는 몇 개의 테이블 뷰를 생성할것인지 묻는 함수인데 return값을 cartoons의 갯수로 주었기 때문에

14번 줄의 만화 갯수가 바뀌어도 해당 갯수에 맞게 변경하여 테이블 뷰를 생성한다. 빈 칸이 생기지 않는다.

두 번째 func는 해당 테이블 뷰 내부에 글자를 담기 위함이었는데 예시로는 웹툰 5개가 있기 때문에 5개의 테이블 뷰가 형성되었고, 해당 내용을 cartoons를 이용해 하나씩 담아내기 위해서이다. let cell을 이용해 cell을 하나 만들고 return cell을 빼먹지 않고 마무리해야한다.

근데 withIdentifier는 도대체 어떻게 지정하는가...

스토리보드에서 table view cell을 클릭해보면 우측 상단에 Identifier 칸이 보인다. 거기에 원하는 이름을 적고 (예시는 myCell)

이제 withIdentifier에 ""를 사용하여 똑같이 적어주면 링크가 된다. 어떤 식별자에 작용할지 정하는거라 똑같이만 적으면 된다.

그리고 나머지 textLabel?.text 이후는 그냥 텍스트 출력을 위한건데 ?는 nil을 염두하라는건데 없으니까 그냥 넘어가도 될 것 같았다.

그리고 반드시 return cell.

2일차 후기

첫 날에 완강을 해버려서 오늘은 그냥 3강을 복습한다는 목적으로, 그리고 익숙해지길 바라는 마음으로 내 마음대로 컬러와 이름, 구성도 바꾸어가며 만들었다. 다 만들고보니 웹툰보다 그냥 내가 좋아하는 KBO 구단들 이름으로 KBO 어플처럼 만들어보는것도 엄청 재미있었을것 같다. 어제는 오늘 정리한 내용들이 머리에 잘 들어오지 않았는데, 오늘 다시 한 번 보면서 따라해보니 굉장히 그냥 스쳐지나간 지식들이 많다는 것을 알게된 것 같다. 혹시 강의를 먼저 더 넣어주지않을까 기대해보는 하루이다.