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

Transcript

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

12. 12

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

19. 19

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