UICollectionView

Groot·2022년 8월 24일
0

TIL

목록 보기
40/153
post-thumbnail
post-custom-banner

TIL

🌱 난 오늘 무엇을 공부했을까?

📌 UICollectionView - 공식문서 읽기

  • 데이터 항목의 정렬된 Collection을 관리하고 사용자 지정 가능한 layout을 사용하여 표시하는 개체입니다.

📍 Declaration

@MainActor class UICollectionView : UIScrollView

📍 Overview

  • Collection View를 사용자 인터페이스에 추가할 때 앱의 주요 작업은 해당 Collection View와 연결된 데이터를 관리하는 것입니다.

  • Collection View는 Collection View의 dataSource 속성에 저장된 데이터 소스 개체에서 데이터를 가져옵니다.

  • 데이터 소스의 경우 Collection View의 데이터 및 사용자 인터페이스에 대한 업데이트를 간단하고 효율적으로 관리하는 데 필요한 동작을 제공하는 UICollectionViewDiffableDataSource 개체를 사용할 수 있습니다.

  • 또는 UICollectionViewDataSource 프로토콜을 채택하여 사용자 지정 데이터 소스 개체를 만들 수 있습니다.

  • Collection View의 데이터는 프레젠테이션을 위해 섹션으로 그룹화할 수 있는 개별 항목으로 구성됩니다.

  • 항목은 표시하려는 데이터의 가장 작은 단위입니다.

  • 예를 들어 사진 앱에서 항목은 단일 이미지일 수 있습니다.

  • Collection View는 데이터 소스가 구성하고 제공하는 UICollectionViewCell 클래스의 인스턴스인 셀을 사용하여 화면에 항목을 표시합니다.

    Figure 1 A collection view using the flow layout

  • Collection View는 셀 외에도 다른 유형의 View를 사용하여 데이터를 표시할 수 있습니다.

  • 이러한 추가 View는 개별 셀과 분리되어 있지만 여전히 정보를 전달하는 섹션 머리글 및 바닥글일 수 있습니다.

  • 보조 View에 대한 지원은 선택 사항이며 Collection View의 layout 개체에 의해 정의되며, 이는 해당 View의 배치를 정의하는 역할도 합니다.

  • UICollectionView를 사용자 인터페이스에 포함하는 것 외에도 Collection View의 메서드를 사용하여 항목의 시각적 표현이 데이터 소스 개체의 순서와 일치하는지 확인합니다.

  • UICollectionViewDiffableDataSource 개체는 이 프로세스를 자동으로 관리합니다.

  • 사용자 지정 데이터 소스를 사용하는 경우 Collection에서 데이터를 추가, 삭제 또는 재정렬할 때마다 UICollectionView의 메서드를 사용하여 해당 셀을 삽입, 삭제 및 재정렬합니다.

  • Collection View 개체를 사용하여 선택한 항목을 관리할 수도 있지만 이 동작의 경우 Collection View가 연결된 대리자 개체와 함께 작동합니다.

📍 Layouts

  • layout 개체는 Collection View에서 콘텐츠의 시각적 배열을 정의합니다.
  • UICollectionViewLayout 클래스의 하위 클래스인 layout 객체는 Collection View 내부의 모든 셀과 보조 View의 구성과 위치를 정의합니다.
  • layout 객체는 위치를 정의하지만 실제로 해당 정보를 해당 View에 적용하지 않습니다.
  • Collection View는 셀 및 보조 View를 생성하는 데 Collection View와 데이터 원본 개체 간의 조정이 포함되기 때문에 해당 View에 layout 정보를 적용합니다.
  • 일반적으로 Collection View를 만들 때 layout 개체를 지정하지만 Collection View의 layout을 동적으로 변경할 수도 있습니다.
  • layout 객체는 collectionViewLayout 속성에 저장됩니다.
  • 이 속성을 설정하면 변경 사항에 애니메이션 효과를 주지 않고 layout이 즉시 업데이트됩니다.
  • 변경 사항에 애니메이션 효과를 적용하려면 대신 setCollectionViewLayout(_:animated:completion:) 메서드를 호출하세요.
  • 제스처 인식기 또는 터치 이벤트에 의해 실행되는 실시간 전환을 만들려면 startInteractiveTransition(to:completion:) 메서드를 사용하여 layout 개체를 변경합니다.
  • 이 방법은 전환 진행 상황을 추적하기 위해 제스처 인식기 또는 이벤트 처리 코드와 함께 작동하는 중간 layout 개체를 설치합니다.
  • 이벤트 처리 코드에서 전환이 완료되었다고 판단하면 finishInteractiveTransition() 또는 cancelInteractiveTransition() 메서드를 호출하여 중간 layout 객체를 제거하고 의도한 대상 layout 객체를 설치합니다.

