Modern cell configuration
해당 내용은 WWDC 2020 Modern cell Configuration을 정리하는 것
UICollection View는 2020 WWDC에서 데이터를 채우는 방법, 레이아웃을 정의하는 방법, cell을 표시하는 방법에 있어서 새로운 기능을 도입하였다.
이번 Modern cell configuration에서는 view Configuration에 대해 이야기를 해보려고 한다
알아볼 순서
Getting started with configurations
먼저, configuration에 대해서 알아보고 이것을 사용하여 셀을 설정하는 방법에 대해 알아보겠습니다
Configuration state
next, "configuration state"라는 개념에 대해서 알아봅시다. 이 개념은 configuration 와 함께 작동하여 상태별로 다양한 모양을 쉽게 만들 수 있습니다
Background and content configurations
finally, 두 가지 구성 유형인 background configuration과 content configuration에 대해 자세히 알아볼 예정입니다.
이전에 Cell을 정의하는 방법
이전 방법을 통해 해당 파트와 비교해보자
직접적으로 cell에 접근하여 해당 cell의 imageView, textLabel에 값을 넣어줬다
새롭게 도입된 Configuration
configuration 객체를 만들어서 그 객체에 정의를 해주고
그 객체를 cell의 property에 할당해주는 방식으로 사용
근데 솔직히 별 차이 없어 보이는데, 뭐가 좋아진 것인가??
첫번째, configuration을 통해 collection view cell, table view cell에 모두 적용 가능
하나의 configuration을 정의하고 해당 configuration을 collection view cell, table view cell 등 여러 종류의 cell에 활용 가능하다.
심지어 tableView의 footer와 header 같은 view에도 해당 configuration을 적용할 수 있다
이렇게 UITableViewCell에서처럼 모든 기능을 셀 클래스 자체에 내장하는 대신, 이러한 표준 셀 레이아웃과 모양은 이제 이를 지원하는 모든 셀 또는 보기에 바로 연결할 수 있는 독립적인 부분으로 사용할 수 있습니다
두번째, 하나의 View, Cell이 다른 상태에 따라 다른 Configuration을 적용하기 쉽게 해줍니다
위 iPad 앱의 side bar에 cell을 보면 image와 text가 있는 것을 볼 수 있다.
사용자의 상호작용에 따라 각 cell에 다른 configuration을 할당해 준 것이다
그럼 Configuration에 대해서 자세히 알아보자!
Configuration에는 content, styling, metrics, behavior이 있다.
Configuration 자체는 여러 속성을 모아둔 것에 불과해서, 랜더링할 cell, view에 적용하기 전까지는 아무 작업도 하지 않는다.
앞에서 말했듯이, configuration에는 두 가지 configuration이 있는데 그 종류에 대해서 자세히 알아보자!
Background Configuration
여기에는 공통 배경을 빠르게 지정할 수 있는 여러 속성이 있다. 코드 단 몇줄을 통해서 배경 색, 시각적 효과, 획, 둥근 모서리 등을 추가할 수 있다.
List Configuration
현재 사용 중인 익숙한 UITableViewCell 스타일과 마찬가지로 셀, 머리글 및 바닥글에 대한 표준 레이아웃을 제공한다.
하지만, List Content Configuration은 훨씬 더 강력하다. Image, Text 및 Secondary Text를 제공하며 이러한 각각에 대해 사용자 지정이 가능할 수 있도록 많은 속성을 지원한다.
그리고 보다 많은 양의 텍스트를 표시하는 flexible Layout 및 Accessibility text size를 위한 특수 레이아웃 모드와 같은 더 높은 단계의 behaviors를 제공합니다.
공통 디자인 원칙
이 두 configuration 유형은 서로 연계되어 있으며 몇 가지 공통 디자인 원칙을 가지고 있다
가장 중요한 원리 중 하나는
매우 가볍고 생성하는 비용이 별로 들어가지 않는다는 것
이것들은 값 타입으로, 설정할 때 당시의 값에만 영향을 받고, 그 이후 configuration을 cell에 적용하지 전까지는 어떤 영향도 받지 않는다!!
셀을 처음 구성할 때 뿐만 아니라 업데이트하려는 경우에도 적용되는데, configuration을 적용할 때는 이전 configuration이 어땠는지에 대해서 생각할 필요가 없다.
그리고 아래와 같은 특징이 있다
Different appearances for different states
다른 state에 다른 appearance를 적용할 수 있다
Automatic animations and transitions
코드 몇 줄만으로 고급 동작에 액세스할 수 있다. 배경을 바꾸거나 애니메이션을 적용할 수 있다.
Single source of truth
configuration을 쉽게 하는 것 뿐만 아니라, configuration을 활용하면 전체 버그가 제거되며, 복잡한 상태 및 전환을 처리할 때 효율적이다. 현재 적용된 configuration이 항상 참으로써 적용되고 있음을 알면 된다.
Maximum performance
성능 향상을 위해 configuration이 처음부터 구축되며, 원할한 스크롤을 위해 특히 신경쓸 것이다. UIKit 내부에서 랜더링에 있어서 성능 최적화를 이룰 것이다.
그럼 이제 계속해서 나오는 state 개념에 대해서 알아보자!!
Configuration state
보통 App들이 갖게 되는 것들
- Traits (UITraitCollection)
- State(editing, disabled, selected, swiped...)
- Custom state(flagged, viewModel, completed...)
이 세 가지를 Configuration State는 모두 갖고 있을 수 있고 관리할 수 있다.
각 cell은 각각의 Configuration state를 가질 수 있다
Configuration State의 종류
1) View Configuration State
Highlighted, Selected, Disabled, Focused -> bool 타입
Custom State -> 필요한 State의 경우 추가할 수 있음
2) Cell Configuration State
View Configuration State에서 Cell에 해당되는 것이 몇 가지 추가되었다
Editing, Swiped, Expanded, Drag and Drop states
Device의 크기를 전해주는 size class, cell의 활성화 상태, cell 선택 유무 등등 많은 것들이 있다.
Update configuration
업데이트된 configuration을 요청한다고 해도, 원래 configuration은 바뀌지 않는다.
그냥 새로운 configuration이 설정되면, 기존 configuration은 "잠기는" 것으로 생각하면 좋다.
Automatic configuration update
기본적으로 셀에 background 또는 content configuration을 설정하면 cell의 configuration state가 변경될 때마다 업데이트된 상태로 자동적으로 cell에 적용될 수 있도록하는 속성이 바로 이 속성이다
우리는 이 속성을 통해 위 동작을 제어할 수 있다
하지만, 이는 각 state에 대해 기본 style을 가져오는데는 유용하지만, 다른 state에 대한 appearance를 사용자 지정하려고 한다면 automatic update를 할 수 없다. 이는 직접 해주어야 한다.
우리는 collectionView cell이나 tableView cell의 아래 method를 가지고 있다
우리는 이 메서드 내부를 통해서 update하면 된다.
- cell이 처음 보여질 때, state의 변화가 있을 때 이 method가 호출된다.
setNeedsUpdateConfiguration() 메서드를 사용하면 update 시킬 때마다 configuration을 받아와서 적용할 필요가 없다.
Background and Content Configuration
UIContentConfiguration
가장 먼저 알아야되는 프로토콜이다
-
contentView에 대한 기본 스타일 및 content configuration object(컨텐트 구성 객체)에 대한 청사진 제공
-
content configuration은 content view customization을 위해 지원되는 모든 프로퍼티 및 동작을 캡슐화 한다
여기서 나오는 contentConfiguration 프로퍼티가 UIContentConfiguration 타입이다
var content = cell.defaultContentConfiguration()defaultContentConfiguration()이 UIContentConfiguration을 준수하는 어떤 타입을 리턴한다
그것은 바로 UIListContentConfiguration
UIListContentConfiguration
- struct
- list based content view에 대한 content configuration
UIContentConfiguration 프로토콜을 준수하는 타입은 UIListContentConfiguration 밖에 없다
UIBackgroundConfiguration
- struct
- UIContentConfiguration 프로토콜을 준수하지는 않는다
UIContentConfiguration은 contentView에 대한 configuration만 담당하기 때문이다
UIBackgroundConfiguration 을 리턴하는 메서드는 static 메서드들이 많다
reference)
https://unnnyong.me/2020/07/05/wwdc-2020-modern-cell-configuration/
https://zeddios.tistory.com/1206
https://developer.apple.com/videos/play/wwdc2020/10027/
