UICollectionView
데이터 항목의 정렬된 컬렉션을 관리하고 커스텀한 레이아웃을 사용해 표시하는 객체
UITableVIew처럼 ScrollView를 상속받고있으며 다양한 레이아웃을 보여줄 때 사용
리스트 형태와 슬라이더 형태 모두 표현 가능하다.
UICollectionView에 표시되는 모든 View는 UICollectionViewReuseableView의 인스턴스여야한다.
UICollectionViewReuseableView는 컬렉션 뷰에서 사용중인 재사용 메커니즘을 지원한다.
매번 새 View를 만드는 대신에 이 View를 재사용해서 성능을 향상시키고 스크롤하는 동안에 성능적인 요소들이 향상되게된다.
이 부분은 tableview와 마찬가지이다.
UICollectionView의 구성요소
Supplemetary View: 섹션에 대한 정보를 표시 (필수는 아님)
Cell: 컬렉션 뷰의 콘텐츠를 표시
Decoration View: 컬렉션 뷰에대한 배경을 꾸밀 때 사용(커스텀한 배경을 구현할 수 있다.)
UICollectionViewLayout
- UICollectionViewController를 구현할 때 필수로 필요함.
- UICollectionView의 아이템 배치및 시각적 스타일을 결정함
- Cell, Supplementary View, Collection View의 바운드, 내부에 있는 Decoration View의 위치를 결정하고, 시각적 상태의 정보를 컬렉션 뷰에 제공함.
UICollectionViewFlowLayout
- UICollectionViewLayout의 한 유형
- 사용할 시 셀을 원하는 형태로 정렬할 수 있다.
- 셀의 선형경로를 배치 최대한 행을따라 많은셀을 배치하고, 새로운 행을 만들어 배치해나간다.
(수평 스크롤, 수직 스크롤 모두 가능)
UICollectionViewFlowLayout의 구성단계.
1. Flow 레이아웃 객체를 작성하고 컬렉션 뷰에 이를 할당한다.
2. 셀의 width, height를 정한다. (반드시 해야한다. 지정하지 않을경우 셀의 넓이와 높이가 0이되어 표시되지 않게됨.)
3. 필요한 경우 셀들 간의 좌우 최소 간격, 위아래 최소 간격을 설정한다.
3. 섹션에 header와 footer가 있다면 이것들의 크기를 지정한다.
5. 레이아웃의 스크롤 방향을 설정한다
Compositional Layout
- 복잡한 UI를 그리는 것이 목표더라도, 각각의 구성요소 자체는 단순해서 단순한 구성요소를 여러가지 방식으로 구성하여 복잡한 UI를 구현한다.
- 이것만드로 모든 레이아웃을 작성 가능하게 한다.
UICollectionViewDataSource
- 컬렉션 뷰로 보여지는 콘텐츠들을 관리하는 객체
- UICollectionViewDataSource Protocol을 준수하여야함.
- Content 관리 및 Content 표시에 필요한 View 생성
//UICollectionViewDataSource Protocol의 주요 메서드
public protocol UICollectionViewDataSource: NSObjectProtocol{
//지정된 섹션에 표시할 셀의 개수를 묻는 메서드
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
{
}
// 컬렉션 뷰의 지정된 위치에 표시할 셀을 요청하는 메서드
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
}
//섹션의 개수를 묻는 메서드
optional func numberOfSections(in collectionView: UICollectionView) -> Int
{
}
}
옵셔널이 아닌 함수들은 필수로 구현해주어야한다.
UICollectionViewDelegate
- 콘텐츠의 표현, 사용자와의 상호작용과 관련된 것들을 관리하는 객체
- 선택요소
- 특정 상황에서 View 동작 custom
CollectionVIew와 관련된 핵심 객체들의 관계
30days - Netflix