UICollectvionViewLayout

[hcn1519]

https://developer.apple.com/library/archive/documentation/WindowsViews/Conceptual/CollectionViewPGforIOS/CreatingCustomLayouts/CreatingCustomLayouts.html#//apple_ref/doc/uid/TP40012334-CH5-SW1

[hcn1519]

UICollectionViewLayout

Layout을 직접 구현해야 하는 경우

1. Line based breaking layout을 따르지 않는 레이아웃을 구현할 때
2. 스크롤을 여러 방향으로 구현하고 싶을 때
3. 전체 Cell의 위치가 빈번하게 변경되어 기존의 FlowLayout을 수정하는 것이 간단하지 않을 때

UICollectionViewLayout 구현

스크롤 가능한 content 영역을 설정한다. 각각의 cell, view를 적절히 배치하기 위한 attributes 객체를 제공한다.

UnderStanding the Core Layout Process

collectionView는 layout 정보가 필요할 때, lyaout 객체에 그 정보를 요청한다.

정보 요청 시점

• 처음 collectionView를 그릴 때
• collectionView의 사이즈가 변경될 때
• invalidateLayout() 메소드가 호출되었을 때

1. prepare()

최초의 layout 정보(모든 Cell과 View의 frame 정보)에 대해서 계산한다. 해당 메소드가 호출 완료되는 시점까지 content 영역에 대한 사이즈를 제공할 수 있어야 한다.

2. collectionViewContentSize

초기 계산을 기반으로 한 전체 content 영역의 사이즈를 리턴한다. collectionView는 contentSize를 기반으로 스크롤 가능한 영역을 결정하므로, 이 값을 적절히 설정해야 원하는 스크롤 영역을 결정할 수 있다.

3. layoutAttributesForElementsInRect(:)

현재의 스크롤 위치를 기반으로 collectionView는 layoutAttributesForElementsInRect(:)을 통해 특정 rect 영역 안에 있는 Cell과 View를 요청한다.

Creating Layout Attributes

UICollectionViewLayoutAttributes 타입의 인스턴스가 각 Item별로 Layout에 대한 정보를 가진다. 생성해야 하는 Items의 개수가 수천개가 되지 않을 때에는 UICollectionViewLayoutAttributes를 prepare() 단계에서 만드는 것이 가장 좋다. UICollectionViewLayoutAttributes 객체는 캐싱될 수 있고, 캐싱된 객체를 리턴하는 것이 성능적으로 가장 좋다.

다만, 필요에 따라서(prepare()에서 지나치게 많은 Item을 처리해야 할 경우, lazy하게 layout을 계산하는 것이 더 좋을 경우 등)

UICollectionViewLayoutAttributes를 생성할 때에는 최소한 frame에 대한 처리가 있어야 한다.

Providing Layout Attributes for Items in a Given Rectangle

layoutAttributesForElementsInRect(:)의 목적은 collectionView가 특정 Rect 영역에 대해서 정보를 요청할 때, 이 영역과 겹치는 모든 Cell과 View의 LayoutAttributes를 제공하는 것이다. CollectionView는 현재 화면에 보이는 content 영역에 대한 Rect를 요청한다.

1. prepare()에서 생성된 LayoutAttributes를 탐색한다.
2. LayoutAttributes의 frame 중에서 layoutAttributesForElementsInRect(:)에서 파라미터로 넘어오는 rect와 겹치는 것들을 추출한다.
3. 각각의 겹치는 LayoutAttributes를 리턴하고자 하는 array에 추가한다.
4. 해당 array를 리턴한다.

layoutAttributesForElementsInRect(:)에서 매번 새로운 layoutAttributes를 매번 생성하는 것은 비용이 큰 작업이다. 되도록이면 캐싱하는 것이 좋다.

Providing Layout Attributes On Demand

collectionView는 각각의 item들의 layoutAttributes에 대해서 주기적으로 layout 객체에 요청한다. 예를 들어서 collectionView가 insert/delete 동작을 수행할 때, 각각의 item에 대한 정보를 요청한다. 이 때, layout 객체는 각각의 Cell과 View에 대해서 적절한 정보를 준비하고 있어야 한다.

layoutAttributesForItemAtIndexPath(:)를 오버라이딩하여

[hcn1519]

UICollectionViewLayout

이번 글에서는 UICollectionView의 Custom Layout을 그리는 과정과 방법에 대해 알아보고자 합니다.

Content

1. UICollectionView와 Layout 객체의 관계
   • UICollectionViewDelegateFlowLayout
   • UICollectionViewFlowLayout
   • UICollectionViewLayout
