Session 407 - Adopting Storyboards in Your App

91
These are confidential sessions—please refrain from streaming, blogging, or taking pictures Session 407 Adopting Storyboards in Your App Joshua Pennington Interface Builder

description

Session 407 - Adopting Storyboards in Your App

Transcript of Session 407 - Adopting Storyboards in Your App

Page 1: Session 407 - Adopting Storyboards in Your App

These are confidential sessions—please refrain from streaming, blogging, or taking pictures

Session 407

Adopting Storyboards in Your App

Joshua PenningtonInterface Builder

Page 2: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 3: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 4: Session 407 - Adopting Storyboards in Your App
Page 5: Session 407 - Adopting Storyboards in Your App
Page 6: Session 407 - Adopting Storyboards in Your App
Page 7: Session 407 - Adopting Storyboards in Your App

Passing Data

Page 8: Session 407 - Adopting Storyboards in Your App

Passing Data

-prepareForSegue:sender:

Page 9: Session 407 - Adopting Storyboards in Your App

Passing Data

-prepareForSegue:sender:

Page 10: Session 407 - Adopting Storyboards in Your App

Passing Data

-prepareForSegue:sender:

Page 11: Session 407 - Adopting Storyboards in Your App

DemoStoryboards

Page 12: Session 407 - Adopting Storyboards in Your App

RecapStoryboards

• Two main concepts: Scenes and Segues-prepareForSegue:sender:

Page 13: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 14: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 15: Session 407 - Adopting Storyboards in Your App

Mixing Storyboards with code/XIBsAdopting Storyboards in Your App

Tony RicciardiInterface Builder

Page 16: Session 407 - Adopting Storyboards in Your App
Page 17: Session 407 - Adopting Storyboards in Your App

Storyboards and Code

• Integrating with code-based views• Customizing transitions

Page 18: Session 407 - Adopting Storyboards in Your App
Page 19: Session 407 - Adopting Storyboards in Your App
Page 20: Session 407 - Adopting Storyboards in Your App
Page 21: Session 407 - Adopting Storyboards in Your App

UIStoryboard.hStoryboards and Code

+storyboardWithName:bundle:

■ Returns a new instance of UIStoryboard-instantiateInitialViewController

■ Returns a copy of the storyboard's initial view controller

Page 22: Session 407 - Adopting Storyboards in Your App

DemoIntegrating Storyboards with code-based views

Page 23: Session 407 - Adopting Storyboards in Your App
Page 24: Session 407 - Adopting Storyboards in Your App
Page 25: Session 407 - Adopting Storyboards in Your App
Page 26: Session 407 - Adopting Storyboards in Your App
Page 27: Session 407 - Adopting Storyboards in Your App

-performSegueWithIdentifier:sender:

UIViewController

Page 28: Session 407 - Adopting Storyboards in Your App
Page 29: Session 407 - Adopting Storyboards in Your App
Page 30: Session 407 - Adopting Storyboards in Your App
Page 31: Session 407 - Adopting Storyboards in Your App
Page 32: Session 407 - Adopting Storyboards in Your App

-instantiateViewControllerWithIdentifier:

UIStoryboard

Page 33: Session 407 - Adopting Storyboards in Your App

RecapStoryboards and Code

• Storyboards in code• Code-based views in Storyboards• Manual Segue triggers• Scenes without Segues

Page 34: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 35: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 36: Session 407 - Adopting Storyboards in Your App

Embed SeguesNew Ways to Use Storyboards

Page 37: Session 407 - Adopting Storyboards in Your App

Embed SeguesNew Ways to Use Storyboards

Page 38: Session 407 - Adopting Storyboards in Your App

Foo

Content Area

Page 39: Session 407 - Adopting Storyboards in Your App

Foo

Page 40: Session 407 - Adopting Storyboards in Your App

How It Works Today

View Controller View Controller

Page 41: Session 407 - Adopting Storyboards in Your App

How It Works Today

View Controller View Controller

@"ContentScene"

Page 42: Session 407 - Adopting Storyboards in Your App

How It Works Today

View Controller View Controller

@"ContentScene"

UIViewController *child = [[self storyboard] instantiateViewControllerWithIdentifier:@"ContentScene"];[self addChildViewController:child];[[self view] addSubview:[child view]];[[child view] setFrame:frame];

Page 43: Session 407 - Adopting Storyboards in Your App

How It Works Today

View ControllerView Controller

UIViewController *child = [[self storyboard] instantiateViewControllerWithIdentifier:@"ContentScene"];[self addChildViewController:child];[[self view] addSubview:[child view]];[[child view] setFrame:frame];

Page 44: Session 407 - Adopting Storyboards in Your App

Embed Segues

View Controller View Controller

Page 45: Session 407 - Adopting Storyboards in Your App

Embed Segues

View ControllerContent Area View Controller

Page 46: Session 407 - Adopting Storyboards in Your App

Embed Segues

View ControllerContent AreaView Controller

Page 47: Session 407 - Adopting Storyboards in Your App

Embed Segues

View ControllerContent AreaView Controller

There is no code.

Page 48: Session 407 - Adopting Storyboards in Your App

DemoEmbed Segues

Page 49: Session 407 - Adopting Storyboards in Your App

RecapEmbed Segues

