Александр Зимин "Нестандартная верстка для...
Post on 22-Jan-2017
121 Views
Preview:
TRANSCRIPT
iOS Developer UI Engineer
CocoaHeadsRussia
macOS Developer Co-Founder Организатор
Маркетинг, Дизайн, Аналитика, …
Cell
Cell
Cell
Table ViewData Source
Delegate
Cell Data
“Although UITableView allows vertical scrolling only”
Cell
Cell
Cell
Table ViewData Source
Delegate
Cell Data
“Although UITableView allows vertical scrolling only”
Cell Height
Cell
Cell
Cell
Table ViewData Source
Delegate
Cell Data
“Although UITableView allows vertical scrolling only”
Cell Height
Dynamic Height
Cell
Cell
Cell
Table ViewData Source
Delegate
Cell Data
“Although UITableView allows vertical scrolling only”
Cell Height
Dynamic Height
8
Data Source
Delegate
Cell Data
Cell Cell
Cell
Cell Cell
Collection ViewCollection View Layout
LayoutAttributes
• override func systemLayoutSizeFitting(:, :, :) -> CGSize• Нет ничего плохого в комбинировании Auto Layout и
ручного подсчета• Типы динамического контента:
• Картинки (UIImageView)• Текст (UILabel, UITextView)• Нестандартные элементы (Custom UIView/UIControl)
• UILabel• func sizeThatFits(_ size: CGSize) -> CGSize
• String/NSAttributedString• func boundingRect(with size: CGSize, options:
NSStringDrawingOptions = [], attributes: [String : Any]? = nil, context: NSStringDrawingContext?) -> CGRect
goo.gl/pBdZlI
• UILabel• func sizeThatFits(_ size: CGSize) -> CGSize
• String/NSAttributedString• func boundingRect(with size: CGSize, options:
NSStringDrawingOptions = [], attributes: [String : Any]? = nil, context: NSStringDrawingContext?) -> CGRect
goo.gl/pBdZlI
• UILabel• func sizeThatFits(_ size: CGSize) -> CGSize
• String/NSAttributedString• func boundingRect(with size: CGSize, options:
NSStringDrawingOptions = [], attributes: [String : Any]? = nil, context: NSStringDrawingContext?) -> CGRect
• func boundingRect(with size: CGSize, options: NSStringDrawingOptions = [], context: NSStringDrawingContext?) -> CGRect
goo.gl/pBdZlI
• Динамическая верстка у таблиц и коллекций существует уже давно (iOS 8+)
• В ней нет ничего плохого, и она вам упростит жизнь• Вы всегда можете комбинировать auto layout и
ручной подсчет• Посчитать размер String/NSAttributedString легко
Итоги демо
Collection View Layout
prepare()
var collectionViewContentSize: CGSize
func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]?
Collection View Layout
prepare()
var collectionViewContentSize: CGSize
func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]?
Collection View Layout
prepare()
var collectionViewContentSize: CGSize
func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]?
func shouldInvalidateLayout(forBoundsChange newBounds: CGRect) -> Bool
• Для любой нестандартной верстки вам хватит UICollectionView
• Нестандартный paging находится там же• Для оптимизации кэшируйте все заранее или в
процессе
Итоги демо
• Заготавливайте ваши значения в prepare()• Кэшируйте значения• Не стоит всегда возвращать true из `shouldInvalidateLayout`• Будьте осторожнее с `estimatedItemSize`
• Не все то золото, что блестит• Не жалейте ресурсов на проверку всех
поддерживаемых iOS• Использование таких элементов по-прежнему
оправдано
Итоги демо
• Вы всегда можете показать взаимодействие пользователя с контентом
• Чем интереснее возможность, тем сложнее ее поддерживать
Итоги демо
• Динамическая верстка — это хорошо• Любую верткую можно реализовать на
UICollectionView, и это просто• Чем интереснее возможность — тем больше
ответственность• Все это можно еще анимировать
Итоги
• WWDC 2016 Inclusive App Design — https://developer.apple.com/videos/play/wwdc2016/801/
• WWDC 2016 Making Apps Adaptive Part 1/2 — https://developer.apple.com/videos/play/wwdc2016/222/, https://developer.apple.com/videos/play/wwdc2016/233/
• Подсчет высоты строки — https://goo.gl/pBdZlI
Ссылки
• WWDC 2016 Inclusive App Design — https://developer.apple.com/videos/play/wwdc2016/801/
• WWDC 2016 Making Apps Adaptive Part 1/2 — https://developer.apple.com/videos/play/wwdc2016/222/, https://developer.apple.com/videos/play/wwdc2016/233/
Ссылки
top related