iOS/iOS

tableView, collectionView

황민우 2022. 3. 12. 20:30

테이블 뷰 [ tableView ]

- 단일 열에 배열된 행을 사용해 데이터를 표시하는 뷰입니다.

- 아이폰 연락처 목록의 plain과 아이폰 설정 앱 목록인 grouped 두 가지 스타일이 있습니다.

plain/grouped

- 테이블 뷰를 사용하려면 datasource, delegate가 필요합니다.

  • datasource : 테이블 뷰가 테이블을 만들 때 필요한 정보를 제공하고, 테이블 행의 추가/삭제/재 정렬할 때 데이터 모델을 관리합니다.
  • delegate : 화면에 보이는 모습과 행동을 담당합니다.

 

특징

  • UIScrollView를 상속 받고 있다.
  • 목록을 구현할 때 사용하며, 수직 스크롤만 가능하다.
  • 테이블의 개별 항목을 구성하는 cell은 UITableViewCell이다.
  • indexPath값을 통해 cell을 구분한다.
  • 여러 행은 하나의 섹션 안에 구성될 수 있고, 각 섹션은 헤더와 푸터를 가질 수 있다.

 

장점

  1. cell을 재사용할 수 있어, cell을 초기화하는 부담을 줄일 수 있습니다.
  2. 메모리를 절약하여 많은 데이터를 효율적으로 표시할 수 있습니다. (단순 항목 표시에 유용)

 

단점

  1. 디자인적인 요소를 추가하는 부분에서 한계점이 드러납니다.
  2. cell 내부에 뷰를 별도로 추가하여 표시하거나 강제로 섹션을 나누는 작업이 필요합니다.
  3. 표시하려는 cell을 반환하기 전에 cell의 높이를 미리 계산하여 UITableView에 전달해야 합니다.
  4. 성능 향상을 위해 별도의 캐시를 마련해 cell을 관리해야 하는 추가 작업이 필요합니다.

컬렉션 뷰 [ collectionView ]

flow layout을 사용한 collectionView

- 여러 데이터를 관리하고 커스텀 가능한 레이아웃을 사용해서 사용자에게 보여줄 수 있는 객체입니다.

- 컬렉션 뷰를 사용하려면 datasource, delegate가 필요합니다.

  • datasource : 테이블 뷰가 테이블을 만들 때 필요한 정보를 제공하고, 테이블 행의 추가/삭제/재 정렬할 때 데이터 모델을 관리합니다.
  • delegate : 화면에 보이는 모습과 행동을 담당합니다.

 

특징

  • UITableView와 마찬가지로 UIScrollView를 상속받고 있습니다.
  • 컬렉션 뷰는 테이블 뷰에서 할 수 있는 모든 것을 할 수 있습니다.
  • 섹션을 가질 수 있고, indexPath값을 이용하여 cell을 구분합니다.
  • 컬렉션의 개별 항목을 구성하는 cell은 UICollectionViewCell입니다.

테이블 뷰와 컬렉션 뷰의 차이?

 

1, Cell

- 테이블 뷰에서는 하나의 열에 여러 행을 표현하는 방식이기때문에, cell의 모양은 항상 row(행)에 맞춰 디자인합니다.

- 하지만 컬렉션 뷰는 행과 열을 모두 만들 수 있기 때문에 cell의 모양을 자유롭게 디자인할 수 있습니다.

 

2, 레이아웃 객체

- UICollectionViewDelegateFlowLayout 프로토콜을 통해 컬렉션 뷰에서 본인이 원하는 모양으로 레이아웃을 커스텀할 수 있습니다.

- 별도로 레이아웃 서브클래스를 만들지 않고, UICollectionViewDelegateFlowLayout 프로토콜을 사용하는 것으로 그리드 레이아웃을 구현할 수 있습니다.


내용 출처

https://nareunhagae.tistory.com/19?category=1217062 

 

tableView VS collectionView 언제 뭘 사용해야 할까?

여러 개의 cell을 보여줄 때는 주로 자유도가 높아 커스텀하기 좋은 collectionView를 사용한다고 들었는데, 어떨 때 tableView로 구성해야 하는지, 어떨 때 colletionView로 구성해야하는지에 대해 알아보

nareunhagae.tistory.com

https://developer.apple.com/documentation/uikit/uitableview

 

Apple Developer Documentation

 

developer.apple.com

https://developer.apple.com/documentation/uikit/uicollectionview

 

Apple Developer Documentation

 

developer.apple.com