Developing User Interfaces

This talk is about concepts for implementing scalable user interfaces and what a potential solution for developing user interfaces with Swift might look like in the future.

Transcript

1. Developing User Interfaces by Felix Gabel, @blinker13
2. UI HTML CSS Flexbox Box Model AutoLayout Constraints Interface Builder XML Springs & Struts Autoresizing Animations Events Widgets Style Layout Anchors Grid
3. in iOS land… • Storyboards • XIBs • Code
4. Shortcomings • mutable view components • not thread-save and bound to main thread • state and complexity go hand in hand • written with Objective-C in mind • open source?
5. Lots of state… Play Pause Seek Error
6. State Transitions Play Pause Error Seek Finish Load
8. what is out there… • Android XML and Constraints soon • Apple of course, UIKit, AppKit, Quartz, … • Facebook React Native, AsyncDisplayKit, ComponentsKit • Linux X11 … o_O • Windows I admit it, no clue at all
10. A swifter UI library
11. • simple layout and styling of Components • immutable declaration of view hierarchy • parallelize layout calculations in background • live preview of changes • written in Swift • open source
12. Overview • Animations ooooooh • Event Handling gestures, keyboard, mouse • Layout springs & struts, flexbox, constraints • Styling colors, shadow, border, …
13. Layout Springs & Struts • performance • calculations Constraints • very natural • performance Flexbox • natural • performance*
14. Component width:Dimension height:Dimension margin:Space alignment:Alignment (ignore this one for now)
15. Container arrangement:Arrangement distribution:Distribution padding:Space justify:Alignment
16. putting it together Distribute remaining space
17. apply it everywhere ∞ ∞ ∞ ∞ 44.0 44.0
18. apply it some more
20. DEMO
21. Questions?
22. Thank you!
23. is hiring!