getting started with multitasking on ipad in ios...

© 2015 Apple Inc. All rights reserved. Redistribution or public display not permitted without written permission from Apple.

#WWDC15

Getting Started with Multitasking on iPad in iOS 9

Peter Hajas UIKit EngineerJacob Xiao UIKit EngineerKurt Revis UIKit Engineer

App Frameworks

Session 205

Multitasking Sessions

Getting Started with Multitasking on iPad in iOS 9 Presidio Tuesday 4:30PM

Multitasking Essentials for Media-Based Apps on iPad in iOS 9 Pacific Heights Wednesday 2:30PM

Optimizing Your App for Multitasking in iOS Presidio Wednesday 3:30PM

Multitasking Sessions

Getting Started with Multitasking on iPad in iOS 9 Presidio Tuesday 4:30PM

Multitasking Essentials for Media-Based Apps on iPad in iOS 9 Pacific Heights Wednesday 2:30PM


Getting Started with Multitasking on iPad in iOS 9

Agenda

Multitasking in your appChanges to UIKit for MultitaskingMaking the Most of Multitasking

Slide Over

Split View

Adaptivity

Designing for AdaptivityUniversal apps

iPadiPhone

RegularCompact

Designing for AdaptivityiOS 8

Designing for AdaptivityiOS 8

RegularCompact

iPhone 6 Plus

Designing for AdaptivityiPhone 6 Plus

Compact

Designing for AdaptivityiPhone 6 Plus

Regular

iPad Multitasking

Designing for AdaptivityiPad Multitasking


Compact


Regular

Why adopt Multitasking?

Let users get into your appand spend more time in new ways

Adding iPad Multitasking to Your App

Adding Multitasking to Your AppNew iOS 9 apps

iPad Multitasking is enabled by default in new projects

Adding Multitasking to Your AppExisting iOS apps

Build your app with the iOS 9 SDKSupport all orientationsUse Launch Storyboards

Adding Multitasking to Your AppExisting iOS apps

Build your app with the iOS 9 SDK

Opt out with the UIRequiresFullscreen key

Support all orientationsUse Launch Storyboards

iPad Multitasking in Your AppMultitasking, how does it work?

UIScreen

UIScreen.bounds Returns the Screen Bounds


UIScreenUIWindow


UIWindow

UIWindow.bounds Returns the Window Bounds

UIWindow

UIWindow.bounds Origin Always at (0,0)

UIWindow

UIWindow

UIWindow

Horizontally Compact

Horizontally Regular

Auto Layout

Makes resizing much easier for your app to handleRight-to-left language support

Legibility Improvements

UIView.readableContentGuide• UILayoutGuide for legible region in a UIView

Legibility Improvements

UITableView.cellLayoutMarginsFollowReadableWidth• Adds margins to cells for legibility

What’s ChangedBest Practices

Jacob Xiao iOS Frameworks Engineer

What’s Changed?

Building Adaptive Apps with UIKit WWDC14

What’s Changed?

Not much!

Building Adaptive Apps with UIKit WWDC14

Orientation

Orientation

