Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Updates to CollectionView in iOS14

Updates to CollectionView in iOS14

Gubba Manoj kumar

July 21, 2020
Tweet

Other Decks in Education

Transcript

  1. About Me • Gubba Manoj Kumar • Github: @manoj036 •

    Software Engineer at Mercari JP • Team: Personalization • Joined: October, 2018
  2. CollectionView APIs After iOS 13 Diffable Data Source Compositional Layout

    UICollectionViewCell/ UICollectionViewReusableView Data Layout Presentation
  3. CollectionView APIs iOS 14 Diffable Data Source Compositional Layout UICollectionViewCell/

    UICollectionViewReusableView Data Layout Presentation Section Snapshots List Configuration List Cell View Configuration
  4. CollectionView APIs iOS 14 Diffable Data Source Compositional Layout UICollectionViewCell/

    UICollectionViewReusableView Data Layout Presentation Section Snapshots List Configuration List Cell View Configuration
  5. Section Snapshots struct NSDiffableDataSourceSectionSnapshot<Item: Hashable> { func append(_ items: [ItemIdentifierType],

    to parent: ItemIdentifierType? = nil) func insert(_ items: [ItemIdentifierType], before item: ItemIdentifierType) func insert(_ items: [ItemIdentifierType], after item: ItemIdentifierType) func delete(_ items: [ItemIdentifierType]) func expand(_ items: [ItemIdentifierType]) func collapse(_ items: [ItemIdentifierType]) var items: [ItemIdentifierType] { get } var rootItems: [ItemIdentifierType] { get } func level(of item: ItemIdentifierType) -> Int }
  6. Section Snapshots struct NSDiffableDataSourceSectionSnapshot<Item: Hashable> { func append(_ items: [ItemIdentifierType],

    to parent: ItemIdentifierType? = nil) func insert(_ items: [ItemIdentifierType], before item: ItemIdentifierType) func insert(_ items: [ItemIdentifierType], after item: ItemIdentifierType) func delete(_ items: [ItemIdentifierType]) func expand(_ items: [ItemIdentifierType]) func collapse(_ items: [ItemIdentifierType]) var items: [ItemIdentifierType] { get } var rootItems: [ItemIdentifierType] { get } func level(of item: ItemIdentifierType) -> Int }
  7. Section Snapshots struct NSDiffableDataSourceSectionSnapshot<Item: Hashable> { func append(_ items: [ItemIdentifierType],

    to parent: ItemIdentifierType? = nil) func insert(_ items: [ItemIdentifierType], before item: ItemIdentifierType) func insert(_ items: [ItemIdentifierType], after item: ItemIdentifierType) func delete(_ items: [ItemIdentifierType]) func expand(_ items: [ItemIdentifierType]) func collapse(_ items: [ItemIdentifierType]) var items: [ItemIdentifierType] { get } var rootItems: [ItemIdentifierType] { get } func level(of item: ItemIdentifierType) -> Int }
  8. Reordering Support extension UICollectionViewDiffableDataSource { public struct ReorderingHandlers { public

    var canReorderItem: ((Item) -> Bool)? public var willReorder: ((NSDiffableDataSourceTransaction<Section, Item>) -> Void)? public var didReorder: ((NSDiffableDataSourceTransaction<Section, Item>) -> Void)? } public var reorderingHandlers: ReorderingHandlers }
  9. CollectionView APIs iOS 14 Diffable Data Source Compositional Layout UICollectionViewCell/

    UICollectionViewReusableView Data Layout Presentation Section Snapshots List Configuration List Cell View Configuration
  10. List Configuration • List Layout let configuration = UICollectionLayoutListConfiguration(appearance: .plain)

    layout = UICollectionViewCompositionalLayout.list(using: configuration) • List Section Layout = UICollectionViewCompositionalLayout { (sectionIndex, layoutEnvironment) in . . . let configuration = UICollectionLayoutListConfiguration(appearance: .plain) return NSCollectionLayoutSection.list(using: configuration, layoutEnvironment: layoutEnvironment) }
  11. CollectionView APIs iOS 14 Diffable Data Source Compositional Layout UICollectionViewCell/

    UICollectionViewReusableView Data Layout Presentation Section Snapshots List Configuration List Cell View Configuration
  12. Seperators List Cell • To set the padding on separator,

    • For UITableViewCell, • Separator Inset • For ListCell, • Separator Layout Guide Beta Version ScreenShot
  13. CollectionView APIs iOS 14 Diffable Data Source Compositional Layout UICollectionViewCell/

    UICollectionViewReusableView Data Layout Presentation Section Snapshots List Configuration List Cell View Configuration
  14. Cell Registration • Before: collectionView.register(UICollectionViewCell.self, forCellReuseIdentifier: "CollectionViewCell") let cell =

    collectionViewCell.dequeueReusableCell(withIdentifier: "CollectionViewCell", for: indexPath) as? UICollectionViewCell • After: let cellRegistration = UICollectionView.CellRegistration<UICollectionViewListCell, String> { (cell, indexPath, title) in . . . } let cell = collectionView.dequeueConfiguredReusableCell(using: cellRegistration, for: indexPath, item: “Hello")
  15. View configuration • Before, cell.textLabel?.text = "Title" cell.textLabel?.alignment = .center

    • After, var content = UIListContentConfiguration.cell() content.text = "Title" content.textProperties.alignment = .center cell.contentConfiguration = content