2. UICollectionViewLayout 구현
   • UICollectionView의 Layout 메소드 콜 프로세스(Core)
   • UICollectionViewLayoutAttributes
   • insert/delete 처리

Hello

UICollectionView는 UICollectionViewDataSource을 통해

FlowLayout 객체를 통해서 화면에 Cell을 그립니다.

Layout을 직접 구현해야 하는 경우

1. Line based breaking layout을 따르지 않는 레이아웃을 구현할 때
2. 스크롤을 여러 방향으로 구현하고 싶을 때
3. 전체 Cell의 위치가 빈번하게 변경되어 기존의 FlowLayout을 수정하는 것이 간단하지 않을 때

UICollectionViewLayout 구현

스크롤 가능한 content 영역을 설정한다. 각각의 cell, view를 적절히 배치하기 위한 attributes 객체를 제공한다.

UnderStanding the Core Layout Process

collectionView는 layout 정보가 필요할 때, lyaout 객체에 그 정보를 요청한다.

정보 요청 시점

• 처음 collectionView를 그릴 때
• collectionView의 사이즈가 변경될 때
• invalidateLayout() 메소드가 호출되었을 때

1. prepare()

최초의 layout 정보(모든 Cell과 View의 frame 정보)에 대해서 계산한다. 해당 메소드가 호출 완료되는 시점까지 content 영역에 대한 사이즈를 제공할 수 있어야 한다.

2. collectionViewContentSize

초기 계산을 기반으로 한 전체 content 영역의 사이즈를 리턴한다. collectionView는 contentSize를 기반으로 스크롤 가능한 영역을 결정하므로, 이 값을 적절히 설정해야 원하는 스크롤 영역을 결정할 수 있다.

3. layoutAttributesForElementsInRect(:)

현재의 스크롤 위치를 기반으로 collectionView는 layoutAttributesForElementsInRect(:)을 통해 특정 rect 영역 안에 있는 Cell과 View를 요청한다.

Creating Layout Attributes

UICollectionViewLayoutAttributes 타입의 인스턴스가 각 Item별로 Layout에 대한 정보를 가진다. 생성해야 하는 Items의 개수가 수천개가 되지 않을 때에는 UICollectionViewLayoutAttributes를 prepare() 단계에서 만드는 것이 가장 좋다. UICollectionViewLayoutAttributes 객체는 캐싱될 수 있고, 캐싱된 객체를 리턴하는 것이 성능적으로 가장 좋다.

다만, 필요에 따라서(prepare()에서 지나치게 많은 Item을 처리해야 할 경우, lazy하게 layout을 계산하는 것이 더 좋을 경우 등)

UICollectionViewLayoutAttributes를 생성할 때에는 최소한 frame에 대한 처리가 있어야 한다.

Providing Layout Attributes for Items in a Given Rectangle

layoutAttributesForElementsInRect(:)의 목적은 collectionView가 특정 Rect 영역에 대해서 정보를 요청할 때, 이 영역과 겹치는 모든 Cell과 View의 LayoutAttributes를 제공하는 것이다. CollectionView는 현재 화면에 보이는 content 영역에 대한 Rect를 요청한다.

1. prepare()에서 생성된 LayoutAttributes를 탐색한다.
2. LayoutAttributes의 frame 중에서 layoutAttributesForElementsInRect(:)에서 파라미터로 넘어오는 rect와 겹치는 것들을 추출한다.
3. 각각의 겹치는 LayoutAttributes를 리턴하고자 하는 array에 추가한다.
4. 해당 array를 리턴한다.

layoutAttributesForElementsInRect(:)에서 매번 새로운 layoutAttributes를 매번 생성하는 것은 비용이 큰 작업이다. 되도록이면 캐싱하는 것이 좋다.

Providing Layout Attributes On Demand

collectionView는 주기적으로 각각의 item들의 layoutAttributes를 layout 객체에 요청한다. 예를 들어서 collectionView는 insert/delete 동작을 수행할 때, 각각의 item에 대한 layoutAttributes를 layout에 요청한다. 이 때, layout 객체는 반드시 각각의 Cell과 View에 대해서 적절한 정보를 준비하고 있어야 한다.

collectionView는 layoutAttributesForItemAtIndexPath(:) 메소드를 통해 필요한 item의 layoutAttributes를 요청하므로, 해당 메소드를 오버라이딩하여 적절한 UICollectionViewLayoutAttributes 객체를 리턴해주어야 한다.

Making Your Custom Layouts More Engaging