📍 Cells and Supplementary Views

  • Collection View의 데이터 소스 개체는 항목에 대한 콘텐츠와 해당 콘텐츠를 표시하는 데 사용되는 View를 모두 제공합니다.
  • Collection View가 콘텐츠를 처음 로드할 때 데이터 소스에 표시되는 각 항목에 대한 View를 제공하도록 요청합니다.
  • Collection View는 데이터 원본이 재사용을 위해 표시한 View 개체 목록 또는 대기열을 유지 관리합니다.
  • 코드에서 명시적으로 새 View를 만드는 대신 항상 View를 큐에서 빼냅니다.
  • View를 대기열에서 빼는 방법에는 두 가지가 있습니다. 사용하는 View는 요청된 View 유형에 따라 다릅니다.
    • dequeueReusableCell(withReuseIdentifier:for:)을 사용하여 Collection View에서 항목에 대한 셀을 가져옵니다.
    • dequeueReusableSupplementaryView(ofKind:withReuseIdentifier:for:) 메서드를 사용하여 layout 객체에서 요청한 보조 View를 가져옵니다.
  • 이러한 방법 중 하나를 호출하기 전에 해당 View가 아직 없는 경우 해당 View를 만드는 방법을 Collection View에 알려야 합니다.
  • 이를 위해 Collection View에 클래스 또는 nib 파일을 등록해야 합니다.
  • 예를 들어, 셀을 등록할 때 register(_:forCellWithReuseIdentifier:) 메서드를 사용하여 클래스를 등록하거나 register(_:forCellWithReuseIdentifier:) 메서드를 사용하여 nib 파일을 등록합니다.
  • 등록 프로세스의 일부로 View의 목적을 식별하는 reuse identifier를 지정합니다.
  • 이것은 나중에 View를 대기열에서 빼낼 때 사용하는 것과 동일한 문자열입니다.
  • 데이터 소스 메서드에서 적절한 View를 대기열에서 빼낸 후 콘텐츠를 구성하고 사용할 Collection View로 반환합니다.
  • layout 개체에서 layout 정보를 가져온 후 Collection View는 이를 View에 적용하고 표시합니다.

📍 Data Prefetching

  • Collection View는 응답성을 향상시키는 데 사용할 수 있는 두 가지 Prefetching 기술을 제공합니다.

    Cell prefetching는 필요한 시간보다 미리 셀을 준비합니다.
    Collection View에 많은 수의 셀이 동시에 필요한 경우(예: 그리드 layout의 새 셀 행) 표시에 필요한 시간보다 먼저 셀이 요청됩니다.
    따라서 셀 렌더링은 여러 layout 패스에 걸쳐 분산되어 더 부드러운 스크롤 경험을 제공합니다.
    셀 프리페치는 기본적으로 활성화되어 있습니다.

    Data prefetching는 셀에 대한 요청에 앞서 Collection View의 데이터 요구 사항에 대해 알림을 받는 메커니즘을 제공합니다.
    이는 셀의 콘텐츠가 네트워크 요청과 같은 부하가 큰 데이터 로드 프로세스에 의존하는 경우에 유용합니다.
    UICollectionViewDataSourcePrefetching 프로토콜을 준수하는 개체를 prefetchDataSource 속성에 할당하여 셀에 대한 데이터를 미리 가져올 때 알림을 받습니다.

