[iOS] 쌩 뷰컨트롤러에서 테이블 뷰 띄우기

안녕하세요, HoonIOS입니다. :)

 

이번에는 테이블 뷰 컨트롤러를 만들지 않고 일반 뷰 컨트롤러에서 테이블 뷰를 구현해 주겠습니다. :)

 

처음에는 테이블 뷰컨트롤러를 쓰면 되지 굳이 테이블 뷰로 구현해줘야 되나? 그런 생각을 했었는데요 테이블 뷰 컨트롤러는 테이블 뷰를 만들 때 처리해야 되는 많은 것이 구현되어 있어 편안하게 사용을 했지만 단점이 두가지 있습니다.

1. 루트 뷰 자체가 테이블 뷰로 설정되어 있어 테이블 뷰 위나 아래에 컬랙션 뷰를 넣거나 UI를 추가해주고 싶은데 이런 부분에서 제약이 있습니다.
2. 즉 테이블 뷰 컨트롤러 위아래에 뷰를 추가하는 것은 되지만 여러 요구사항을 받아들이기는 힘든 부분이 있습니다.

그럼 간단하게 기본 뷰 컨트롤러 위해 테이블 뷰를 구현해보겠습니다.

 

 테이블 뷰 구현하기

 

제일 먼저 스토리보드에서 구현을 해줘야 하는데요, 라이브러리에서 테이블 뷰를 가져와 스토리보드의 뷰 컨트롤러에 추가를 해줍니다.

 

여기서 그냥 올려놓고 땡이 아니라 테이블 뷰 크기를 원하는 크기만큼 구현을 해주면 되는데 저는 여기서 뷰 컨트롤러 위에 꽉 차게 구현을 해주겠습니다.

 

음 뭔가 모양이 이상하죠, 약간 팥 없는 찐빵 같다고 해야 될까.... 이 형태는 진짜 테이블 뷰만 가져다 놓은 것이기 때문에 테이블 뷰 셀이 포함되어 있지 않습니다.

 

테이블 뷰 컨트롤러와 달리 테이블 뷰 셀을 직접 추가해줘야 합니다.

 

* 설명

• 오브젝트 라이브러리에서 Table View Cell을 찾아서 해당 테이블 뷰에 넣어줘야 합니다. 
• 넣어주게 되면 테이블 뷰 셀은 알아서 프로토타입 셀로 바뀌어서 추가가 됩니다.

기본적인 프로토타입 셀 설정을 아래와 같이 해줍니다.

* 설명

• 이 설정은 셀 스타일을 textLabel이 하나 있는 스타일로 해준 것이고 식별자로 cell로 구현해준 것입니다.

화면의 델리게이트, 데이터 소스를 구현하기 위해서 viewController파일에 가겠습니다.

* 코드 설명

• 만약 두 프로토콜을 선언받지 못했으면 이 뷰 컨트롤러는 테이블 뷰 컨트롤러의 메서드를 사용하지 못하므로 꼭 선언을 해줘야 하는 필수 프로토콜입니다.
  ( 테이블 뷰 컨트롤러에서는 이미 delegate와 datasource를 받아 구현되어 있지만 여기서는 뷰 컨트롤러를 받았으므로 2개의 프로토콜을 구현해야 합니다. )
• 여기서 Datasource 구현해준 부분에 에러가 났는데요, 이 부분은 UITableViewDataSource 프로토콜에서의 필수 메서드를 구현해주지 않았기 때문에 구현해주면 사라지는 에러이므로 신경 안 쓰셔도 됩니다.

이제는 필수 메서드를 구현해보겠습니다. 아니 아니 그전에 까먹은 게 있습니다. 델리게이트랑 데이터 소스를 나한테 불러달라고 손을 흔드느것을 까먹었네요 ㅠㅠㅠ

 

그다음 해당 컨트롤러는 UIViewController로 세팅이 되어 있기 때문에 UITableView도 세팅을 해줘야 합니다.

 

이제 델리게이트, 데이터소스 메서드 작성을 위한 준비 운동이 모두 끝났네요

이제 필수 메서드를 구현해 주겠습니다.

 

* 코드 설명

• 여기서 특이한 점은 tableViewController에서 델리게이트, 데이터 소스 메서드를 구현해줄 때  override를 붙여줬었지만 테이블 뷰에서 구현을 할 때는 붙여줄 필요가 없다는 것입니다.
  
  그 이유가 뭘까요?
  tableViewController를 사용할 때는 이 메서드들을 한번 더미상태( 안에 빈 데이터 깡통 상태 )로 구현을 해줬기 때문에 이 메서드를 사용할때는 재정의를 해줘야 하지만 테이블 뷰에서는 이 메서드를 구현해놓지 않기 때문에 테이블 뷰에서는 직접 처음 구현을 하는 것이므로 override를 하면 오류가 발생합니다.
• 이 정도 코드는 테이블 뷰 컨트롤러 포스팅에서 다 설명을 했으니 넘어가겠습니다. 혹시 잘 모르시면 다시 읽고 오시는 것을 추천드립니다. :)
  <테이블 뷰 컨트롤러 구현하기(1/2)>

델리게이트 메서드로는 간단하게 몇 번째 줄인 지 출력을 해주는 것으로 구현을 해줬습니다.

 

이제 한번 컴파일시켜서 잘 나타나는지 확인해보겠습니다.

 

잘 되네요!! ㅎㅎ 이렇게 컬랙션 뷰랑 콜라보를 하거나 특정 위치에서만 테이블 뷰를 표현할 때 많이 사용하니 잘 이해하시는 게 중요합니다. 뭐 사실상 테이블 뷰 컨트롤러를 모두 이해하셨으면 충분히 넘어가실 수 있는 내용인 것 같습니다. :)