Live Renderingとの上手い付き合い方

『Gotanda.mobile #2』 での登壇資料

1. Live Renderingͱͷ ্ख͍෇͖߹͍ํ 2017/03/23 Gotanda.mobile #2 1
2. Keisuke Shoji @WorldDownTown VASILY, Inc. 2
3. Live Rendering ͱ͸ 3
4. Live Rendering • 2014೥ʙ • Xcode 6 Ͱ Interaface Builder ʹ௥Ճ͞Εͨػೳ 4
5. Ͱ͖Δ͜ͱ! • ผΫϥεʹ੾Γग़ͨ͠ViewͷσβΠϯ ΛɺΞϓϦΛϏϧυͤͣʹϦΞϧλΠϜ Ͱ֬ೝͰ͖Δ 5
6. Ͱ͖Δ͜ͱ! • ผΫϥεʹ੾Γग़ͨ͠ViewͷσβΠϯ ΛɺΞϓϦΛϏϧυͤͣʹϦΞϧλΠϜ Ͱ֬ೝͰ͖Δ ։ൃαΠΫϧͷϖʔε্͕͕ Δ㽉 6
7. Ͱ͖ͳ͍͜ͱ! • API௨৴ͷϨεϙϯεΛ࢖͏৔߹ͳͲɺඇಉظͰͷσβΠϯ൓ө Ͱ͖ͳ͍ • ͦͷViewࣗ਎͚ͩͷಠࣗͷϥΠϑαΠΫϧΛ࣋ͭͷͰɺͦΕΛ ௒͑Δॲཧ͸ಈ͔ͳ͍ (UIApplicationDelegate, UIViewController ͷϝιο υͳͲ) 7
8. @IBDesignable / @IBInspectable ͱ͸ 8
9. @IBDesignable • Live Rendering Λ༗ޮʹ͢ΔͨΊ ͷΩʔϫʔυ • Interface BuilderͰΧελϜView ͷσβΠϯΛදࣔͰ͖ΔΑ͏ʹͳΔ 9
10. @IBInspectable • ΧελϜViewͷϓϩύςΟΛ InterfaceBuilderΛͷΠϯεϖΫλ ͰมߋͰ͖ΔΑ͏ʹͳΔ 10
11. Α͋͘Δ࢖͍ํ • @IBDesignable Ͱఆٛͨ͠ΧελϜViewΛ࡞੒ • draw(_:) ͰσβΠϯΛ࣮૷ 11
13. σϝϦοτ! • ίʔυ্ ͱ Interface Builder ʹσβΠϯ࣮૷͕ࢄΒ͹ Δ… • ඳըॲཧ͕ແ͍ͷʹ draw(_:) ʹॻ͘ͷ͸ͪΐͬͱ… 13
14. σϝϦοτ! • ίʔυ্ ͱ Interface Builder ʹσβΠϯ࣮૷͕ࢄΒ͹ Δ… (@IBInspectable Λ࢖͍ग़͢ͱ༨ܭʹ) • ඳըॲཧ͕ແ͍ϨΠΞ΢τઃఆΛ draw(_:) ʹॻ͘ͷ͸ͪΐ ͬͱ… ↓ ίʔυଆʹدͤΑ͏! 14
15. ⚠ίʔυʹσβΠϯΛدͤΔ্Ͱͷ஫ҙ఺⚠ 15
16. ΞϓϦ্ͷڍಈ 1.init?(coder:) 2.awakeFromNib() 3.layoutSubviews() 4.draw(_:) 16
17. Live Rendering ͷڍಈ 1.init(frame:) ⚠ 2.prepareForInterfaceBuilder() ⚠ 3.layoutSubviews() 4.draw(_:) awakeFromNib() ʹϨΠΞ΢τॲཧΛॻ͍͍ͯΔͱLive Rendering͞Εͳ͍ 17
18. ίʔυͷϨΠΞ΢τΛ൓өͤ͞Δʹ͸ • awakeFromNib() • prepareForInterfaceBuilder() ͷ྆ํͰϨΠΞ΢τॲཧΛݺͿ If you want to share code between these methods, move that code to another method that you call 1 Xcode Help - http://help.apple.com/xcode/mac/8.0/#/devf60c1c514 18
20. σόοά! 1.Break PointΛଧ͓ͬͯ͘ 2.Interface Builder Λ։͘ 3.Editor → Debug Selected Views 4.બ୒ͨ͠ViewͷϨϯμϦϯάॲཧ͕૸ Δ 5.Break PointͰॲཧ͕ࢭ·Δ 6.LLDBͰσόοά 20
21. RangeSeekSlider ↔ ൣғબ୒͢ΔͨΊͷUISliderϥΠΫϥΠ ϒϥϦ https://github.com/ WorldDownTown/RangeSeekSlider 21
22. ·ͱΊ • Live RenderingͰΞϓϦΛϏϧυ͠ͳ͍ͰσβΠϯΛ֬ೝͰ ͖Δ • ίʔυͰ࣮૷ͨ͠σβΠϯ΋Live RenderingͰදࣔͤ͞Δ͜ ͱ͕Ͱ͖Δ 22
23. ͋Γ͕ͱ͏͍͟͝·ͨ͠ 23