> For the complete documentation index, see [llms.txt](https://texture-kr.gitbook.io/wiki/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://texture-kr.gitbook.io/wiki/node-containers/ascollectionnode.md).

# ASCollectionNode

`ASCollectionNode` 는 UIKit 의 `UICollectionView` 와 동일하며, `UICollectionView` 대신 사용할 수 있다. `ASCollectionNode` 가 `UICollectionView` 의 필수 메서드를 대체합니다.

```swift
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
```

`cellForItemAt` 은 아래의 두 메서드 중 하나를 선택해 대체할 수 있습니다.

```swift
override func collectionNode(_ collectionNode: ASCollectionNode, nodeForItemAt indexPath: IndexPath) -> ASCellNode
```

또는

```swift
override func collectionNode(_ collectionNode: ASCollectionNode, nodeBlockForItemAt indexPath: IndexPath) -> ASCellNodeBlock
```

> collectionNode 가 모든 Cell 을 동시에 준비하고 보여줄 수 있도록, `nodeBlockForItemAt` 을 사용하는 것이 좋습니다.

NOTE :

* ASCollectionNode 는 Cell 을 reuse 하지 않는다.
* nodeBlock 방식을 선호한다.
* nodeBlock 은 thread-safe 해야 한다.
* ASCellNode는 ASTableNode, ASCollectionNode, ASPagerNode에서 사용할 수 있다.

## Node Block Thread Safety Warning

Node Block 이 thread-safe 해야 하는건 중요합니다.\
그 중 하나는 데이터 모델이 Node Block 외부에서 접근하도록 하는 것입니다.\
그러므로, 블록 내부에서 인덱스를 사용해야 할 일은 거의 없습니다.

아래의 `nodeBlockForItemAt` 를 확인해보세요.

```swift
func collectionNode(_ collectionNode: ASCollectionNode, nodeBlockForItemAt indexPath: IndexPath) -> ASCellNodeBlock {
  guard photoFeed.count > indexPath.row else { return { ASCellNode() } }

  let photoModel = photoFeed[indexPath.row]

  // this may be executed on a background thread - it is important to make sure it is thread safe
  let cellNodeBlock = { () -> ASCellNode in
    let cellNode = PhotoCellNode(photo: photoModel)
    cellNode.delegate = self
    return cellNode
  }

  return cellNodeBlock
}
```

위의 코드에서 Node Block 을 생성하기 전에 외부에서 인덱스로 사진 모델에 접근하는 것을 확인할 수 있습니다.

## UICollectionViewController 를 ASDKViewController 로 대체하기

Texture 는 `UICollectionViewController` 와 동일하지는 않습니다.\
대신 ASDKViewController 의 유연성을 이용해 모든 유형의 UI...ViewController 를 재생성할 수 있습니다.

`ASCollectionNode` 를 `ASDKViewController` 의 -init(node:) 을 사용하여 생성합니다.

```swift
init() {
  flowLayout = UICollectionViewFlowLayout()
  collectionNode = ASCollectionNode(collectionViewLayout: flowLayout)

  super.init(node: collectionNode)

  flowLayout.minimumInteritemSpacing = 1
  flowLayout.minimumLineSpacing = 1
}
```

생성자에ASTableNode, ASPagerNode 등 모든 노드를 사용할 수 있습니다.

## ASCollectionView 에 접근하기

`ASCollectionView` 는 `ASCollectionNode` 를 위해 제거되었습니다.

하지만 `UICollectionView(ASCollectionView)` 의 속성을 변경해야하는 경우에는 접근할 수 있어야 합니다.

> `UICollectionView` 서브 클래스인 `ASCollectionView` 는 여전히 내부에서 사용되고 있습니다. 직접 만들어서는 안 되지만 ASCollectionNode의 .view 속성에 접속해 직접 사용할 수 있습니다. 노드의 뷰 또는 레이어 프로퍼티 각각 -viewDidLoad 또는 -didLoad가 호출된 후에만 접근해야 한다는 점을 잊지 마세요.

아래의 `LocationCollectionNodeController` 는 `viewDidLoad(:)` 에서 직접 ASCollectionView 에 접근합니다.

```swift
// LocationCollectionNodeController.swift

override func viewDidLoad() {
  super.viewDidLoad()

  collectionNode.delegate = self
  collectionNode.dataSource = self
  collectionNode.view.allowsSelection = false
  collectionNode.view.backgroundColor = .white
}
```

## Cell Sizing and Layout

`ASCollectionNode` 와 `ASTableNode` 를 사용하 `ASCellNode` 의 높이를 관리할 필요가 없습니다.

Cell 은 constrained size 에 맞게 커질 것이고, 제공된 UICollectionViewLayout에 의해 배치됩니다.

또한 ASCollectionNode의 `contrentedSizeForItemAt(:)` 를 사용하여 CollectionNode 에서 사용되는 셀의 사이즈를 제한할 수 있습니다.

## Examples

ASCollectionNode Cell Layout 의 가장 자세한 예는 CustomCollectionView 앱 입니다. 이 앱은 ASCollectionNode를 사용하는 Pinterest 스타일의 셀 레이아웃과 사용자 정의 UICollectionViewLayout 을 포함합니다.

**More Sample Apps with ASCollectionNodes**

* [ASDKgram](https://github.com/texturegroup/texture/tree/master/examples/ASDKgram)
* [CatDealsCollectionView](https://github.com/texturegroup/texture/tree/master/examples/CatDealsCollectionView)
* [ASCollectionView](https://github.com/texturegroup/texture/tree/master/examples/ASCollectionView)
* [CustomCollectionView](https://github.com/texturegroup/texture/tree/master/examples/CustomCollectionView)

## UICollectionViewCell 과의 상호 운용성

`ASCollectionNode` 는 기본 `ASCellNode` 와 함께 `UICollectionViewCell` 사용을 지원합니다.

다만, UIKit Cell 은 동일한 ASCollectionNode 내에서 혼합된 경우 ASCellNode 의 성능 이점 (예: preloading, async layout, async drawing) 이 없습니다.

하지만 모든 Cell 을 한꺼번에 변환할 필요 없이 점진적으로 도입하는데 도움을 줍니다.[ 여기](http://texturegroup.org/docs/uicollectionviewinterop.html)서 자세한 정보를 찾아보세요.

## ASCellLayoutMode (<\~ 2.8)

어플리케이션 내에서 Texture를 적용하는데 있어서 융통성을 향상시키기 위해서 제안된 기능입니다.

`ASCellLayuotMode`를 제어함으로서 `ASCollectionNode`가 비동기 레이아웃을 생성하는 동안 `ASCollectionDataSource` 내부적인 기술적 부채문제 및 잠재적인 문제를 디버깅 하거나 해결하는 방향으로 작업이 가능하게 해줍니다.

```swift
let node = ASCollectionNode.init()
node.cellLayoutMode = .alwaysReloadData
```

| Name                           | Default | Description                                                                                                                                                                                                                                                    |
| ------------------------------ | ------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| none                           | -       | 옵션이 설정 되지않고 none 외한 모든 요소 대해서 default값으로 지정되어 사용됩니다.                                                                                                                                                                                                           |
| syncForSmallContent            | -       | 새로운 컨텐츠의 갯수가 적으면 ASDataController가 백그라운드 대기열에서 대기하게 됩니다.                                                                                                                                                                                                       |
| alwaysSync                     | OFF     | <p>ASDataController가 백그라운드 대기열에서 대기하면서 CATransaction 및 frame draw이후에 hierarchy상 있는 셀의 새로운 추가 및 변화가 <strong>동기적</strong>으로 일어납니다.</p><p><em>alwaysSync 또는 alwaysAsync 가 설정되지 않을 경우 데이터소스상 셀이 0개 또는 1개일 경우 동기적으로 기본동작을 하지만 2개 이상의 경우 비동기적으로 동작을 하게 됩니다.</em></p> |
| alwaysAsync                    | OFF     | ASDataController가 백그라운드 대기열에서 대기하면서 CATransaction 및 frame draw이후에 hierarchy상 있는 셀의 새로운 추가 및 변화가 **비동기적으**로 일어납니다.                                                                                                                                              |
| alwaysReloadData               | OFF     | performBatchUpdates사용 하기 보다 reloadData 사용을 선호하는 옵션입니다.                                                                                                                                                                                                         |
| disableRangeController         | OFF     | 해당 플래기그 활성화 되어 있을 경우 셀에 대해서 범위 관리방법이 적용되지 않습니다. (preload, display, visible)                                                                                                                                                                                    |
| serializeNodeCreation          | OFF     | 셀 생성시 Data Controller 내에서 병렬로 수행 되지 않는 경우에 대한 여뷰를 지정합니다.                                                                                                                                                                                                       |
| alwaysBatchUpdateSectionReload | OFF     | 섹션에 대해서 Reload 호출시 performBatchUpdate가 사용되는 옵션입니다. 이 때 alwaysReloadData 가 자동으로 활성화 되고 셀 높이에 대한 애니메이션이 필요한 경우 유용합니다.                                                                                                                                            |