• Add a container view• Create a segue from the container view to the destination scene• Use -prepareForSegue:sender: if needed

Page 50: Session 407 - Adopting Storyboards in Your App

Unwind SeguesNew Ways to Use Storyboards

• Segues go to new instances only• Returning to previous controllers is a manual process

Page 51: Session 407 - Adopting Storyboards in Your App

Unwind SeguesNew Ways to Use Storyboards

• Segues go to new instances only• Returning to previous controllers is a manual process

■ Define a delegate■ Use -prepareForSegue: to wire up the delegate■ Invoke the delegate■ Return any data; trigger navigation

Page 52: Session 407 - Adopting Storyboards in Your App

Presenting ControllerDone

Reset

Billing ConfirmationName

... ...

Page 53: Session 407 - Adopting Storyboards in Your App

Presenting ControllerDone

Reset

Billing ConfirmationName

... ...

Page 54: Session 407 - Adopting Storyboards in Your App

Presenting ControllerDone

Reset

Billing ConfirmationName

... ...

Page 55: Session 407 - Adopting Storyboards in Your App

Confirmation

Presenting Controller

Unwind SeguesNew Ways to Use Storyboards

Billing

...Done

Reset

Name

...

Page 56: Session 407 - Adopting Storyboards in Your App

Confirmation

Presenting Controller

Unwind SeguesNew Ways to Use Storyboards

Billing

...Done

Reset

Name

...

Page 57: Session 407 - Adopting Storyboards in Your App

Confirmation

Presenting Controller

Unwind SeguesNew Ways to Use Storyboards

Billing

...Done

Reset

Name

...

Page 58: Session 407 - Adopting Storyboards in Your App

Picking the destinationUnwind Segues

• View controllers created in code/XIBs• Multiple paths back and forth

Page 59: Session 407 - Adopting Storyboards in Your App

• Resolve destination at runtime- (IBAction)done:(UIStoryboardSegue *)segue {

// React to the impending segue // Pull state back, etc.

}

Picking the destinationUnwind Segues

Page 60: Session 407 - Adopting Storyboards in Your App

• Resolve destination at runtime- (IBAction)done:(UIStoryboardSegue *)segue {

// React to the impending segue // Pull state back, etc.

}

Picking the destinationUnwind Segues

Page 61: Session 407 - Adopting Storyboards in Your App

• Resolve destination at runtime- (IBAction)done:(UIStoryboardSegue *)segue {

// React to the impending segue // Pull state back, etc.

}

Picking the destinationUnwind Segues

Page 62: Session 407 - Adopting Storyboards in Your App

Picking the destinationUnwind Segues

Confirmation

Done

Reset

Page 63: Session 407 - Adopting Storyboards in Your App

-done:-reset:

Picking the destinationUnwind Segues

Confirmation

Done

Reset

Unwind Segue

Page 64: Session 407 - Adopting Storyboards in Your App

Callback orderUnwind Segues

• Find the destination• Invoke -prepareForSegue:sender: on the source• Run the unwind action• Perform the segue

Page 65: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

Page 66: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

Page 67: Session 407 - Adopting Storyboards in Your App

Runtime searchingUnwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Page 68: Session 407 - Adopting Storyboards in Your App
Page 69: Session 407 - Adopting Storyboards in Your App

-canPerformUnwindSegueAction:fromViewController:sender:

Page 70: Session 407 - Adopting Storyboards in Your App

Unwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Page 71: Session 407 - Adopting Storyboards in Your App

Unwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Page 72: Session 407 - Adopting Storyboards in Your App
Page 73: Session 407 - Adopting Storyboards in Your App

-viewControllerForUnwindSegueAction:fromViewController:withSender:

For custom containers

Page 74: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

Page 75: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

Page 76: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

-reset:

Page 77: Session 407 - Adopting Storyboards in Your App
Page 78: Session 407 - Adopting Storyboards in Your App

-segueForUnwindingToViewController:fromViewController:sender:

For custom containers

Page 79: Session 407 - Adopting Storyboards in Your App

Runtime searchingUnwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

-reset:

Page 80: Session 407 - Adopting Storyboards in Your App

Runtime searchingUnwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

-reset: -prepareForSegue:sender:

Page 81: Session 407 - Adopting Storyboards in Your App

Runtime searchingUnwind Segues

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

-reset:

Page 82: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

Page 83: Session 407 - Adopting Storyboards in Your App

Presenting Controller

ConfirmationBilling

...Done

Reset

Name

...

Runtime searchingUnwind Segues

-done:

Page 84: Session 407 - Adopting Storyboards in Your App

DemoUnwind Segues

Page 85: Session 407 - Adopting Storyboards in Your App

More Information

Michael JurewitzDeveloper Tools [email protected]

Apple Developer Forumshttp://devforums.apple.com

Page 86: Session 407 - Adopting Storyboards in Your App

Labs

Interface Builder Lab Developer Tools Lab CThursday 9:00AM

Page 87: Session 407 - Adopting Storyboards in Your App

Intro to Storyboards Mixing Storyboardswith code/XIBs

New in iOS 6

Page 88: Session 407 - Adopting Storyboards in Your App
Page 89: Session 407 - Adopting Storyboards in Your App
Page 90: Session 407 - Adopting Storyboards in Your App
Page 91: Session 407 - Adopting Storyboards in Your App