Магия UILabel или приватное API Autolayout

Transcript

2. Магия UILabel или приватное API Autolayout Горемыкин Александр Яндекс.Карты iOS
3. План ▌ Вспомнить UILabel ▌ Попытаться повторить UILabel ▌ Разобраться с Autolayout › Private API › Инструменты & подходы ▌ Воспроивести UILabel 3
4. UILabel 4
5. UILabel 5 UILabel numberOfLines == 0 NSLayoutConstraint Отступ 20 pt
6. UILabel 6 Ожидаемое и знакомое поведение Но как UILabel это делает? ▌ Автоматический расчет высоты, ▌ основанный на заданных ▌ констрейнтах и контенте
7. История 7 А давайте напишем свой лейбл! Зачем?!
8. › UIView › Рендеринг через CATextLayer (или CoreText, или еще как угодно) › Тривиальный интерфейс var attributedText: NSAttributedString? { get set } › Self-sizing поведение как у UILabel › Работать везде, где работает UILabel › Не требовать написания дополнительного кода AttributedStringLabel - ASLabel 8
9. Хелпер 9 extension NSAttributedString { func size(forWidth width: CGFloat) -> CGSize { return boundingRect( with: CGSize(width: width, height: CGFloat.greatestFiniteMagnitude), options: [.usesLineFragmentOrigin, .usesFontLeading], context: nil ).size } } ▌ Получение высоты контента NSAttributedString ▌ в рамках заданной ширины
10. intrinsicContentSize 10 ▌ Связь нашего контента с миром Autolayout intrinsicContentSize = (500.0, 200.0) .widthAnchor (const = 500.0) .heightAnchor (const = 200.0)
11. Спросить intrinsicContentSize intrinsicContentSize 11 Решить систему констрейнтов Присвоить bounds и center Обновить констрейнты
12. override var intrinsicContentSize: CGSize { return attributedText?.size(forWidth: bounds.width) ?? .zero } override func layoutSubviews() { super.layoutSubviews() if savedBounds == nil || savedBounds != bounds { invalidateIntrinsicContentSize() } savedBounds = bounds } private var savedBounds: CGRect? intrinsicContentSize 12
13. override var intrinsicContentSize: CGSize { return attributedText?.size(forWidth: bounds.width) ?? .zero } override func layoutSubviews() { super.layoutSubviews() if savedBounds == nil || savedBounds != bounds { invalidateIntrinsicContentSize() } savedBounds = bounds } private var savedBounds: CGRect? intrinsicContentSize 13
14. override var intrinsicContentSize: CGSize { return attributedText?.size(forWidth: bounds.width) ?? .zero } override func layoutSubviews() { super.layoutSubviews() if savedBounds == nil || savedBounds != bounds { invalidateIntrinsicContentSize() } savedBounds = bounds } private var savedBounds: CGRect? intrinsicContentSize 14
15. intrinsicContentSize 15
16. intrinsicContentSize 16 ASLabel UILabel › UITableView › UITableViewAutomaticDimension › Контент в ячейке прибит констрейнтами к краям
17. intrinsicContentSize 17 ▌ Что-то пошло не так! UITableView + UITableViewAutomaticDimension = Некорректный размер ячейки с ASLabel Но UILabel работает верно!
18. Высота ячейки height Система сама считает высоту через systemLayoutSizeFitting tableView(_:heightForRowAt:) 18 height == Auto? Нет Да height *Auto = UITableViewAutomaticDimension systemLayoutSizeFitting(_:)
19. 19 Нет возможности верно рассчитать intrinsicContentSize в текущей реализации ASLabel systemLayoutSizeFitting(_:) › Не влияет на размер UIView, не обновляет bounds › Не вызывает layoutSubviews
20. 20 func systemLayoutSizeFitting(_ targetSize: CGSize) -> CGSize ▌ Система отдает нам targetSize! › Определим systemLayoutSizeFitting у UITableViewCell › Прокинем targetSize в контент ячейки › Используем его при расчете intrinsicContentSize systemLayoutSizeFitting(_:)
21. systemLayoutSizeFitting(_:) 21 ASLabel View-Tree dx2 dx3 LabelTargetSize TargetSize dy1 dy2 LabelTargetSize = CGSize( width: TargetSize – dx1 – dx2 – dx3 – image.size.width, height: TargetSize – dy1 – dy2 ) Image dx1
22. // Cell.swift override func systemLayoutSizeFitting(...) -> CGSize { // Прокинуть верный размер с учетом отступов (content as? ASLabel)?.fittingSize = computeContentTargetSize(for: targetSize) return super.systemLayoutSizeFitting(...) } // ASLabel.swift override var intrinsicContentSize: CGSize { return attributedText?.size( forWidth: (fittingSize ?? bounds).width ) ?? .zero } var fittingSize: CGRect? 22
23. // Cell.swift override func systemLayoutSizeFitting(...) -> CGSize { // Прокинуть верный размер с учетом отступов (content as? ASLabel)?.fittingSize = computeContentTargetSize(for: targetSize) return super.systemLayoutSizeFitting(...) } // ASLabel.swift override var intrinsicContentSize: CGSize { return attributedText?.size( forWidth: (fittingSize ?? bounds).width ) ?? .zero } var fittingSize: CGRect? 23
24. systemLayoutSizeFitting (_:) 24
25. ASLabel 25 Получили рабочее решение! › Переопределение systemLayoutSizeFitting › Необходимость протаскивания логики работы с ASLabel по всему View-Tree Но не такое удобное как UILabel
26. Разбираемся с UILabel 26 ▌ Надо знать опорную ширину в момент расчета intrinsicContentSize ASLabel: › второй layout-pass благодаря invalidateIntrinsicContentSize в layoutSubviews › targetSize из systemLayoutSizeFitting UILabel:
27. Разбираемся с UILabel 27 Помощники Obj-С runtime Инструменты › Рефлексия › Swizzling › RuntimeBrowser › Xtrace
28. Разбираемся с UILabel (Поиск API) 28 Надо получить опорную ширину è Нужен как минимум один layout-pass Предположение Делаем еще один layout-pass с верным intrinsicContentSize è Задачу можно решить минимум за 2 прохода лейаута Зная опорную ширину расчитываем intrinsicContentSize
29. Разбираемся с UILabel (Поиск API) 29 RuntimeBrowser › UIView.h › UILabel.h › … _prepareForFirstIntrinsicContentSizeCalculation _prepareForSecondIntrinsicContentSizeCalculationWithLayoutEngineBounds
30. Разбираемся с UILabel (Поиск API) 30 У UIView не вызывается, у UILabel - да! ▌ Система явно подсказывает bounds для расчета IntrinsicContentSize ▌ Предположение про два прохода подтверждается @objc func _prepareForSecondIntrinsicContentSizeCalculation( withLayoutEngineBounds bounds: CGRect)
31. Разбираемся с UILabel (Поиск API) 31 Xtrace! [<CustomLabel 0x7fcb8350d0d0>/UILabel _prepareForFirstIntrinsicContentSizeCalculation] ... [<CustomLabel 0x7fcb8350d0d0>/UILabel _needsDoubleUpdateConstraintsPass] -> 1 ... [<CustomLabel 0x7fcb8350d0d0>/UILabel _prepareForSecondIntrinsicContentSizeCalculationWithLayoutEngineBounds: {{20, 20}, {25000000, 20.5}}]
32. [<CustomLabel 0x7fcb8350d0d0>/UILabel _prepareForFirstIntrinsicContentSizeCalculation] ... [<CustomLabel 0x7fcb8350d0d0>/UILabel _needsDoubleUpdateConstraintsPass] -> 1 ... [<CustomLabel 0x7fcb8350d0d0>/UILabel _prepareForSecondIntrinsicContentSizeCalculationWithLayoutEngineBounds: {{20, 20}, {25000000, 20.5}}] Разбираемся с UILabel (Поиск API) 32 Xtrace! Бинго!
33. Разбираемся с UILabel (Поиск API) 33 Бинго! func _needsDoubleUpdateConstraintsPass() -> Bool ▌ Намекающее название У UIView - false, у UILabel - true!
34. Разбираемся с UILabel (Поиск API) 34 Бинго! [<CustomLabel 0x7fcb8350d0d0>/UILabel _needsDoubleUpdateConstraintsPass] -> 1 ... [<CustomLabel 0x7fcb8350d0d0>/UIView nsli_layoutEngine] -> <NSISEngine 0x6000001812b0> ... [<CustomLabel 0x7fcb8350d0d0>/UIView _nsis_compatibleBoundsInEngine:<NSISEngine 0x6000001812b0>] -> {{20, 20}, {25000000, 20.5}} Xtrace!
35. Разбираемся с UILabel (Поиск API) 35 Бинго! [<CustomLabel 0x7fcb8350d0d0>/UILabel _needsDoubleUpdateConstraintsPass] -> 1 ... [<CustomLabel 0x7fcb8350d0d0>/UIView nsli_layoutEngine] -> <NSISEngine 0x6000001812b0> ... [<CustomLabel 0x7fcb8350d0d0>/UIView _nsis_compatibleBoundsInEngine:<NSISEngine 0x6000001812b0>] -> {{20, 20}, {25000000, 20.5}} Xtrace!
36. Разбираемся с UILabel (Поиск API) 36 Бинго! func _nsis_compatibleBoundsInEngine(_ engine: NSISEngine) func nsli_layoutEngine() -> NSISEngine ▌ Теперь ясно как вытащить размер из движка!
37. NSISEngine Решение системы констрейнтов Обновление ICS констрейнтов Обновление ICS констрейнтов Решение системы констрейнтов Нужен второй проход? 37 Разбираемся с UILabel (Поиск API) *ICS = IntrinsicContentSize false true LayoutEngineBounds
38. › Вернем true в _needsDoubleUpdateConstraintsPass › Вытащим LayoutEngineBounds › Рассчитаем intrinsicContentSize, основываясь на LayoutEngineBounds ASLabel
39. 39 @objc func _needsDoubleUpdateConstraintsPass() -> Bool { return true } override var intrinsicContentSize: CGSize { return attributedText?.size( forWidth: (engineBounds ?? bounds).width ) ?? .zero } var engineBounds: CGRect? { return ... } ASLabel
40. 40 @objc func _needsDoubleUpdateConstraintsPass() -> Bool { return true } override var intrinsicContentSize: CGSize { return attributedText?.size( forWidth: (engineBounds ?? bounds).width ) ?? .zero } var engineBounds: CGRect? { return ... } ASLabel
41. 41 @objc func _needsDoubleUpdateConstraintsPass() -> Bool { return true } override var intrinsicContentSize: CGSize { return attributedText?.size( forWidth: (engineBounds ?? bounds).width ) ?? .zero } var engineBounds: CGRect? { return ... } ASLabel
42. 42 var engineBounds: CGRect? { let objcSelector = Selector("_nsis_compatibleBoundsInEngine:") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector, Any) -> CGRect let callableImpl = unsafeBitCast(impl, to: CFunction.self) return layoutEngine.flatMap { callableImpl(self, objcSelector, $0) } } ASLabel
43. 43 var engineBounds: CGRect? { let objcSelector = Selector("_nsis_compatibleBoundsInEngine:") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector, Any) -> CGRect let callableImpl = unsafeBitCast(impl, to: CFunction.self) return layoutEngine.flatMap { callableImpl(self, objcSelector, $0) } } ASLabel
44. 44 var engineBounds: CGRect? { let objcSelector = Selector("_nsis_compatibleBoundsInEngine:") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector, Any) -> CGRect let callableImpl = unsafeBitCast(impl, to: CFunction.self) return layoutEngine.flatMap { callableImpl(self, objcSelector, $0) } } ASLabel
45. 45 var engineBounds: CGRect? { let objcSelector = Selector("_nsis_compatibleBoundsInEngine:") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector, Any) -> CGRect let callableImpl = unsafeBitCast(impl, to: CFunction.self) return layoutEngine.flatMap { callableImpl(self, objcSelector, $0) } } ASLabel
46. 46 var engineBounds: CGRect? { let objcSelector = Selector("_nsis_compatibleBoundsInEngine:") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector, Any) -> CGRect let callableImpl = unsafeBitCast(impl, to: CFunction.self) return layoutEngine.flatMap { callableImpl(self, objcSelector, $0) } } ASLabel
47. 47 var layoutEngine: Any? { let objcSelector = Selector("_nsli_layoutEngine") let impl = class_getMethodImplementation( type(of: self).self, objcSelector ) typealias CFunction = @convention(c) (AnyObject, Selector) -> Any let callableImpl = unsafeBitCast(impl, to: CFunction.self) return callableImpl(self, objcSelector) } ASLabel
48. ASLabel 48
49. ASLabel 49 › Не надо переопределять systemLayoutSizeFitting › Не надо готовить все слои view-tree под ASLabel › Никакой дополнительной работы › Повторяет поведение UILabel
50. Результат 50 Первый уровень › Определение intrinsicContentSize › Вызов второго layout-pass посредством invalidateIntrinsicContentSize в layoutSubviews
51. Результат 51 Второй уровень – подтягиваем UITableView › Определение systemLayoutSizeFittingSize › Прокидывание по всему view-tree targetSize
52. Результат 52 Третий уровень – приватное API › _needsDoubleUpdateConstraintsPass() › nsis_compatibleBoundsInEngine(_:)
53. Ссылки 53 RuntimeBrowser https://github.com/nst/RuntimeBrowser Xtrace https://github.com/johnno1962/Xtrace ASLabel на GitHub https://github.com/alex1powers/ASLabel Статья в нашем блоге https://medium.com/yandex-maps-ios/uilabel-magic-2c83bc62a0db
54. +7 925 324 28 96 sanllier@yandex-team.ru Горемыкин Александр Яндекс.Карты iOS https://medium.com/@ifresh.wp