© 2015 Apple Inc. All rights reserved. Redistribution or public display not permitted without written permission from Apple.
Implementing UI Designs in Interface Builder
Kevin Cathey Interface Builder EngineerTony Ricciardi Interface Builder Engineer
Developer Tools #WWDC15
Session 407
Design Time
Build TimeDesign Time
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
DemoDesign Time — Best Practices, Tips and Tricks
TakeawaysBest practices
TakeawaysBest practices
Stack Views
TakeawaysBest practices
Stack Views Dynamic Type
TakeawaysBest practices
Stack Views Dynamic Type
Designables
TakeawaysBest practices
Stack Views Dynamic Type
InspectablesDesignables
TakeawaysBest practices
Stack Views Dynamic Type
Inspectables Storyboard ReferencesDesignables
TakeawaysTips and tricks
TakeawaysTips and tricks
Fast Selection
TakeawaysTips and tricks
Fast Selection Canvas Customizations
TakeawaysTips and tricks
Fast Selection Canvas Customizations
Advanced Navigation
TakeawaysTips and tricks
Fast Selection Canvas Customizations
Multiple Bar ItemsAdvanced Navigation
TakeawaysTips and tricks
Fast Selection Canvas Customizations
Multiple Bar Items Simulated MetricsAdvanced Navigation
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign TimeXML Documents
Run TimeBuild TimeDesign TimeXML Documents ibtool
Run TimeBuild TimeDesign TimeXML Documents ibtool Nib Files
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Compiling Storyboards
Loading Storyboards At Run Time
Loading Storyboards At Run Time
UIStoryboardinit(name:bundle:)
Loading Storyboards At Run TimeUIStoryboard
instantiateInitialViewController()
UIStoryboardinit(name:bundle:)
Loading Storyboards At Run TimeUIStoryboard
instantiateInitialViewController()
UIViewControllerview
UIStoryboardinit(name:bundle:)
Loading Storyboards At Run Time
UIStoryboardinstantiateViewControllerWithIdentifier(_:)
UIStoryboardinstantiateInitialViewController()
UIViewControllerview
UIStoryboardinit(name:bundle:)
Loading Storyboards At Run Time
UIStoryboardinstantiateViewControllerWithIdentifier(_:)
UIStoryboardinstantiateInitialViewController()
UIViewControllerview
UIStoryboardinit(name:bundle:)
Loading Storyboards At Run Time
UIStoryboardinstantiateViewControllerWithIdentifier(_:)
UIStoryboardinstantiateInitialViewController()
UIViewControllerview
UITableViewdequeueReusableCellWithIdentifier(_:)
UIStoryboardinit(name:bundle:)
Takeaways
Takeaways
Performance. Nib files loaded on demand.
Takeaways
Performance. Nib files loaded on demand.Reuse. Nib files enable reuse.
Takeaways
Performance. Nib files loaded on demand.Reuse. Nib files enable reuse.Life cycle. Know when objects are created.
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
Run TimeBuild TimeDesign Time
Interface Builder at Run Time
Tony Ricciardi
ConnectionsAPIAdaptability
{ }Run TimeBuild TimeDesign Time
ConnectionsAPIAdaptability
{ }Run TimeBuild TimeDesign Time
Connections API Adaptability
{ }Run Time
Connections API Adaptability
{ }Run Time
Connections API Adaptability
{ }Run Time
Connections API Adaptability
{ }Run Time
}
var username: String? { didSet { usernameLabel?.text = username } } }
override func viewDidLoad() { usernameLabel.text = username }
@IBOutlet var usernameLabel: UILabel!
class AccountViewController : UIViewController {
Connections
class AccountViewController : UIViewController {
Connections
@IBOutlet var usernameLabel: UILabel!
}
var username: String? { didSet { usernameLabel?.text = username } }
override func viewDidLoad() { usernameLabel.text = username }
}
class AccountViewController : UIViewController {
Connections
override func viewDidLoad() { usernameLabel.text = username }
var username: String? { didSet { usernameLabel?.text = username } }
@IBOutlet var usernameLabel: UILabel!
}
Connections
var username: String? { didSet { usernameLabel?.text = username } }
override func viewDidLoad() { usernameLabel.text = username }
class AccountViewController : UIViewController {
@IBOutlet var usernameLabel: UILabel!
}
@IBAction func tappedLoginButton() { if attemptLogin() { performSegueWithIdentifier("unwindAfterLogin", sender: nil) } else { performSegueWithIdentifier("presentLoginError", sender: nil) } }
@IBAction func toggledAutoLoginSwitch(sender: UISwitch) { UserSettings.autoLogin = sender.on }
Connections
class LoginViewController : UIViewController {
}
Connections
@IBAction func toggledAutoLoginSwitch(sender: UISwitch) { UserSettings.autoLogin = sender.on }
@IBAction func tappedLoginButton() { if attemptLogin() { performSegueWithIdentifier("unwindAfterLogin", sender: nil) } else { performSegueWithIdentifier("presentLoginError", sender: nil) } }
class LoginViewController : UIViewController {
}
Connections
@IBAction func toggledAutoLoginSwitch(sender: UISwitch) { UserSettings.autoLogin = sender.on }
@IBAction func tappedLoginButton() { if attemptLogin() { performSegueWithIdentifier("unwindAfterLogin", sender: nil) } else { performSegueWithIdentifier("presentLoginError", sender: nil) } }
class LoginViewController : UIViewController {
API
UIStoryboard: init(name:bundle:) func instantiateInitialViewController() func instantiateViewControllerWithIdentifier(_:)
UIViewController: var storyboard: UIStoryboard? { get }
API
UIViewController: func prepareForSegue(_:sender:) func performSegueWithIdentifier(_:sender:) func shouldPerformSegueWithIdentifier(_:sender:) -> Bool func unwindForSegue(_:towardsViewController:)
UIStoryboardSegue: func perform()
What’s New in Storyboards Nob Hill Thursday 9:00AM
Adaptability
Adaptability
Butto
n
Adaptability
Butto
n
Adaptability
Button
Button1
Button2
Button3
Button4
Adaptability
Butto
n1
Butto
n2
Butto
n3
Butto
n4
Adaptability
Adaptability
Butto
n1
Butto
n2
Butto
n3
Butto
n4
Adaptability
Button1 Button2
Button3 Button4
Connections API Adaptability
{ }
DemoInterface Builder at Run Time
Summary
Summary
Design a flexible UI with constraints and stack views
Summary
Design a flexible UI with constraints and stack viewsRapidly iterate with designable views
Summary
Design a flexible UI with constraints and stack viewsRapidly iterate with designable viewsModularize your UI with Storyboard References
Summary
Design a flexible UI with constraints and stack viewsRapidly iterate with designable viewsModularize your UI with Storyboard ReferencesReuse content with the storyboard API
instantiateViewControllerWithIdentifier(_:)
Summary
Design a flexible UI with constraints and stack viewsRapidly iterate with designable viewsModularize your UI with Storyboard ReferencesReuse content with the storyboard APIMake your UI adaptive with Size Classes
More Information
Apple Developer Forumshttp://developer.apple.com/forums
Stefan LesserDeveloper Tools [email protected]
mailto:[email protected]
Related Sessions
What’s New in Storyboards Mission Thursday 9:00AM
Mysteries of Auto Layout, Part 1 Presidio Thursday 11:00AM
Mysteries of Auto Layout, Part 2 Presidio Thursday 1:30PM
Building Adaptive Apps with UIKit WWDC14
Taking Control of Auto Layout in Xcode WWDC13
Related Labs
Interface Builder and Auto Layout Developer Tools Lab C Thursday 2:30PM