Build your UI Developer Toolbox using Playgrounds

Talk at FrenchKit about how to leverage Playgrounds to build real component helping you to iterate faster while developing UI

Transcript

1. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND HUGUES BERNET-ROLLANDE @ROMPELSTILCHEN GITHUB.COM/HUGUESBR CHIEF SOFTWARE OFFICER @ WIRED BEAUTY 1
2. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND @rompelstilchen A WORKMAN IS AS GOOD AS HIS TOOLS @rompelstilchen 2 Some wise man
3. @rompelstilchen 3 @rompelstilchen
4. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND @rompelstilchen A DEVELOPER IS AS GOOD AS HIS ABILITY TO IMPROVE HIS TOOLS Hugues Bernet-Rollande 4
5. WHY? BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUNDS 5 @rompelstilchen
6. 6 @rompelstilchen
7. CAMEDIATIMINGFUNCTIONCONTROL BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND 7 @rompelstilchen
8. @rompelstilchen 8 @rompelstilchen @rompelstilchen
9. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND USING THE CAMEDIATIMINGFUNCTIONCONTROL import XCPlayground // canvas let view = UIView() XCPlaygroundPage.currentPage.liveView = view // sampleView view.addSubview(SampleView()) // custom built CAMediaTimingFunctionControl let mediaTimingControl = CAMediaTimingFunctionControl() view.addSubview(mediaTimingControl) // update sample view timing function on change mediaTimingControl.onValueDidChange = { sampleView.timingFunction = $0 } 9 @rompelstilchen
10. VIEW RESIZER BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND 10 @rompelstilchen
11. @rompelstilchen 11 @rompelstilchen @rompelstilchen
12. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND USING RESIZER CONTROL import XCPlayground // canvas let view = UIView() XCPlaygroundPage.currentPage.liveView = view // resize control let resizableView = ResizableView() view.addSubview(resizableView) // sampleView resizableView.contentView = SampleView() 12 @rompelstilchen
13. CAVEATS BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND 13 @rompelstilchen
14. BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND @rompelstilchen CAVEATS ▸Playground are slow and unstable ▸Copy/paste of code (your view) ▸Need to (sometime) adapt your view 14
15. WHAT’S NEXT? BUILD YOUR UI DEVELOPER TOOLBOX IN SWIFT PLAYGROUND 15 @rompelstilchen
16. iPad Swift Playground NSDateFormatter Rulers LoremLipsum X C A s s e t s C o l o r W h e e l C u s t o m T r a n s i t i o n e r r o r e t c a n i m a t i o n s l i d e r A p p I c o n Generator random color include incomplete gradient issue missing AnimationSequencer Sequence Generator number Curve Alternate 16
17. THANK YOU! PRESENTATION AVAILABLE AT: HTTP://BIT.LY/225SIBM HUGUES BERNET-ROLLANDE @ROMPELSTILCHEN GITHUB.COM/HUGUESBR CSO ENGINEER @ WIRED BEAUTY 17