Mastering Interface Builder
-
Upload
cocoaheads-france -
Category
Software
-
view
6.033 -
download
0
Transcript of Mastering Interface Builder
Mastering Interface Builder— Or how to stop cursing and love IB —
Dimitri Dupuis-Latour — @dupuislatour
Once Upon a TimeA brief History of IB
Interface Builder1986
IB History A Brief Story of Time…
2001
Mac OS X
1986
NeXT
2008
iPhone SDK
Modern IB History A Dramatic Acceleration of Features
2011iOS 5
AutoLayout(OSX)Storyboards
Segue
2010iOS 4
Xcode IntegrationAll-in-one window
2014iOS 8
IBDesignableIBInspectableSize ClassesCustom FontsLocalisation
2013iOS 7
New AutoLayoutiOS7 makeoverAsset Catalogs
2012iOS 6
AutoLayout(iOS)
Don’t use IB like your Grandfather ! It’s 2015
AgendaStoryboards
TableView ControllersStatic TableViews
Unwind SegueCustom Segue Icon Font
Vector artworkSecret shortcuts
StoryboardsMore than just a meta XIB
Storyboard
Storyboard• Bird’s eye view • Visual way describe workflow • Communication Tool • Living Documentation
Not Approved
• Split by Feature / Tab / Unit of workflow (eg: Login, Creation)
Split Your Storyboards ! No « One Storyboard to Rule Them All »
// STORYBOARD - Instantiate from code let storyboard = UIStoryboard(name:"LoginScreens", bundle:nil) let vc = storyboard.instantiateViewControllerWithIdentifier("MyCustomVC")
as MyCustomVC
• Chain your screens in IB
• Takes out the simpler .push() .presentViewController(), didSelectRowAtIndexPath()
• Handle the more complex ones in - prepareForSegue: (iOS) - contextForSegue: (WatchKit, iOS 9 ?)
Build Navigation Hierarchy in IB
• Design / communication tool
• Split them
• Removes some push() / present() code
• best feature…
Storyboards : Recap More than just a meta XIB
Unwind SeguePush-pop-dismiss : sooo 2011
What are Unwind Segue ?
Auto-rewind to a specific screen
A B C D
E F GSubmit
navController.pop().pop() presentingController.dismiss() presentingController.navController.pop().pop().pop()
Problem 1: hardcoding Hierarchy in code
=> write custom @protocols => Store global variable / Singleton
Problem 2: passing data back to A
A B C D
E F GSubmit
A B C D
E F GSubmit
@IBAction func unwindTo### @IBAction func unwindToMyScreenA(segue: UIStoryboardSegue) {}
Step 1
A B C D
E F GSubmit
a) manually (eg: immediate action) b) programmatically (eg: deferred action)Step 2
@IBAction func unwindToMyScreenA(segue: UIStoryboardSegue) {}
A B C D
E F GSubmit
Step 2a - Manually
@IBAction func unwindToMyScreenA(segue: UIStoryboardSegue) {}
• Create a manual segue • ctrl-drag from File's Owner (VC) to Exit • choose Manual Segue • Select it in the outline view • Give it an Identifier "backToAPlease"
• Call it from Code
Step 2b - Programmatically
self.performSegueWithIdentifier("backToAPlease", sender:nil)
File's Owner Exit
• "Unwind" the navigation stack
• Including through push, modal, popover, tabs, etc…
• Passes data back (replacing custom @protocols)
• Less code
Unwind Segue : Recap
Custom SegueGo beyond push and modal
• Step 1) Select • Step 2) Set your class • Step 3) Enjoy !
Setup a Custom Segue
3DFlip Seguegithub.com/GlennChiu/
GC3DFlipTransitionStyleSegue
Fold Seguehttps://github.com/mpospese/
MPFoldTransition
DoorwaySeguegithub.com/jsmecham/DoorwaySegue
• Create your own transitions by subclassing UIStoryBoardSegue
• Componentize transistions in reusable blocks
• Share and reuse them !
Custom Segue : Recap Go beyond push & pop
One More ThingTip & Tricks
& Xcode 7 new features
Click Through Views
+ctrl + click⏏ shift
Measure distances
⌥alt + mouse over
🎉 Insert Emoji " Or any symbol really©★✔
+ctrl + space⌘ cmd
println("⛔ Found Error: ") println("⚠ Warning: ") println("✅ All Good: ")