인턴하면서 UIcollectionView 다루는 일이 있어서 그냥 공식 문서를 정독하기로 했다.
읽어서 직접 번역한 자료이기 때문에 이해하기 쉽게 의역한 부분이 있다.
https://developer.apple.com/documentation/uikit/uicollectionview
Apple Developer Documentation
developer.apple.com
UICollectionView
커스텀 가능한 레이아웃을 사용하여 정렬된 데이터 아이템들을 관리하고 나타내는 객체
Overview
UI에 collection view를 추가할 때, 개발자의 앱에서 주요한 일은 collection view와 관련된 데이터를 관리하는 것이다. Collection view는 data source 객체에서 데이터를 가져오며, collection view의 dataSource 속성에 이를 저장한다. 개발자의 data source로 UICollectionViewDiffableDataSource 객체를 사용 가능하며, 이는 collection view의 데이터와 UI 업데이트를 쉽고 효율적으로 관리할 수 있게 한다. 대신에, 개발자는 UICollectionViewDataSource 프로토콜을 가져와서 커스텀 data source 객체를 생성할 수도 있다.
Collection view의 데이터는 개별 아이템들로 구성되며, 개발자는 표현을 위해 섹션별로 그룹화 할 수 있다. (UI를 나타낼 때 item들을 그룹으로 관리 가능하다는 뜻인듯) item은 개발자가 나타내고자 하는 데이터의 가장 작은 단위이다. 예를 들어, 사진 앱에서 하나의 item은 하나의 이미지가 된다. Collection view는 cell을 사용하여 item을 화면 상에 띄우며, 이는 개발자의 data source가 설정하고 제공하는 UICollectionViewCell 클래스의 인스턴스이다.
cell과 함께 collection view는 다양한 view의 타입을 사용하여 data를 나타낸다. 예를 들어, 이러한 supplementary view들은 개별 cell과 분리 가능한 section header와 footer가 되고 정보 또한 전달한다. Supplementary view들의 지원은 선택사항이며 collection view의 layout 객체에 정의되어 있고, 이 객체는 이러한 view들의 배치를 정의하는 역할을 맡는다.
개발자의 UI에 UICollectionView를 추가하는 것 외에도, 개발자는 item들의 시각적 표현이 data source 객체의 순서와 일치하는 것을 보장하기 위해 collection view의 메소드들을 사용할 수 있다. UICollectionViewDiffableDataSource 객체는 이러한 고정을 자동으로 관리한다. 만약 커스텀 data source를 사용한다면, 개발자가 collection의 데이터를 추가, 삭제 또는 재배치 할때마다 일치하는 cell을 추가, 삭제 또는 재배치하기 위해 UICollectionView의 메소드를 사용가능하다.
또한 개발자는 선택된 item들을 관리하기 위해 Collection view 객체를 사용 가능하다. 하지만 이 행동을 위해 collection view는 delegate 객체와 함께 사용되어야 한다.
Layout
Layout 객체는 collection view 내용의 시각적 배치를 정의한다. UICollectionViewLayout 클래스의 하위 클래스인 레이아웃 객체는 collection view 안의 모든 cell과 supplementary view의 구성과 위치를 정의한다. Layout 객체가 위치를 정의하지만, 실제로 일치하는 view에 그 정보를 적용하는 것은 아니다. Collection view는 layout 정보를 일치하는 view에 적용하는데 왜냐하면 cell과 supplementary view의 생성은 collection view와 개발자의 data source 객체 사이의 조절을 포함하기 때문이다. (뭔 소린지 모르겠음) layout 객체는 item 데이터 대신에 시각적 정보를 제공하는 것을 제외하면 또 다른 data source의 형태이다.
개발자는 collection view를 생성할 때 layout 객체를 일반적으로 구체화지만, collection view의 layout을 동적으로 변경 가능하다. (Layout 객체는 추상화하여 구현한다는 뜻인듯) layout 객체는 collectionViewLayout 속성에 저장된다. 이 속성을 직접 설정하는 것은 변경 사항에 애니메이션을 주지 않고 layout을 즉시 업데이트한다. 변경 사항에 애니메이션을 주고 싶은 경우, setCollectionViewLayout(_:animated:completion:) 메소드를 호출해야 한다.
상호 작용 가능한 위치 이동—gesture recognizer 또는 touch event를 통해 발생하는—을 생성하기 위해서는 layout 객체를 변경하기 위해 startInteractiveTransition(to:completion:) 메소드를 호출해야 한다. 이 메소드는 중간 Layout 객체를 설치하며, 이동 진행을 추적하기 위해 gesture recognizer 또는 event-handling 코드와 연결된다. (Collection view의 위치나 정렬을 사용자가 조절하기 위한 call back 이라는 뜻인듯) 개발자의 event-handling 코드가 collection view의 위치 이동이 끝났다고 판단하면, 중간 layout 객체를 제거하고 이동이 예정된 타겟 layout 객체를 설치하기 위해 finishInteractiveTransition() 또는 cancelInteractiveTransition() 메소드를 호출한다.
(Collection view의 순서와 위치를 변경할 때 collection view를 바로 수정하는게 아니라 중간 layout 객체에 변경사항을 저장하고 이동이 끝나면 이를 다시 collection view에 적용하는 방식으로 진행된다. 약간 cache 같은 방식으로. 사용자가 collection view의 순서를 변경하기 위해서는 delegate method 호출이 필요하고 여기에서 코드를 작성해야 함)
Cells and Supplementary Views
Collection view의 data source 객체는 item의 내용과 그 내용을 나타내기 위한 view를 동시에 제공한다. Collection view가 내용을 처음 로드할 때, data source에게 각각의 보여지는 item들의 view 제공을 요청한다. Collection view는 data source가 재사용을 위해 표시해둔 view 객체의 queue 또는 리스트를 유지한다. 개발자의 코드에서 새로운 view를 작성하는 대신에, 항상 view를 dequeue 해야한다.
(ios의 재사용 메커니즘을 사용하라는 뜻인듯 하나의 cell에 대한 view는 매번 생성하는게 아니라 일정량, 즉 화면에 보이는 만큼만 만들어두고 나머지는 안보이게 되는 view를 queue에서 dequeue하여 가져와서 재사용하라는 뜻)
view를 dequeue 하기 위한 메소드는 2가지이다. 개발자가 어떤 타입의 view를 요청했는지에 따라 사용하는 메소드가 달라진다.
dequeueReusableCell(withReuseIdentifier:for:)
collection view에서 item의 cell을 가져올 때 사용한다.
dequeueReusable SupplementaryView(ofKind:withReuseIdentifier:for:)
Layout 객체에 의해 요청된 supplementary view를 가져올 때 사용한다.
이 메소드들을 호출하기 전에, cell 또는 view가 존재하지 않는다면 반드시 먼저 collection view에게 상응하는 view를 어떻게 그릴지 알려줘야 한다. 이를 위해서, 개발자는 반드시 collection view와 함께 클래스 또는 nib 파일을 등록해야 한다. 예를 들어, cell을 등록하기 위해서 register(_:forCellWithReuseIdentifier:) 메소드를 사용해야 한다.
(dequeue하기 전에 재사용할 cell이 미리 정의되어 있어야 한다는 뜻)
func register(_ cellClass: AnyClass?, forCellWithReuseIdentifier identifier: String)
클래스를 등록할 때 사용
func register(_ nib: UINib?, forCellWithReuseIdentifier identifier: String)
Nib 파일을 등록할 때 사용
등록 과정의 일부로, 개발자는 view의 목적을 구분하는 reuse identifier를 명시해야 한다. 이는 나중에 view에서 dequeue할 때 사용되는 것과 같은 string이다. (Register 과정에서 cell의 식별자를 설정하는데, 이 식별자를 가지고 나중에 dequeue한다는 뜻)
Data source 메소드에서 적절한 viwe를 dequeue하는 과정이 끝나면, 내용을 설정하고 사용하기 위해서 collection view에게 반환해야 한다. Layout 객체로부터 layout 정보를 가져온 후, collection view는 이를 view에 적용하고 화면에 나타낸다.
Data prefetching
Collection view는 반응성을 높이기 위해 두가지 prefetch 기술을 제공한다.
Cell prefetching
cell이 필요한 시점보다 먼저 일찍 cell을 준비해두는 것이다. Collection view가 동시에 많은 cell을 필요로 하는 경우— 예를 들어, grid layout에서 cell의 새로운 행 등등 —cell들은 화면에 나타낼 때보다 먼저 요청된다. 그러므로 Cell rendering은 여러개의 layout을 통과하며 (뭔 소린지.. 원문: cell rendering is spread across multiple layout passes), 이는 사용자의 스크롤 경험을 더 매끄럽게 만든다. Cell prefetching은 기본으로 설정되어 있다.
Data prefetching
Data prefetching은 cell의 요청보다 먼저 collection의 데이터가 필요하다고 알림받는 방법을 제공한다. 이는 cell의 내용이 네트워크 요청같이 데이터 로딩 과정이 오래 걸리는 경우 유용하다. cell의 데이터를 prefetch 할 때 알림을 받기 위해UICollectionViewDataSourcePrefetching 프로토콜과 일치하는 객체를 prefetchedDatasource 속성에게 배정한다.
Reordering Items Interactively
Collection view는 사용자와 상호작용을 통해서 item들을 움직일 수 있게 한다. 일반적으로, collection view의 item의 순서는 data source에 의해서 정의된다. 사용자에게 item의 순서를 재정렬할 수 있도록 만들면, collection view item과 사용자의 상호작용을 추적하기 위한 gesture recognizer를 설정하고 item의 위치를 업데이트해야 한다. Item의 위치를 상호작용을 통해 재배치하는 것을 시작하기 위해서, collection view의 beginInteractiveMovementForItem(at:) 메소드를 호출한다. 개발자의 gesture recognizer가 터치 이벤트를 추적하는 동안, updateInteractiveMovementTargetPosition(_:) touch location에서 변화를 감지하기 위해 메소드가 호출된다. Gesture 추적이 끝났다면 endInteractiveMovement() 또는 cancelInteractiveMovement() 메소드를 호출하여 상호 작용을 종료하고 collection view를 업데이트한다.
사용자 상호작용 동안, collection view는 item의 현재 위치를 반영하기 위해서 동적으로 layout을 비활성화한다. 만약 개발자가 아무것도 하지 않는다면, 디폴트 layout 동작은 item들을 재배치하는 것이다. 하지만 layout 애니메이션을 커스텀할 수도 있다. 상호 작용이 끝나면 collection view는 data source 객체를 item의 새로운 위치로 업데이트 한다.
UICollectionViewController 클래스는 collection viewd에서 item들을 재배치하기 위한 default gesture recognizer를 제공한다. 이 gesture recognizer를 설치하기 위해서, collection view controller에서 installsStandardGestureForInteractiveMovement 속성을 true로 설정해야 한다.
Interface Builder Attributes
Table 1은 Interface builder에서 collection view를 설정하기 위한 속성의 리스트이다.
| Attribute | Description |
| Items | Prototype cell의 갯수이다. 이 속성은 storyboard에서 설정하기 위해서 특정한 수의 prototype cell을 조절한다. Collection view는 반드시 항상 적어도 한 개의 cell을 가지고 있어야 하며 다른 타입의 내용을 화면에 나타내기 위해서 또는 같은 내용을 다른 방식으로 화면에 보여주기 위해서 여러개의 cell을 가지고 있어야 한다. |
| Layout | 사용하기 위한 Layout 객체이다. UICollectionViewFlowLayout 객체와 개발자가 정의하는 커스텀 layout 객체 중 선택하기 위해 사용한다. Flow layout이 선택된 경우, collection view의 내용을 스크롤하는 방향을 설정 가능하고 header, footer view를 가질지 말지 설정 가능하다. header와 footer view를 활성화하는 것은 storyboard에 재사용 가능한 view를 추가하는 것이며, 이 view에서 header와 footer 내용을 설정 가능하다. 개발자는 이 view를 프로그래밍 방식으로도 생성 가능하다. 커스텀 layout이 선택된 경우, 개발자는 사용하기 위해서 반드시 UICollectionViewFlowLayout 하위 클래스를 명시해야 한다. |
Flow layout이 선택된 경우, collection view의 size inspector는 flow layout의 측정을 설정하기 위해 추가 속성을 포함하게 된다. cell의 사이즈, header와 footer의 사이즈, cell과 cell 사이의 최소 간격, cell이 있는 section의 margin 등을 설정하기 위해 이러한 속성을 사용한다. UICollectionViewFlowLayout을 참고하면 된다.
Internationalization
Collection view는 internationalization에 대응하는 직접적인 컨텐츠가 없다. 대신에, 개발자는 cell과 collection view의 reusable view를 internationalize 가능하다.
Accessibility
Collection view는 accessible을 생성하기 위한 컨텐츠가 없다. 만약 개발자의 cell과 reusable view가 UILabel과 UITextField와 같은 표준 UIKIt 컨트롤을 포함하고 있는 경우, 이러한 컨트롤을 accessible하게 만들 수 있다. (접근 가능하게 즉 반응할 수 있도록 만들 수 있다는 뜻인듯) collection view가 화면 Layout을 바꿀 때, UIAccessibilityLayoutChangeNotification 알림을 보낸다.
register(_:forCellWithReuseIdentifier:)
새로운 Collection view cell을 생성할 때 클래스를 등록
Parameters
cellClass
Collection view안에서 사용하고자 하는 cell의 class
Identifier
특정 클래스와 연결된 재사용 식별자(reuse identifier). 이 파라미터는 nil 또는 빈 문자열(empty string)이 되어서는 안된다.
Discussion
Collection view의 dequeueReusableCell(withReuseIdentifier:for:) 메소드를 호출하기 전에, 반드시 이 메소드 또는 register(_:forCellWithReuseIdentifier:) 메소드를 사용해야 한다. 현재 특정 타입의 cell이 재사용 큐(reuse queue)에 없는 경우에는, collection view는 자동으로 새로운 cell 객체를 생성할 때 제공했던 정보를 사용한다.
만약 이전에 같은 재사용 식별자(reuse identifier)를 사용하여 클래스 또는 nib 파일을 등록했던 경우에는, cellClass 파라미터 안에 있는 클래스는 오래된 것을 대체한다. 개발자는 특정한 재사용 식별자(reuse identifier)로부터 클래스 등록을 해제하고 싶은 경우에는 cellClass에 nil을 대입할 수 있다. (등록할려면 cellClass 안에 클래스, 이전에 등록했던 거를 해제할려면 nil 대입)
UICollectionViewDelegate
Collection view의 item과 상호작용하는 것을 관리하는 객체
Overview
Collection view delegate는 item 선택, highlighting과 이러한 item에 대한 액션을 포함한 collection view의 내용과 사용자 사이의 상호작용을 관리한다. 이 프로토콜의 메소드는 모두 선택사항이다.
Collection view 객체를 설정할 때, delegate 객체를 delegate 속성에 지정해줘야 한다.
Managing selected cells
collectionView(_:didSelectItemAt:)
특정한 경로에 있는 item이 선택되었다고 알려준다.
optional func collectionView(_ collectionView: UICollectionView,
didSelectItemAt indexPath: IndexPath)
Parameteres
collectionView
선택이 바뀌었음을 알려주는 collection view 객체
indexPath
선택된 cell의 index path (행 또는 열)
Discussion
Collection view는 사용자가 성공적으로 collection view의 Item을 선택했을 때 이 메소드를 호출한다. 프로그래밍 방식으로 선택을 설정하면 이 메소드가 호출되지는 않는다.
collectionView(_:didDeselectItemAt:)
특정 경로의 item이 선택 해제되었다고 알려준다.
optional func collectionView(_ collectionView: UICollectionView,
didDeselectItemAt indexPath: IndexPath)
Parameters
collectionView
선택이 바뀌었음을 알려주는 collection view 객체
indexPath
선택이 해제된 cell의 index path (행 또는 열)
Discussion
Collection view는 사용자가 성공적으로 collection view의 item을 선택 해제했을 때 이 메소드를 호출한다. 프로그래밍 방식으로 선택을 해제하면 이 메소드가 호출되지는 않는다.
collectionView(_:didBeginMultipleSelectionInteractionAt:)
사용자가 collection view의 여러 itemt을 선택하기 위해 wo-finger pan gesture (두 손가락 터치)을 사용하기 시작할때 호출된다.
optional func collectionView(_ collectionView: UICollectionView, didBeginMultipleSelectionInteractionAt indexPath: IndexPath)
Parameters
collectionView
이 메소드를 호출하는 collection view
indexPath
사용자가 two-finger pan gesture를 시작하기 위해 터치한 item의 index path
Discussion
이 메소드의 구현은 앱의 UI에서 사용자가 다수의 item을 선택하고 있음을 알려주기에 적합한 곳이다. 예를 들어, 개발자는 Edit 또는 Select 버튼을 Done 버튼으로 대체할 수 있다.
Managing Cell Highlighting
func collectionView(_:didHighlightItemAt)
특정한 경로의 item이 하이라이트 되었다고 알려준다.
optional func collectionView(_ collectionView: UICollectionView,
didHighlightItemAt indexPath: IndexPath)
Parameters
collectionView
Highlight 변화를 알려주는 collection view 객체
IndexPath
하이라이트 된 cell의 index path
Discussion
Collection view는 사용자 상호작용에 대한 반응일 때만 이 메소드를 호출하며, 프로그래밍 방식으로 cell의 하이라이트를 설정하는 경우 호출되지는 않는다.
collectionView(_:didUnhighlightItemAt:)
특정한 경로에 있는 item의 하이라이트를 제거할 때 알려준다.
optional func collectionView(_ collectionView: UICollectionView,
didUnhighlightItemAt indexPath: IndexPath)
Parameters
collectionView
Highlight 변화를 알려주는 collection view 객체
IndexPath
하이라이트가 제거된 cell의 index path
Discussion
Collection view는 사용자 상호작용에 대한 반응일 때만 이 메소드를 호출하며, 프로그래밍 방식으로 cell의 하이라이트를 설정하는 경우 호출되지는 않는다.
(만약에 prefetch가 true로 설정되어 있다면 cell이 보여지기 전보다 미리 만들어지기 때문에 collection view의 cell 설정도 did method가 아닌 여기서 해야한다.)
collectionView(_:willDisplay:forItemAt:)
특정 cell이 collection view에 나타나기 전에 알려준다.
Parameters
collectionView
cell을 추가하는 Collection view 객체
Cell
추가된 cell 객체
indexPath
Cell이 나타나는 data item의 index path
Discussion
Collection view 객체는 cell을 컨텐츠에 추가하기 전에 이 메소드를 호출한다. Cell 추가를 감지하기 위해서 이 메소드를 사용할 수 있으며, 반대로 cell이 나타날 때 cell 자신을 감시할 때에도 사용할 수 있다.
collectionView(_:canEditItemAt:)
특정 item이 수정가능한지 결정한다.
optional func collectionView(_ collectionView: UICollectionView,
canEditItemAt indexPath: IndexPath) -> Bool
Parameters
collectionView
이 정보를 요청하는 collection view 객체
indexPath
Collection view에 아이템이 위치된 index path
Return value
item이 수정 가능: true
item이 수정 불가능: false
Default 값: true
UICollectionViewDataSource
Collection view에게 제공하는 cell과 데이터를 다루기 위해 사용하는 메소드가 있는 프로토콜
Overview
Data source 객체는 collection view안의 데이터를 관리한다. 개발자의 app data model과 vend 정보를 필요한만큼 collection view에게 나타내준다. 또한 cell과 collection를 생성하고 설정한다.
Collection view data source는 반드시 UICollectionViewDataSource 프로토콜을 준수해야한다. 개발자는 data source 객체로 UICollectionViewDiffableDataSource 객체를 사용할 수 있으며, 이 객체는 이미 프로토콜을 준수하고 있다.
대신에, 개발자는 UICollectionViewDataSource 프로토콜을 사용하여 커스텀 data source 객체를 생성할 수 있다. 최소한, 모든 data source 객체는 반드시 collectionView(_:numberOfItemsInSection:) 과 collectionView(_:cellForItemAt:) 메소드를 구현해야 한다. 이러한 메소드들은 collection view 안의 item과 함께 총 item의 갯수를 반환해준다. 프로토콜의 나머지 메소드들은 선택사항이며 collection view가 item을 여러개의 section에 분배하거나 주어진 section에서 header와 footer를 제공하는 경우에만 사용된다.
개발자가 Collection view 객체를 설정할 때, data source를 dataSource 속성에 대입해야 한다.
Getting Item and Section Metrics
collectionView(_:numberOfItemsInSection:)
Data source 객체에게 특정한 section에 몇개의 item이 있는지 물어본다
(즉 이 메소드의 반환값을 사용하여 section안에 몇개의 item을 생성할지 결정. Table view와 같음.)
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
Parameters
collectionView
이 정보를 요청하는 collection view
Section
Collection view에서 section을 구분하는 index 번호. 0부터 시작함. (배열과 동일)
Return value
section안에 있는 item의 갯수Getting Views for Items
collectionView(_:cellForItemAt:)
Data source 객체에게 Collection view안의 cell에 상응하는 특정 item을 요청한다.
func collectionView(_ collectionView: UICollectionView,
cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
Parameters
collectionView
이 정보를 요청하는 collection view
indexPath
item의 위치를 특정하는 Index path
Return value
설정된 cell 객체. 이 메소드를 통해서 nil을 반환해서는 안된다.
Discussion
이 메소드의 구현은 주어진 item에 대한 적절한 cell을 생성하고, 설정하고, 반환하는 역할을 한다. Collection view의 dequeueReusableCell(withReuseIdentifier:for:) 메소드를 호출하고 개발자가 원하는 타입의 cell과 일치하는 재사용 식별자(reuse identifier)를 전달하여 이를 실행할 수 있다. 메소드는 항상 유효한 cell 객체를 반환한다. cell을 수신하자마자, 개발자는 일치하는 item의 data와 상응하는 적절한 속성을 설정해야 하고, 추가적인 필요한 설정을 동작해야 하며, cell을 반환해야 한다.
개발자는 collection view의 bounds 안에 cell의 위치를 설정하지 않아도 된다. Collection view는 layout 객체에게서 제공받은 layout 속성을 사용하여 자동으로 각각의 cell의 위치를 설정한다.
Collection view의 isPrefetchingEnabled가 true로 설정되어 있다면 이 메소드는 cell이 보여지기 전에 미리 호출된다. (중요한듯.. 메소드의 호출 시점이 달라짐) collectionView(_:willDisplay:forItemAt:) 델리게이트 메소드를 사용하여 선택과 같은 시각적 상태를 반영하기 위해서 cell의 모습을 변경할 수 있다.
이 메소드는 반드시 항상 유효한 view 객체를 반환해야 한다.
(nil을 반환해서는 안된다.)
Reordering Items
collectionView(_:canMoveItemAt:)
Data source 객체에게 collection view 안에서 특정 item이 다른 장소로 이동 가능한지 물어본다.
optional func collectionView(_ collectionView: UICollectionView,
canMoveItemAt indexPath: IndexPath) -> Bool
Parameters
collectionView
이 정보를 요청하는 collection view
indexPath
Collection view가 이동하려고 하는 item의 index path
(이동 목적지)
Return value
이동 가능할 때: true
이동 불가능할 때: false
Discussion
이 메소드를 사용하여 collection view안의 Item의 이동을 선택적으로 가능 또는 불가능하게 할 수 있다. 개발자가 이 메소드를 구현하지 않고, collectionView(_:moveItemAt:to:)를 구현하는 경우, collection view는 모든 item들이 항상 재정렬되도록 허용한다. (즉 이 메소드의 return 값이 항상 true일 때와 같음)
collectionView(_:moveItemAt:to:)
Data source 객체에게 새로운 위치로 특정 item을 이동하도록 요청한다.
optional func collectionView(_ collectionView: UICollectionView,
moveItemAt sourceIndexPath: IndexPath,
to destinationIndexPath: IndexPath)
Parameters
collectionView
이동을 알려주는 collection view
sourceIndexPath
item의 원래 있던 index path
destinationIndexPath
item의 새로운 index path
Discussion
개발자는 반드시 collection view안의 item의 순서를 재정렬하기 위해서 이 메소드를 구현해야 한다. 개발자가 이 메소드를 구현하지 않는다면, collection view는 item을 재정렬하기 위한 어떤 시도도 무시하게 된다.
(이 메소드를 구현하지 않으면 사용자가 재정렬 아무리해도 안됨)
item과의 상호작용이 끝나게 되면, collection view는 item의 위치가 바뀌었을 경우 이 메소드를 호출한다. Data structure를 새로운 index path 정보로 업데이트 하기 위해서 이 메소드를 사용한다.
UICollectionViewCell (class)
item이 Collection view의 visible bound일때 하나의 data item이다.
Overview
개발자는 UICollectionViewCell을 그대로 쓰거나 추가 속성과 메소드를 더하기 위해서 이를 상속하여 쓸 수 있다. layout과 cell의 표현은 collection view와 그에 상응하는 Layout 객체에 의해 관리된다.
개발자의 cell의 내용과 모습을 설정하기 위해, 개발자는 contentConfiguration과 backgroundConfiguration을 설정해야 한다. 대체로 contentView 속성의 view에 대한 subview(서브 뷰)로써 data item 내용을 표현하기 위해 필요한 view를 추가한다. cell에 직접적으로 subview를 추가해서는 안된다. Cell은 여러개의 layout을 관리하는데, 이때의 content view는 오직 하나이다. Content view와 함께 cell은 선택된 상태와 선택 해제된 상태를 나타내는 두개의 백그라운드 view를 관리한다.
개발자는 일반적으로 이 클래스의 인스턴스를 직접 생성하지는 않는다. 대신에, cell registration을 사용하여 특정한 cell subclass( 또는 클래스 인스턴스가 포함된 nib file)을 등록한다.개발자가 cell 클래스의 새로운 인스턴스를 원할 때는, 하나를 얻기 위해서 collection view 객체의 dequeueConfiguredReusableCell(using:for:item:) 메소드를 호출한다.
UICollectionViewFlowLayout (class)
각각 section에 대해서 선택적인 header와 footer로 구성된 grid로 item을 배치한다.
Overview
Flow layout은 collection view layout의 한 타입이다. Collection view의 item들은 (스크롤 방향에 따라) 하나의 행에서 또는 하나의 열에서 다음으로 이동하며, 많은 cell을 가진 각각의 행은 일치할 것이다. (Will fit) cell들은 크기가 같거나 다를 수 있다.
Flow layout은 각각 section과 grid의 item, header, footer의 크기를 결정하기 위해 collection view의 델리게이트 객체와 함께 동작한다. Delegate 객체는 UICollectionViewDelegateFlowLayout 프로토콜을 반드시 준수해야 한다. delegate를 사용하는 것은 layout 정보를 동적으로 조절하도록 한다. 예를 들어, delegate 객체를 grid의 item들마다 다른 사이즈로 특정하는 데에 사용할 수 있다. 개발자가 델리게이트를 제공하지 않으면, flow layout은 이 클래스의 속성에 설정된 default 값을 사용한다.
Flow layout은 한 방향과 스크롤 거리의 고정된 거리를 사용하여 컨텐츠를 레이아웃한다. 예를 들어, 세로 스크롤 grid에서는, content의 높이는 grid의 section과 item의 수와 일치하게 동적으로 조절되는 반면에 grid 컨텐츠의 넓이(width)는 그에 상응하는 collection view의 넓이에 제약 사항이 걸린다. (Constrainted) layout 스크롤은 디폴트 값으로 세로 방향이며, scrollDirection 속성을 사용하여 scrolling 방향을 설정할 수 있다.
Flow layout의 각각의 section은 커스텀 header와 footer를 가질 수 있다. header와 footer의 view를 설정하기 위해서는, header와 footer의 사이즈를 0이 되지 않도록 설정해야 한다. 적절한 delegate 메소드들을 구현하거나 headerReferenceSize와 footerReferenceSize 속성에 적절한 값을 대입해야 한다. header와 footer의 사이즈가 0인 경우에는, 그에 상응하는 view가 collection view에 추가되지 않는다.
scrollDirection: 스크롤 방향 설정
minimumLineSpacing: grid에서 line들 간의 간격
Discussion
UICollectionViewDelegateFlowLayout Delegate 객체가 collectionView(_:layout:minimumLineSpacingForSectionAt:) 메소드를 구현하지 않는다면, flow layout은 section의 line 사이의 간격을 설정하기 위해서 이 속성의 값을 사용한다.
세로 스크롤 grid에서, 이 값은 연속된 행 사이의 최소 간격을 의미한다.
가로 스크롤 grid에서, 이 값은 연속된 열 사이의 최소 간격을 의미한다.
이 간격은 header와 첫번째 line 또는 마지막 line과 footer 사이의 간격에 적용되지는 않는다.
이 속성의 default 값은 10.0 이다.
minimumInteritemSpacing: 같은 행 사이에서 item들 간의 간격
Discussion
UICollectionViewDelegateFlowLayout Delegate 객체가 collectionView(_:layout:minimumInteritemSpacingForSectionAt:) 메소드를 구현하지 않는다면, flow layout은 같은 line의 item들 간의 간격을 설정하기 위해서 이 속성의 값을 사용한다.
세로 스크롤 grid에서, 이 값은 같은 행의 item들 사이의 최소 간격을 의미한다.
가로 스크롤 grid에서, 이 값은 같은 열에 있는 item들 사이의 최소 간격을 의미한다.
이 간격은 얼마나 많은 item이 한 줄에 들어갈지 계산하는 데에 사용된다. 하지만 item들의 갯수가 정해진 다음에는, 실제 간격은 상승될 수 있다.
이 속성의 default 값은 10.0이다
UICollectionViewDelegateFlowLayout (protocol)
Grid 기반의 layout을 구현하기 위해서 flow layout 객체와 함께 조절할 수 있도록 하는 메소드들
Overview
이 프로토콜은 item의 크기와 grid에서 item들의 간격을 정의한다. 프로토콜의 모든 메소드들은 선택사항이다. 개발자가 특정 메소드를 구현하지 않는다면, flow layout 델리게이트는 적절한 spacing 정보 (간격 띄우는 정보)를 위해서 원래 가지고 있는 속성의 값을 그대로 사용한다.
UICollectionViewFlowLayout 객체는 collection view 델리게이트 객체가 이 프로토콜을 채택하는 것을 예상한다. 그러므로, 이 프로토콜을 collection view의 delegate 속성이 배정된 객체에서 구현해야 한다.
기본적인 개념은 아무래도 table view와 같을 수 밖에 없는 듯 하다
cell reuse machanism이나 data source, delegate 패턴은 비슷하게 동작해서 크게 어려움 없이 이해하고 사용할 수 있다.
끝
'MOBILE > ios' 카테고리의 다른 글
| [iOS] 화면 전환 method Present(_:)와 stack 메모리 (0) | 2022.12.11 |
|---|---|
| [iOS] coreML 사용하여 multi class classification 모델 생성 및 프로젝트 반입하기 (0) | 2022.11.12 |
| [iOS] SnapKit을 사용하여 AutoLayout constraint 설정하기 (0) | 2022.08.03 |
| [iOS] UIKit 알림창 UIAlertController customizing 하기 (0) | 2022.05.14 |
| [iOS] GCD의 기본: DispatchQueue의 종류와 특성 (0) | 2022.04.25 |