hsleedevelop
hsleedevelop
hsleedevelop
  • 분류 전체보기 (22)
    • Develop (22)
      • CS (1)
      • iOS (7)
      • Swift (13)
      • SwiftUI (0)

최근 글

  • Xcode 14 빌드 속도 올리는 방법
    2023.01.29
    Xcode 14 빌드 속도 올리는 방법
  • 스토리보드, XIB Inspectable에 enum 연동하⋯
    2023.01.29
  • M1 ARM-64 Simulator 지원하지 않는 프레임워⋯
    2023.01.07
  • String에 HTML 링크 적용
    2023.01.07
  • Xcode 정의로 이동하지 않고 우측 에디터에서 보는 방법
    2022.11.13
    Xcode 정의로 이동하지 않고 우측 에디터에서 보는 방법

인기 글

  • [iOS][Swift] WiFi AP 목록 스캔 또는 장치⋯
    2022.08.28
  • Figma 자동 익스포트 for Xcode, Android⋯
    2022.08.28
    Figma 자동 익스포트 for Xcode, Android⋯
  • Failed to uninstall gitlab-runne⋯
    2022.09.16
    Failed to uninstall gitlab-runne⋯
  • iOS 메모리 사용량 파헤치기
    2022.09.11
  • Xcode 14 빌드 속도 올리는 방법
    2023.01.29
    Xcode 14 빌드 속도 올리는 방법

태그

  • enum 연동하는 방법
  • 시뮬레이터
  • SVG 다운로드
  • Xcode Build 실행 시 명확하게 표시하는 방법
  • CSS 적용하는 방법
  • xcode 팁
  • Link
  • Xcode 베젤
  • Xcode 정의
  • KingFisher에서 SVG 이미지 다운로드하는 방법
  • Xcode 정의로 이동하지 않고 우측 에디터에서 보는 방법
  • XIB Inspectable
  • SVG download
  • SwiftUI 상에서 HTML 출력과 Link
  • ios localization
  • Simulator
  • Xcode bezel
  • 스위프트
  • Swift
  • Xcode 14 빌드 속도 올리는 방법
  • Kingfisher SVG
  • architecturel
  • html
  • excldue
  • Xcode
  • xcode 꿀팁
  • Xcode Definition
  • Xcode 빌드
  • Jump to definition
  • Xcode Build

최근 댓글

전체 방문자
1,465
오늘
2
어제
2

티스토리

hELLO · Designed By 정상우.
hsleedevelop

hsleedevelop

Advances in Collection View Layout
Develop/Swift

Advances in Collection View Layout

2022. 9. 4. 14:48
반응형

iOS는 기본적으로 'UICollectionView' 흐름 레이아웃과 함께 제공되며, 이는 간단한 경우에 유용합니다.

그러나 사용자 정의 레이아웃을 수행하는 것은 매우 복잡하고 상용구 코드가 필요하고 성능 등에 대해 생각해야 합니다.

 

iOS 13 및 macOS 10.15의 새로운 기능: Compositional Layout

Compositional Layout은 구성 가능하고 유연하며 빠릅니다.

 

작은 레이아웃 그룹(라인 기반, 즉 플로우 레이아웃 사용)을 가져와 함께 더 큰 조각으로 구성하여 작동합니다.

 

iOS, tvOS 및 macOS에서 사용 가능(동일한 API):

UI/NSCollectionViewCompositionalLayout ⭢ NSCollectionLayoutSection ⭢ NSCollectionLayoutGroup ⭢ NSCollectionLayoutItem

NSCollectionLayoutSize – 항목 또는 그룹의 크기(너비 + 높이)를 정의합니다.

.fractionalWidth(0.5) – 컨테이너 너비의 절반

.fractionalHeight(0.5) – 컨테이너 높이의 절반

.absolute(200)

.estimated(200) – iOS에 예상되는 금액을 알려주지만 최종 값은 AutoLayout에서 계산됩니다.

너비와 높이는 모두 컨테이너의 너비 또는 높이에 비례할 수 있습니다.

NSCollectionLayoutItem – 크기, 삽입 등의 정의와 함께 단일 셀 유형의 사양입니다.

NSCollectionLayoutGroup – 레이아웃의 기본 단위, 일반적으로 항목의 일부 행 또는 열

  • 수평, 수직 또는 사용자 정의 가능
  • 정의된 크기를 가지며 많은 항목을 포함합니다.
  • 사용자 지정 그룹에는 NSCollectionLayoutGroupCustomItemProvider가 포함됩니다.
  • 다른 중첩 그룹을 항목으로 포함할 수 있습니다.

NSCollectionLayoutSection – 이전과 같은 컬렉션 보기의 섹션

  • 단일 그룹 포함

UICollectionViewCompositionalLayout – UICollectionView의 레이아웃을 설정하고 전체 보기를 관리합니다.

  • 섹션 또는 섹션 제공자 포함(폐쇄)
  • 섹션 공급자는 섹션 인덱스와 "레이아웃 환경" 개체를 가져와 해당 섹션에 대한 사양을 반환합니다.

NSCollectionLayoutSupplementaryItem – 항목의 배지와 같은 일반 보조 항목

NSCollectionLayoutBoundarySupplementaryItem – 스크롤 시 가장자리에 붙을 수 있는 항목(머리글/바닥글)

  • 섹션 또는 전체 레이아웃에 추가 가능

NSCollectionLayoutDecorationItem – 섹션의 배경에 표시되는 항목

NSCollectionLayoutAnchor – 보조 항목이 포함하는 항목/그룹에 고정되는 방법을 지정합니다.

  • 가장자리(상단, 선행 등) 및 가장자리로부터의 오프셋(분수)을 포함합니다.

추가 및 장식 항목 유형은 layout.register(Klass.self, for…Kind: "background")를 사용하여 등록해야 합니다.

App Store 앱 섹션과 같은 가로 스크롤:

section.orthogonalScrollingBehavior = …

  • continuous – 임의의 위치로 스크롤
  • continuousGroupLeadingBoundary – 그룹 사이에서 중지
  • paging – 컨테이너 너비의 배수에서 멈춤
  • groupPaging – 메인 그룹의 각 항목을 전체적으로 보여줍니다.
  • groupPagingCentered – 위와 같지만 그룹을 중앙에 배치합니다.
반응형

'Develop > Swift' 카테고리의 다른 글

multi-line 문구 localizable.strings 적용 방법  (0) 2022.10.13
UserDefaults 모든 항목 출력, 경로, 리셋  (0) 2022.09.06
Figma 자동 익스포트 for Xcode, Android Studio  (0) 2022.08.28
[iOS][Swift] WiFi AP 목록 스캔 또는 장치 연결  (0) 2022.08.28
Swift 요약 1  (0) 2022.05.08
    'Develop/Swift' 카테고리의 다른 글
    • multi-line 문구 localizable.strings 적용 방법
    • UserDefaults 모든 항목 출력, 경로, 리셋
    • Figma 자동 익스포트 for Xcode, Android Studio
    • [iOS][Swift] WiFi AP 목록 스캔 또는 장치 연결
    Compositional, CompositionalLayout, uicollectionview, 콜렉션뷰
    hsleedevelop
    hsleedevelop
    iOS, Swift js, node js, react c, c++, .net ruby, sql
    댓글쓰기
    다음 글
    UserDefaults 모든 항목 출력, 경로, 리셋
    Figma 자동 익스포트 for Xcode, Android Studio
    이전 글
    Figma 자동 익스포트 for Xcode, Android Studio

    티스토리툴바