📍 Reordering Items Interactively

  • Collection View를 사용하면 사용자 상호 작용을 기반으로 항목을 이동할 수 있습니다.
  • 일반적으로 Collection View의 항목 순서는 data source에 의해 정의됩니다.
  • 사용자가 항목을 재정렬하도록 허용하면 Collection View 항목과의 사용자 상호 작용을 추적하고 해당 항목의 위치를 업데이트하도록 제스처 인식기를 구성할 수 있습니다.
  • Reordering Items Interactively를 시작하려면 Collection View의 beginInteractiveMovementForItem(at:) 메서드를 호출합니다.
  • 제스처 인식기가 터치 이벤트를 추적하는 동안 updateInteractiveMovementTargetPosition(_:) 메서드를 호출하여 터치 위치의 변경 사항을 보고합니다.
  • 제스처 추적이 완료되면 endInteractiveMovement() 또는 cancelInteractiveMovement() 메서드를 호출하여 상호 작용을 종료하고 Collection View를 업데이트합니다.
  • 사용자 상호 작용 중에 Collection View는 항목의 현재 위치를 반영하도록 layout을 동적으로 무효화합니다.
  • 아무것도 하지 않으면 기본 layout 동작이 항목의 위치를 변경하지만 원하는 경우 layout 애니메이션을 사용자 지정할 수 있습니다.
  • 상호 작용이 완료되면 Collection View에서 항목의 새 위치로 데이터 원본 개체를 업데이트합니다.
  • UICollectionViewController 클래스는 관리되는 Collection View에서 항목을 재정렬하는 데 사용할 수 있는 기본 제스처 인식기를 제공합니다.
  • 이 제스처 인식기를 사용하려면 Collection View 컨트롤러의 installsStandardGestureForInteractiveMovement 속성을 true로 설정하세요.

📍 Interface Builder Attributes

🔗 Items

  • 프로토타입 셀의 수입니다.
  • 이 속성은 스토리보드에서 구성할 지정된 프로토타입 셀 수를 제어합니다.
  • Collection View에는 항상 하나 이상의 셀이 있어야 하며 다른 유형의 콘텐츠를 표시하거나 동일한 콘텐츠를 다른 방식으로 표시하기 위해 여러 셀을 가질 수 있습니다.

🔗 Layout

  • 사용할 layout 개체입니다.
  • 이 컨트롤을 사용하여 UICollectionViewFlowLayout 개체와 사용자가 정의한 사용자 지정 layout 개체 사이에서 선택합니다.
  • Flow layout이 선택되면 Collection View의 콘텐츠에 대한 스크롤 방향과 Flow layout에 머리글 및 바닥글 View가 있는지 여부도 구성할 수 있습니다.
  • 머리글 및 바닥글 View를 활성화하면 머리글 및 바닥글 콘텐츠로 구성할 수 있는 재사용 가능한 View가 스토리보드에 추가됩니다.
  • 프로그래밍 방식으로 이러한 View를 만들 수도 있습니다.
  • 사용자 지정 layout이 선택되면 사용할 UICollectionViewLayout 하위 클래스를 지정해야 합니다.

  • Flow layout을 선택하면 Collection View의 크기 관리자에 Flow layout 메트릭을 구성하기 위한 추가 속성이 포함됩니다.
  • 이러한 속성을 사용하여 셀 크기, 머리글 및 바닥글 크기, 셀 사이의 최소 간격, 셀의 각 섹션 주변 여백을 구성합니다.
  • Flow layout 메트릭의 의미에 대한 자세한 내용은 UICollectionViewFlowLayout을 참조하세요.

📍 Accessibility

  • Collection View에는 액세스할 수 있는 자체 콘텐츠가 없습니다.
  • 셀과 재사용 가능한 View에 UILabel 및 UITextField와 같은 표준 UIKit 컨트롤이 포함된 경우 해당 컨트롤에 액세스할 수 있도록 만들 수 있습니다.
  • Collection View가 화면 layout을 변경하면 UIAccessibilityLayoutChangedNotification 알림을 게시합니다.

UICollectionView - 공식문서

profile
I Am Groot
post-custom-banner

0개의 댓글