if UIInterfaceOrientationIsLandscape(interfaceOrientation) {

// ... }

Orientation

iPhone Rotation

iPad Rotation

Multitasking Resize

Orientation

if UIInterfaceOrientationIsLandscape(interfaceOrientation) {

// ... }

Bounds

if view.bounds.size.width > view.bounds.size.height {

// ... }

Size Classes

if traitCollection.horizontalSizeClass == .Regular {

// ... }

Transitions

Responding to Rotation

willRotateToInterfaceOrientation

didRotateFromInterfaceOrientation

willAnimateRotationToInterfaceOrientation

Responding to Rotation and Resizing

willTransitionToTraitCollection

viewWillTransitionToSize

Rotation

RotationSetup

RotationSetup

Create Animations

RotationSetup

Create Animations

Run Animations

RotationSetup

Create Animations

Run Animations

Cleanup

RotationSetup

Create Animations

Run Animations

Cleanup

Sizes Change

RotationwillTransitionToTraitCollection viewWillTransitionToSizeSetup

Create Animations

Run Animations

Cleanup

Sizes Change

RotationwillTransitionToTraitCollection viewWillTransitionToSizetraitCollectionDidChange

Setup

Create Animations

Run Animations

Cleanup

Sizes Change

RotationwillTransitionToTraitCollection viewWillTransitionToSize

animateAlongsideTransition

traitCollectionDidChange

Setup

Create Animations

Run Animations

Cleanup

Sizes Change

RotationwillTransitionToTraitCollection viewWillTransitionToSize


completion


Setup

Create Animations

Run Animations

Cleanup

Sizes Change

Multitasking Resize

Multitasking ResizeSetup

Multitasking ResizeSetup

Create Animations

Multitasking ResizewillTransitionToTraitCollection viewWillTransitionToSize


completion


Setup

Create Animations

Run Animations

Cleanup

Sizes Change

Multitasking ResizewillTransitionToTraitCollection


completion

traitCollectionDidChangeviewWillTransitionToSize



completion

traitCollectionDidChangeTime LimitviewWillTransitionToSize



completion

traitCollectionDidChangeviewWillTransitionToSizeSetup

Create Animations

Run Animations

Cleanup

Sizes Change

Multitasking Resize


completion

viewWillTransitionToSizeSetup

Create Animations

Run Animations

Cleanup

Sizes Change



completion


Setup

Create Animations

Run Animations

Cleanup

Sizes Change



completion

traitCollectionDidChangeviewWillTransitionToSizeSetup

Create Animations

Run Animations

Cleanup

Sizes Change

Windows

Windows

UIWindow

Windows

UIWindow

UIWindow

Windows

SWIFT:

UIWindow(frame: UIScreen.mainScreen.bounds())

OBJECTIVE-C:

[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]

Windows

SWIFT:

UIWindow()

OBJECTIVE-C:

[[UIWindow alloc] init]

Presentation

Presentation

UIPresentationController

Presentation

UIPresentationController

A Look Inside Presentation Controllers WWDC14

Adaptive Presentation


UIAdaptivePresentationControllerDelegate


UIAdaptivePresentationControllerDelegate

adaptivePresentationStyleForPresentationController

willPresentWithAdaptiveStyle

Popover

Popover Source

popoverPresentationController.barButtonItem = sender

Popover Source

popoverPresentationController.barButtonItem = sender

OR

popoverPresentationController.sourceView = button

popoverPresentationController.sourceRect = button.bounds

Keyboard

Keyboard

UIKeyboardWillShowNotification

UIKeyboardDidShowNotification

UIKeyboardWillHideNotification

UIKeyboardDidHideNotification

UIKeyboardWillChangeFrameNotification

UIKeyboardDidChangeFrameNotification

Keyboard

Best Practices

Best Practices

Consider size and Size Class instead of orientation

Best Practices

Consider size and Size Class instead of orientationThink about how to respond to transition

Best Practices

Consider size and Size Class instead of orientationThink about how to respond to transitionUse adaptive presentations

Making the Most of MultitaskingDeliver a great user experience

Kurt Revis iOS Frameworks Engineer

MultitaskingDesign for Adaptivity


Make your app Universal — iPhone and iPad


Make your app Universal — iPhone and iPadDesign user experiences for Compact and Regular widths


Make your app Universal — iPhone and iPadDesign user experiences for Compact and Regular widthsUse Adaptivity to change between them

MultitaskingAdapting to dynamic size changes

StrategiesGuidelines

Strategies1: Be flexible


Try all the Multitasking cases


Try all the Multitasking casesWatch your app’s UI carefully


Try all the Multitasking casesWatch your app’s UI carefullyConcentrate on layout


Slide Over


Slide OverMake it bigger


Slide OverMake it biggerFull screen


Slide OverMake it biggerFull screen Slide Over another app, and use Split View


Slide OverMake it biggerFull screen Slide Over another app, and use Split ViewRotate

Strategies2: Auto Layout


The way to make your UI flexible


The way to make your UI flexibleYou provide views and constraints


The way to make your UI flexibleYou provide views and constraintsAuto Layout sets your views’ frames


The way to make your UI flexibleYou provide views and constraintsAuto Layout sets your views’ framesMargins and guides


The way to make your UI flexibleYou provide views and constraintsAuto Layout sets your views’ framesMargins and guidesConvenience APIs


The way to make your UI flexibleYou provide views and constraintsAuto Layout sets your views’ framesMargins and guidesConvenience APIs

Mysteries of Auto Layout, Part 1 Presidio Thursday 11AM

Mysteries of Auto Layout, Part 2 Presidio Thursday 1:30PM


let label = UILabel()


let label = UILabel() let readableContentGuide = self.view.readableContentGuide



let constraints = [ label.leadingAnchor.constraintEqualToAnchor( readableContentGuide.leadingAnchor),



let constraints = [ label.leadingAnchor.constraintEqualToAnchor( readableContentGuide.leadingAnchor), label.trailingAnchor.constraintEqualToAnchor( readableContentGuide.trailingAnchor)]



let constraints = [ label.leadingAnchor.constraintEqualToAnchor( readableContentGuide.leadingAnchor), label.trailingAnchor.constraintEqualToAnchor( readableContentGuide.trailingAnchor)]

NSLayoutConstraint.activateConstraints(constraints)

Strategies3: Size Classes in Xcode


Interface Builder (Storyboards and XIBs)


Interface Builder (Storyboards and XIBs)• Add or remove views and constraints


Interface Builder (Storyboards and XIBs)• Add or remove views and constraints• Change attributes of views



Asset Catalogs



Asset Catalogs• Use different versions of images

Strategies4: Adaptivity callbacks


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { }


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { }

override func viewWillTransitionToSize( size: CGSize, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { }


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) {


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { super.willTransitionToTraitCollection(newCollection, withTransitionCoordinator:coordinator)


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { super.willTransitionToTraitCollection(newCollection, withTransitionCoordinator:coordinator) switch newCollection.horizontalSizeClass {


override func willTransitionToTraitCollection( newCollection: UITraitCollection, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) { super.willTransitionToTraitCollection(newCollection, withTransitionCoordinator:coordinator) switch newCollection.horizontalSizeClass { case .Compact: // Change your UI for a compact width case .Regular: // Change your UI for a regular width case .Unspecified: break // Do nothing } }



let animation = { (context: UIViewControllerTransitionCoordinatorContext) -> Void in // Change your UI here. It will animate from the old to the new. }



let animation = { (context: UIViewControllerTransitionCoordinatorContext) -> Void in // Change your UI here. It will animate from the old to the new. } coordinator.animateAlongsideTransition(animation, completion: nil) }

Strategies5: High-level API


Adaptive Presentation Controllers


Adaptive Presentation ControllersUITableView


Adaptive Presentation ControllersUITableViewUICollectionView


Adaptive Presentation ControllersUITableViewUICollectionViewUIStackView


Adaptive Presentation ControllersUITableViewUICollectionViewUIStackView

Mysteries of Auto Layout, Part 1 Presidio Thursday 11AM

Strategies6: Split View Controller

Split View Controller

UISplitViewController

Split View Controller

UISplitViewController

Primary UIViewController Secondary UIViewController

Split View ControllerUISplitViewController

Primary UIViewController Secondary UIViewController

Split View ControllerXcode template

Strategies

Be flexibleAuto LayoutSize Classes in XcodeAdaptivity CallbacksHigh-level APISplit View Controller

Strategies

AdaptivePhotos

Sample code

GuidelinesThe user controls your app’s size


The app cannot prevent size changes


The app cannot prevent size changesIt cannot cause size changes either


The app cannot prevent size changesIt cannot cause size changes eitherSize changes can happen at any time

GuidelinesKeep the user oriented


Home☐ Chores☐ Sleep

Work☐ Code☐ Fix Bugs☐ Coffee

School☐ Read☐ Write



School☐ Read

Regular Width




Regular Width




Compact Width



School☐ Read




✅


Don’t make abrupt jumps


Don’t make abrupt jumpsBe smart in new ways


Don’t make abrupt jumpsBe smart in new waysEspecially going from large to small

GuidelinesAfter becoming inactive


Your app’s size may change


Your app’s size may changeAdaptivity methods are still called, but nothing is visible


Your app’s size may changeAdaptivity methods are still called, but nothing is visibleThe system restores the original size

1. App is active and Compact Work☐ Code☐ Fix Bugs☐ Coffee

✅

1. App is active and Compact2. User presses Home button


✅

1. App is active and Compact2. User presses Home button3. System takes snapshot


✅



1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular



1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact


1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app


1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app8. System shows snapshot from step 3



✅

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app8. System shows snapshot from step 39. Fades into live app



✅




1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact


✅

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app


✅

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app8. System shows snapshot from step 3


✅

1. App is active and Compact2. User presses Home button3. System takes snapshot4. System resizes app to Regular5. System takes another snapshot6. System resizes app to Compact7. User activates app8. System shows snapshot from step 39. Fades into live app


✅


Maintain the same appearance


Maintain the same appearanceOn deactivation:• Remember your size and state


Maintain the same appearanceOn deactivation:• Remember your size and state

On size change:• if inactive && newSize == originalSize

- Then apply the remembered state

Primary App

Secondary App

GuidelinesExternal display

GuidelinesExternal display

Only seen by the primary app

GuidelinesPerformance


When the size changes, do as little work as possible


When the size changes, do as little work as possibleUse completion blocks for slow work


When the size changes, do as little work as possibleUse completion blocks for slow workIn animation blocks, don’t call layoutIfNeeded


When the size changes, do as little work as possibleUse completion blocks for slow workIn animation blocks, don’t call layoutIfNeededUse setNeedsLayout

Adopting Multitasking in iOS 9Summary

Adopt Multitasking in your appUse AdaptivityYou can deliver a great user experience

More Information

DocumentationWhat’s New in iOSiOS App Programming GuideAdopting Multitasking Enhancements on iPad

Sample CodeAdaptivePhotosLister

http://developer.apple.com/ios

Technical SupportApple Developer ForumsDeveloper Technical Support

General InquiriesCurt Rothert, App Frameworks [email protected]

Related Sessions

Multitasking Essentials for Media-Based Appson iPad in iOS 9 Mission Wednesday 2:30PM


Cocoa Touch and Multitasking Lab Frameworks Lab B Wednesday9:00AM, 3:30PM

getting started with multitasking on ipad in ios...

Documents