Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

2

Share

Download to read offline

UICollectionView — Александр Зимин

Download to read offline

UICollectionView
CocoaHeads Moscow 30 января

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

UICollectionView — Александр Зимин

  1. 1. UICollectionView Зимин Александр iOS разработчик UX дизайнер
  2. 2. Что будет сегодня 2
  3. 3. Что будет сегодня 2 • Что такое collection view
  4. 4. Что будет сегодня 2 • Что такое collection view • Базовое устройство
  5. 5. Что будет сегодня 2 • Что такое collection view • Базовое устройство • Ячейки
  6. 6. Что будет сегодня 2 • Что такое collection view • Базовое устройство • Ячейки • Протоколы collection view
  7. 7. Что будет сегодня 2 • Что такое collection view • Базовое устройство • Ячейки • Протоколы collection view • Layout у collection view
  8. 8. Чего не будет 3
  9. 9. Чего не будет 3 • Редактирование контента
  10. 10. Чего не будет 3 • Редактирование контента • Смена layout у collection view
  11. 11. Чего не будет 3 • Редактирование контента • Смена layout у collection view • Custom layout attributes
  12. 12. Чего не будет 3 • Редактирование контента • Смена layout у collection view • Custom layout attributes • UIDynamics
  13. 13. UICollectionView 4 4
  14. 14. 5 5 UICollectionView
  15. 15. Основные понятия 6
  16. 16. Основные понятия 6 • UICollectionView
  17. 17. Основные понятия 6 • UICollectionView • UICollectionReusableView
  18. 18. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell
  19. 19. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell • Supplementary Views
  20. 20. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell • Supplementary Views • Decoration View
  21. 21. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell • Supplementary Views • Decoration View • UICollectionViewLayout
  22. 22. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell • Supplementary Views • Decoration View • UICollectionViewLayout • UICollectionViewLayoutAttributes
  23. 23. Основные понятия 6 • UICollectionView • UICollectionReusableView • UICollectionViewCell • Supplementary Views • Decoration View • UICollectionViewLayout • UICollectionViewLayoutAttributes • UICollectionViewFlowLayout
  24. 24. Supplementary и Decoration view 7
  25. 25. Supplementary и Decoration view 7 • Supplementary Views:
  26. 26. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации
  27. 27. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view
  28. 28. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип:
  29. 29. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип: • UICollectionElementKindSectionHeader
  30. 30. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип: • UICollectionElementKindSectionHeader • UICollectionElementKindSectionFooter
  31. 31. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип: • UICollectionElementKindSectionHeader • UICollectionElementKindSectionFooter • Decoration View:
  32. 32. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип: • UICollectionElementKindSectionHeader • UICollectionElementKindSectionFooter • Decoration View: • Используется для декораций
  33. 33. Supplementary и Decoration view 7 • Supplementary Views: • Для презентации дополнительной информации • Некая аналогия header/footed view на table view • Имеют тип: • UICollectionElementKindSectionHeader • UICollectionElementKindSectionFooter • Decoration View: • Используется для декораций • Задается внутри layout у collection view
  34. 34. Источник данных UICollectionViewDataSource 8
  35. 35. Источник данных UICollectionViewDataSource 8 • Количество секций (О)
  36. 36. Источник данных UICollectionViewDataSource 8 • Количество секций (О) • Количество элементов в секции
  37. 37. Источник данных UICollectionViewDataSource 8 • Количество секций (О) • Количество элементов в секции • Ячейка для текущего элемента
  38. 38. Источник данных UICollectionViewDataSource 8 • Количество секций (О) • Количество элементов в секции • Ячейка для текущего элемента • Дополнительный (supplementary) вид для текущего элемента (О)
  39. 39. UICollectionReusableView 9
  40. 40. UICollectionReusableView 9 • Метод переиспользования
  41. 41. UICollectionReusableView 9 • Метод переиспользования • Идентификатор переиспользования
  42. 42. UICollectionReusableView 9 • Метод переиспользования • Идентификатор переиспользования • Методы для layout
  43. 43. UICollectionViewCell 10 Nil Nil
  44. 44. UICollectionViewCell 11
  45. 45. UICollectionViewCell 11 • var selected: Bool
  46. 46. UICollectionViewCell 11 • var selected: Bool • var highlighted: Bool
  47. 47. UICollectionViewDelegate 12
  48. 48. UICollectionViewDelegate 12 • Методы выделения и нажатия на ячейки
  49. 49. UICollectionViewDelegate 12 • Методы выделения и нажатия на ячейки • Методы отображения ячеек и дополнительных видов
  50. 50. UICollectionViewDelegate 12 • Методы выделения и нажатия на ячейки • Методы отображения ячеек и дополнительных видов • Методы вспомогательного меню
  51. 51. UICollectionViewDelegate 12 • Методы выделения и нажатия на ячейки • Методы отображения ячеек и дополнительных видов • Методы вспомогательного меню • Метод для смены layout у коллекции
  52. 52. Layout 13
  53. 53. Layout 13 • UICollectionViewDelegateFlowLayout
  54. 54. Layout 13 • UICollectionViewDelegateFlowLayout • UICollectionViewLayout
  55. 55. Layout 13 • UICollectionViewDelegateFlowLayout • UICollectionViewLayout • UICollectionViewFlowLayout
  56. 56. Layout 14
  57. 57. UICollectionViewDelegateFlowLayout 15
  58. 58. UICollectionViewDelegateFlowLayout 15 • Имеет базовый набор методов выравнивания
  59. 59. UICollectionViewDelegateFlowLayout 15 • Имеет базовый набор методов выравнивания • Размер ячейки
  60. 60. UICollectionViewDelegateFlowLayout 15 • Имеет базовый набор методов выравнивания • Размер ячейки • Отступы для секции
  61. 61. UICollectionViewDelegateFlowLayout 15 • Имеет базовый набор методов выравнивания • Размер ячейки • Отступы для секции • Минимальные отступы между ячейками
  62. 62. UICollectionViewDelegateFlowLayout 15 • Имеет базовый набор методов выравнивания • Размер ячейки • Отступы для секции • Минимальные отступы между ячейками • Размер дополнительного вида
  63. 63. Размер ячейки 16
  64. 64. Отступы для секции 17
  65. 65. Минимальные отступы между ячейками 18
  66. 66. Custom layouts 19
  67. 67. Custom layouts 19 • Процесс создания полностью своей логики расположения элементов
  68. 68. Custom layouts 19 • Процесс создания полностью своей логики расположения элементов • Свой размер collection view
  69. 69. Custom layouts 19 • Процесс создания полностью своей логики расположения элементов • Свой размер collection view • Может быть прокрутка в оба направления
  70. 70. Custom layouts 19 • Процесс создания полностью своей логики расположения элементов • Свой размер collection view • Может быть прокрутка в оба направления • Внешнее представление каждого элемента задается через UICollectionViewLayoutAttributes
  71. 71. Как это работает? 20
  72. 72. Как это работает? 20 • Вызывается invalidateLayout()
  73. 73. Как это работает? 20 • Вызывается invalidateLayout() • Срабатывает когда вы вызываете его руками или это делает collection view
  74. 74. Как это работает? 20 • Вызывается invalidateLayout() • Срабатывает когда вы вызываете его руками или это делает collection view • При срабатывании shouldInvalidateLayoutForBoundsChange()
  75. 75. Как это работает? 20 • Вызывается invalidateLayout() • Срабатывает когда вы вызываете его руками или это делает collection view • При срабатывании shouldInvalidateLayoutForBoundsChange() • Вызывается prepareLayout()
  76. 76. Как это работает? 20 • Вызывается invalidateLayout() • Срабатывает когда вы вызываете его руками или это делает collection view • При срабатывании shouldInvalidateLayoutForBoundsChange() • Вызывается prepareLayout() • Запрашивается размер поля collectionViewContentSize
  77. 77. Как это работает? 20 • Вызывается invalidateLayout() • Срабатывает когда вы вызываете его руками или это делает collection view • При срабатывании shouldInvalidateLayoutForBoundsChange() • Вызывается prepareLayout() • Запрашивается размер поля collectionViewContentSize • Вызывается layoutAttributesForElementsInRect()
  78. 78. Схема 21
  79. 79. layoutAttributesForElementsInRect() 22
  80. 80. layoutAttributesForElementsInRect() 22 • layoutAttributesForCellWithIndexPath:
  81. 81. layoutAttributesForElementsInRect() 22 • layoutAttributesForCellWithIndexPath: • layoutAttributesForSupplementaryViewOfKind:withI ndexPath:
  82. 82. layoutAttributesForElementsInRect() 22 • layoutAttributesForCellWithIndexPath: • layoutAttributesForSupplementaryViewOfKind:withI ndexPath: • layoutAttributesForDecorationViewOfKind:withInde xPath:
  83. 83. UICollectionViewLayoutAttributes 23
  84. 84. UICollectionViewLayoutAttributes 23 • frame
  85. 85. UICollectionViewLayoutAttributes 23 • frame • bounds
  86. 86. UICollectionViewLayoutAttributes 23 • frame • bounds • center
  87. 87. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size
  88. 88. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size • transform3D
  89. 89. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size • transform3D • transform
  90. 90. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size • transform3D • transform • alpha
  91. 91. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size • transform3D • transform • alpha • zIndex
  92. 92. UICollectionViewLayoutAttributes 23 • frame • bounds • center • size • transform3D • transform • alpha • zIndex • hidden
  93. 93. Пару слов о редактировании 24
  94. 94. Пару слов о редактировании 24 • initialLayoutAttributesForAppearingItemAtIndexPath
  95. 95. Пару слов о редактировании 24 • initialLayoutAttributesForAppearingItemAtIndexPath • finalLayoutAttributesForDisappearingItemAtIndexPath
  96. 96. Пару слов о редактировании 24 • initialLayoutAttributesForAppearingItemAtIndexPath • finalLayoutAttributesForDisappearingItemAtIndexPath • Такие же методы для Supplementary и Decoration view
  97. 97. Спасибо за внимание Зимин Александр azimin@me.com @ziminalex
  • RinatMuhamedgaliev

    Nov. 20, 2015
  • oovechkin

    Apr. 29, 2015

UICollectionView CocoaHeads Moscow 30 января

Views

Total views

1,145

On Slideshare

0

From embeds

0

Number of embeds

10

Actions

Downloads

20

Shares

0

Comments

0

Likes

2

×