Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build...
Transcript of Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build...
![Page 1: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/1.jpg)
© 2016 Apple Inc. All rights reserved. Redistribution or public display not permitted without written permission from Apple.
App Frameworks #WWDC16
Session 233
Making Apps Adaptive, Part 2
David Duncan iOS Apps and FrameworksKurt Revis iOS Apps and Frameworks
![Page 2: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/2.jpg)
PART 1
Aa
![Page 3: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/3.jpg)
PART 1 PART 2
Aa
![Page 4: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/4.jpg)
PART 1 PART 2
{}Aa
![Page 5: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/5.jpg)
Agenda
![Page 6: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/6.jpg)
Agenda
Basics of Sizes and Size Classes
![Page 7: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/7.jpg)
Agenda
Basics of Sizes and Size ClassesHow to Get the Most Out of UIKit
![Page 8: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/8.jpg)
Agenda
Basics of Sizes and Size ClassesHow to Get the Most Out of UIKitGoing Beyond Size Classes to Build Your Custom Experience
![Page 9: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/9.jpg)
Sizes
![Page 10: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/10.jpg)
![Page 11: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/11.jpg)
IPHONE 4S
IPAD PRO 12.9”
IPHONE SE
IPHONE 6S
IPHONE 6S+
IPAD PRO 9.7”
480
576
667
736
1024
1336
320 414375 768 1024 1336
12.9” LANDSCAPE
9.7” LANDSCAPE
6S+ LANDSCAPE
6S LANDSCAPE
SE4S LANDSCAPE
9.7” SLIDE OVERPORTRAIT
9.7” SPLIT VIEW2/3 PORTRAIT
9.7” SPLIT VIEW1/2 LANDSCAPE
9.7” SPLIT VIEW2/3 LANDSCAPE
12.9” SLIDEOVER PORTRAIT
12.9” SPLIT VIEW2/3 PORTRAIT
12.9” SPLIT VIEW1/2 LANDSCAPE
12.9” SPLIT VIEW2/3 LANDSCAPE
![Page 12: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/12.jpg)
![Page 13: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/13.jpg)
![Page 14: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/14.jpg)
![Page 15: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/15.jpg)
Compact Width Regular Width
Compact Height
Regular Height
![Page 16: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/16.jpg)
Your experience to makeRegular Size Class
![Page 17: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/17.jpg)
Views and Controls
![Page 18: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/18.jpg)
Views and Controls
![Page 19: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/19.jpg)
Views and Controls
![Page 20: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/20.jpg)
Presentations
![Page 21: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/21.jpg)
Presentations
![Page 22: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/22.jpg)
UISplitViewController
![Page 23: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/23.jpg)
UISplitViewController
![Page 24: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/24.jpg)
UISplitViewController
![Page 25: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/25.jpg)
UISplitViewController
![Page 26: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/26.jpg)
UISplitViewController
![Page 27: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/27.jpg)
UISplitViewController
![Page 28: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/28.jpg)
Making the most of UIKit and XcodeBest Practices
![Page 29: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/29.jpg)
Best Practices
![Page 30: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/30.jpg)
Best Practices
Xcode tools to get your app looking great faster
![Page 31: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/31.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder
![Page 32: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/32.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
![Page 33: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/33.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier
![Page 34: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/34.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier• Auto Layout
![Page 35: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/35.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier• Auto Layout• UITraitCollection
![Page 36: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/36.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier• Auto Layout• UITraitCollection• Dynamic Type
![Page 37: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/37.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier• Auto Layout• UITraitCollection• Dynamic Type• Layout Guides
![Page 38: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/38.jpg)
Best Practices
Xcode tools to get your app looking great faster• Interface Builder• Asset Catalogs
UIKit functionality to make it all easier• Auto Layout• UITraitCollection• Dynamic Type• Layout Guides• UIAppearance
![Page 39: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/39.jpg)
Images and TraitsAsset Catalogs
![Page 40: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/40.jpg)
Images and TraitsAsset Catalogs
Automatic image selection
![Page 41: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/41.jpg)
Images and TraitsAsset Catalogs
Automatic image selection
Design for Application Thinning
![Page 42: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/42.jpg)
Alignment InsetsAsset Catalogs
![Page 43: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/43.jpg)
Alignment InsetsAsset Catalogs
![Page 44: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/44.jpg)
Alignment InsetsAsset Catalogs
![Page 45: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/45.jpg)
Alignment InsetsAsset Catalogs
![Page 46: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/46.jpg)
Alignment InsetsAsset Catalogs
UIImage.withAlignmentRectInsets()
UIImage.alignmentRectInsets
![Page 47: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/47.jpg)
SlicingAsset Catalogs
![Page 48: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/48.jpg)
SlicingAsset Catalogs
![Page 49: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/49.jpg)
SlicingAsset Catalogs
UIImage.resizableImage(withCapInsets:)
UIImage.resizableImage(withCapInsets: resizingMode:)
UIImage.capInsets & UIImage.resizingMode
![Page 50: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/50.jpg)
SlicingAsset Catalogs
UIImage.resizableImage(withCapInsets:)
UIImage.resizableImage(withCapInsets: resizingMode:)
UIImage.capInsets & UIImage.resizingMode
![Page 51: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/51.jpg)
Dynamic Type
![Page 52: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/52.jpg)
Dynamic Type
We’ve made it easier than ever to adopt
![Page 53: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/53.jpg)
Dynamic Type
We’ve made it easier than ever to adoptUITraitCollection.preferredContentSizeCategory
NEW
![Page 54: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/54.jpg)
Dynamic Type
We’ve made it easier than ever to adoptUITraitCollection.preferredContentSizeCategory
Set up your text views• .font = UIFont.preferredFont(forTextStyle:)
• .adjustsFontForContentSizeCategory = true
NEW
![Page 55: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/55.jpg)
Dynamic Type
We’ve made it easier than ever to adoptUITraitCollection.preferredContentSizeCategory
Set up your text views• .font = UIFont.preferredFont(forTextStyle:)
• .adjustsFontForContentSizeCategory = true
Be sure to test with all Dynamic Type sizes!
NEW
![Page 56: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/56.jpg)
Dynamic Type
We’ve made it easier than ever to adoptUITraitCollection.preferredContentSizeCategory
Set up your text views• .font = UIFont.preferredFont(forTextStyle:)
• .adjustsFontForContentSizeCategory = true
Be sure to test with all Dynamic Type sizes!
What's New in UICollectionView Presidio Thursday 9:00AM
NEW
![Page 57: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/57.jpg)
UIView.layoutMarginGuideLayout Guides
![Page 58: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/58.jpg)
UIView.layoutMarginGuideLayout Guides
![Page 59: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/59.jpg)
UIView.layoutMarginGuideLayout Guides
UIView.layoutMargins.top
.bottom
.left .right
![Page 60: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/60.jpg)
UIView.layoutMarginGuideLayout Guides
UIView.layoutMargins.top
.bottom
.left .right
![Page 61: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/61.jpg)
UIView.layoutMarginGuideLayout Guides
UIView.layoutMargins.top
.bottom
.left .rightleadingAnchor trailingAnchor
topAnchor
bottomAnchor
![Page 62: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/62.jpg)
UIView.readableContentGuideLayout Guides
![Page 63: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/63.jpg)
UIView.readableContentGuideLayout Guides
Ideal Width
![Page 64: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/64.jpg)
UIView.readableContentGuideLayout Guides
Ideal Width
![Page 65: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/65.jpg)
UIView.readableContentGuideLayout Guides
Ideal Width
![Page 66: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/66.jpg)
The large brown fox jumped over the lazy rabbit
UIView.readableContentGuideLayout Guides
Ideal Width
![Page 67: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/67.jpg)
Ideal Width
UIView.readableContentGuideLayout Guides
![Page 68: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/68.jpg)
The large brown fox jumped over the lazy rabbit
Ideal Width
UIView.readableContentGuideLayout Guides
![Page 69: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/69.jpg)
UIAppearance
![Page 70: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/70.jpg)
UIAppearance
Declarative
![Page 71: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/71.jpg)
UIAppearance
Declarative• UITabBar.appearance().unselectedTintColor = UIColor.blue
![Page 72: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/72.jpg)
UIAppearance
Declarative• UITabBar.appearance().unselectedTintColor = UIColor.blue
Contextual
![Page 73: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/73.jpg)
UIAppearance
Declarative• UITabBar.appearance().unselectedTintColor = UIColor.blue
Contextual• Trait Collections
![Page 74: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/74.jpg)
UIAppearance
Declarative• UITabBar.appearance().unselectedTintColor = UIColor.blue
Contextual• Trait Collections• Containment
![Page 75: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/75.jpg)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 76: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/76.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 77: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/77.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 78: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/78.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
compactAppearance.setBackgroundImage(nil, for: .default)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 79: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/79.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
compactAppearance.setBackgroundImage(nil, for: .default)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 80: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/80.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
compactAppearance.setBackgroundImage(nil, for: .default)
let verticalRegularTrait = UITraitCollection(verticalSizeClass: .regular)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 81: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/81.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
compactAppearance.setBackgroundImage(nil, for: .default)
let verticalRegularTrait = UITraitCollection(verticalSizeClass: .regular)
let verticalAppearance = UINavigationBar.forTraitCollection(verticalRegularTrait)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 82: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/82.jpg)
let verticalCompactTrait = UITraitCollection(verticalSizeClass: .compact)
let compactAppearance = UINavigationBar.forTraitCollection(verticalCompactTrait)
compactAppearance.setBackgroundImage(nil, for: .default)
let verticalRegularTrait = UITraitCollection(verticalSizeClass: .regular)
let verticalAppearance = UINavigationBar.forTraitCollection(verticalRegularTrait)
verticalAppearance.setBackgroundImage(UIImage(), for: .default)
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions:
[NSObject: AnyObject]?) -> Bool {
}
![Page 83: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/83.jpg)
Best Practices
![Page 84: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/84.jpg)
Best Practices
Asset Catalogs
![Page 85: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/85.jpg)
Best Practices
Asset CatalogsDynamic Type
![Page 86: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/86.jpg)
Best Practices
Asset CatalogsDynamic TypeLayout Guides
![Page 87: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/87.jpg)
Best Practices
Asset CatalogsDynamic TypeLayout GuidesUIAppearance
![Page 88: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/88.jpg)
TakeawayThe system is going to do most of the work so you don’t have to.
![Page 89: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/89.jpg)
If you want to go beyond what the system provides, here’s how.
![Page 90: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/90.jpg)
Beyond the Basics
![Page 91: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/91.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and size
![Page 92: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/92.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and sizeImplement each design and change between them
![Page 93: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/93.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and sizeImplement each design and change between themUse reusable elements
![Page 94: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/94.jpg)
My Incredibly Adaptive App
![Page 95: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/95.jpg)
My Incredibly Adaptive App
Item Title Description
1 A Lorem ipsum dolor sit er elit lamet…
2 B Ut enim ad minim veniam, quis nostrud…
3 C Duis aute irure dolor in reprehenderit…
![Page 96: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/96.jpg)
![Page 97: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/97.jpg)
A
B
C
Design 1: “Tall”
![Page 98: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/98.jpg)
A
B
C
A B C
Design 1: “Tall” Design 2: “Wide”
![Page 99: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/99.jpg)
A
B
C
A B C
Width < Height
Design 1: “Tall” Design 2: “Wide”
![Page 100: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/100.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
![Page 101: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/101.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
![Page 102: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/102.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
![Page 103: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/103.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
![Page 104: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/104.jpg)
Design your app for different adaptations
![Page 105: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/105.jpg)
Design your app for different adaptations
Consider the possible combinations of device, orientation, and size
![Page 106: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/106.jpg)
Design your app for different adaptations
Consider the possible combinations of device, orientation, and sizeMake designs
![Page 107: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/107.jpg)
Design your app for different adaptations
Consider the possible combinations of device, orientation, and sizeMake designsDefine rules for which design to use
![Page 108: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/108.jpg)
Defining Rules
![Page 109: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/109.jpg)
Defining Rules
Check if size exactly matches
![Page 110: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/110.jpg)
Defining Rules
Check if size exactly matches
![Page 111: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/111.jpg)
Defining Rules
Define Boolean conditions
Check if size exactly matches
![Page 112: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/112.jpg)
Defining Rules
Define Boolean conditions• Use size class
Check if size exactly matches
![Page 113: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/113.jpg)
Defining Rules
Define Boolean conditions• Use size class• Compare value to a threshold
Check if size exactly matches
![Page 114: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/114.jpg)
Defining Rules
Define Boolean conditions• Use size class• Compare value to a threshold • Compare values to each other
Check if size exactly matches
![Page 115: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/115.jpg)
![Page 116: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/116.jpg)
![Page 117: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/117.jpg)
Implement the Designs
![Page 118: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/118.jpg)
Implement the Designs
Find the size of the app
![Page 119: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/119.jpg)
Implement the Designs
Find the size of the appUse the rules to decide which design to use
![Page 120: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/120.jpg)
Implement the Designs
Find the size of the appUse the rules to decide which design to useApply the design to the UI
![Page 121: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/121.jpg)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
Where Does the Code Go?
![Page 122: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/122.jpg)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
Where Does the Code Go?
![Page 123: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/123.jpg)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
Where Does the Code Go?
• View is loaded on demand
![Page 124: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/124.jpg)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
Where Does the Code Go?
• View is loaded on demand• View is not yet in a superview, and layout has not yet happened
![Page 125: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/125.jpg)
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
Use init(), loadView(), and viewDidLoad() only for code that is the same across designs
Where Does the Code Go?
• View is loaded on demand• View is not yet in a superview, and layout has not yet happened
![Page 126: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/126.jpg)
override func viewWillLayoutSubviews() {
// Add code here
}
Where Does the Code Go?
![Page 127: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/127.jpg)
override func viewWillLayoutSubviews() {
// Add code here
}
Where Does the Code Go?
![Page 128: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/128.jpg)
override func viewWillLayoutSubviews() {
// Add code here
}
• View is in a superview, and layout of superviews has happened
Where Does the Code Go?
![Page 129: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/129.jpg)
override func viewWillLayoutSubviews() {
// Add code here
}
• View is in a superview, and layout of superviews has happened• Good time to manipulate things inside your view controller
Where Does the Code Go?
![Page 130: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/130.jpg)
Be Careful with Layout
override func viewWillLayoutSubviews() {
// Add code here
}
![Page 131: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/131.jpg)
Be Careful with Layout
override func viewWillLayoutSubviews() {
// Add code here
}!
![Page 132: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/132.jpg)
Be Careful with Layout
override func viewWillLayoutSubviews() {
// Add code here
}
• Do as little work as possible
!
![Page 133: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/133.jpg)
Be Careful with Layout
override func viewWillLayoutSubviews() {
// Add code here
}
• Do as little work as possible• Find out what has changed since last time
!
![Page 134: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/134.jpg)
Be Careful with Layout
override func viewWillLayoutSubviews() {
// Add code here
}
• Do as little work as possible• Find out what has changed since last time• Don’t cause a layout loop
!
![Page 135: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/135.jpg)
Be Careful with Layout
What's New in Auto Layout Presidio Friday 3:00PM
override func viewWillLayoutSubviews() {
// Add code here
}
• Do as little work as possible• Find out what has changed since last time• Don’t cause a layout loop
!
![Page 136: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/136.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
![Page 137: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/137.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
Each item is a view
![Page 138: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/138.jpg)
A
B
C
A B C
Width < Height Width >= Height
Design 1: “Tall” Design 2: “Wide”
Each item is a viewUse UIStackView for horizontal and vertical arrangement
![Page 139: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/139.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 140: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/140.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 141: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/141.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 142: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/142.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 143: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/143.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 144: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/144.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 145: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/145.jpg)
class SimpleExampleViewController: UIViewController {
@IBOutlet var stackView : UIStackView!
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let useWideDesign = size.width >= size.height
if useWideDesign {
stackView.axis = .horizontal
} else {
stackView.axis = .vertical
}
}
}
![Page 146: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/146.jpg)
![Page 147: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/147.jpg)
![Page 148: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/148.jpg)
![Page 149: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/149.jpg)
![Page 150: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/150.jpg)
![Page 151: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/151.jpg)
“Can you make it pop?”
![Page 152: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/152.jpg)
“Can you make it pop?”
During rotation, make the items grow
![Page 153: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/153.jpg)
“Can you make it pop?”
During rotation, make the items growAfter rotation, go back to normal
![Page 154: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/154.jpg)
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
coordinator.animate(alongsideTransition:
{ _ in
stackView.transform = CGAffineTransform(scaleX: 1.4, y: 1.4)
},
completion:
{ _ in
UIView.animate(withDuration: 0.5, animations: {
stackView.transform = CGAffineTransform.identity
})
}
)
}
![Page 155: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/155.jpg)
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
coordinator.animate(alongsideTransition:
{ _ in
stackView.transform = CGAffineTransform(scaleX: 1.4, y: 1.4)
},
completion:
{ _ in
UIView.animate(withDuration: 0.5, animations: {
stackView.transform = CGAffineTransform.identity
})
}
)
}
![Page 156: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/156.jpg)
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
coordinator.animate(alongsideTransition:
{ _ in
stackView.transform = CGAffineTransform(scaleX: 1.4, y: 1.4)
},
completion:
{ _ in
UIView.animate(withDuration: 0.5, animations: {
stackView.transform = CGAffineTransform.identity
})
}
)
}
![Page 157: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/157.jpg)
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
coordinator.animate(alongsideTransition:
{ _ in
stackView.transform = CGAffineTransform(scaleX: 1.4, y: 1.4)
},
completion:
{ _ in
UIView.animate(withDuration: 0.5, animations: {
stackView.transform = CGAffineTransform.identity
})
}
)
}
![Page 158: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/158.jpg)
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
coordinator.animate(alongsideTransition:
{ _ in
stackView.transform = CGAffineTransform(scaleX: 1.4, y: 1.4)
},
completion:
{ _ in
UIView.animate(withDuration: 0.5, animations: {
stackView.transform = CGAffineTransform.identity
})
}
)
}
![Page 159: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/159.jpg)
![Page 160: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/160.jpg)
![Page 161: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/161.jpg)
![Page 162: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/162.jpg)
![Page 163: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/163.jpg)
![Page 164: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/164.jpg)
Reusable Elements
![Page 165: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/165.jpg)
Reusable Elements
Build your app out of pieces that can be reused in different designs
![Page 166: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/166.jpg)
Reusable Elements
Build your app out of pieces that can be reused in different designs
Each piece is typically a view controller
![Page 167: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/167.jpg)
Reusable Elements
Build your app out of pieces that can be reused in different designs
Each piece is typically a view controller• View tree and constraints
![Page 168: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/168.jpg)
Reusable Elements
Build your app out of pieces that can be reused in different designs
Each piece is typically a view controller• View tree and constraints• Connections to other view controllers
![Page 169: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/169.jpg)
Reusable Elements
Build your app out of pieces that can be reused in different designs
Each piece is typically a view controller• View tree and constraints• Connections to other view controllers• Connections to the rest of your app
![Page 170: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/170.jpg)
View Controller Roles
![Page 171: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/171.jpg)
View Controller Roles
Container View Controller
![Page 172: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/172.jpg)
View Controller Roles
Contained View Controller
Container View Controller
![Page 173: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/173.jpg)
A
B
C
A B C
Design 1: “Tall” Design 2: “Wide”
![Page 174: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/174.jpg)
ExampleContainerViewController
A
B
C
A B C
Design 1: “Tall” Design 2: “Wide”
![Page 175: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/175.jpg)
ExampleContainerViewController
ElementViewController
ElementViewController
ElementViewController
A
B
C
A B C
Design 1: “Tall” Design 2: “Wide”
![Page 176: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/176.jpg)
A
B
C
![Page 177: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/177.jpg)
A
B
C
A…………………..
……………….……..
Tap preview to present
![Page 178: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/178.jpg)
A
B
C
A…………………..
……………….……..
Tap preview to present
Tap detail to dismiss
![Page 179: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/179.jpg)
A
B
C
A…………………..
……………….……..
Tap preview to present
Tap detail to dismiss
ExampleContainerViewController
![Page 180: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/180.jpg)
A
B
C
A…………………..
……………….……..
Tap preview to present
Tap detail to dismiss
ExampleContainerViewController
SmallElementViewController
![Page 181: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/181.jpg)
A
B
C
A…………………..
……………….……..
Tap preview to present
Tap detail to dismiss
ExampleContainerViewController
SmallElementViewController LargeElementViewController
![Page 182: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/182.jpg)
A…………………..
B……….
……
C……….
……
![Page 183: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/183.jpg)
A…………………..
B……….
……
C……….
……
ExampleContainerViewController
LargeElementViewController
![Page 184: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/184.jpg)
Contained View Controllers
![Page 185: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/185.jpg)
Contained View Controllers
![Page 186: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/186.jpg)
Contained View Controllers
![Page 187: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/187.jpg)
Contained View Controllers
![Page 188: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/188.jpg)
Contained View Controllers
![Page 189: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/189.jpg)
Contained View Controllers
![Page 190: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/190.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 191: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/191.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 192: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/192.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 193: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/193.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 194: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/194.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 195: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/195.jpg)
class SmallElementViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: "largeElement")
present(newElementViewController, animated: true, completion: nil)
}
}
}
![Page 196: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/196.jpg)
class LargeElementViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
if isBeingPresented() {
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
dismiss(animated: true, completion: nil)
}
}
}
![Page 197: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/197.jpg)
class LargeElementViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
if isBeingPresented() {
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
dismiss(animated: true, completion: nil)
}
}
}
![Page 198: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/198.jpg)
class LargeElementViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
if isBeingPresented() {
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
dismiss(animated: true, completion: nil)
}
}
}
![Page 199: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/199.jpg)
class LargeElementViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
if isBeingPresented() {
let tapGestureRecognizer = UITapGestureRecognizer(
target: self, action: #selector(self.tapped))
view.addGestureRecognizer(tapGestureRecognizer)
}
}
func tapped(_ gestureRecognizer: UITapGestureRecognizer) {
if gestureRecognizer.state == .ended {
dismiss(animated: true, completion: nil)
}
}
}
![Page 200: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/200.jpg)
Design Object
![Page 201: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/201.jpg)
Design Object
Stores information describing a design
![Page 202: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/202.jpg)
Design Object
Stores information describing a designImmutable struct for safety
![Page 203: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/203.jpg)
Design Object
Stores information describing a designImmutable struct for safetyAllows comparison
![Page 204: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/204.jpg)
struct Design {
let axis: UILayoutConstraintAxis // .vertical or .horizontal
enum ElementKind {
case small
case large
}
let elementKind: ElementKind
var elementIdentifier: String {
switch elementKind {
case .small: return "smallElement"
case .large: return "largeElement"
}
}
}
![Page 205: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/205.jpg)
struct Design {
let axis: UILayoutConstraintAxis // .vertical or .horizontal
enum ElementKind {
case small
case large
}
let elementKind: ElementKind
var elementIdentifier: String {
switch elementKind {
case .small: return "smallElement"
case .large: return "largeElement"
}
}
}
![Page 206: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/206.jpg)
struct Design {
let axis: UILayoutConstraintAxis // .vertical or .horizontal
enum ElementKind {
case small
case large
}
let elementKind: ElementKind
var elementIdentifier: String {
switch elementKind {
case .small: return "smallElement"
case .large: return "largeElement"
}
}
}
![Page 207: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/207.jpg)
struct Design {
let axis: UILayoutConstraintAxis // .vertical or .horizontal
enum ElementKind {
case small
case large
}
let elementKind: ElementKind
var elementIdentifier: String {
switch elementKind {
case .small: return "smallElement"
case .large: return "largeElement"
}
}
}
![Page 208: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/208.jpg)
extension Design: Equatable { }
func == (left: Design, right: Design) -> Bool {
return left.axis == right.axis && left.elementKind == right.elementKind
}
![Page 209: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/209.jpg)
extension Design: Equatable { }
func == (left: Design, right: Design) -> Bool {
return left.axis == right.axis && left.elementKind == right.elementKind
}
![Page 210: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/210.jpg)
Container View Controller
![Page 211: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/211.jpg)
Container View Controller
Has three child view controllers
![Page 212: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/212.jpg)
Container View Controller
Has three child view controllersUses rules to decide a design
![Page 213: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/213.jpg)
Container View Controller
Has three child view controllersUses rules to decide a designUpdates at each layout
![Page 214: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/214.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 215: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/215.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 216: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/216.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 217: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/217.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 218: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/218.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 219: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/219.jpg)
class ExampleContainerViewController: UIViewController {
var elementViewControllers: [UIViewController?] = [nil, nil, nil]
var displayedDesign: Design? = nil
override func viewWillLayoutSubviews() {
let size = view.bounds.size
let newDesign = decideDesign(size)
if displayedDesign != newDesign {
applyDesign(newDesign)
displayedDesign = newDesign
}
}
![Page 220: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/220.jpg)
func decideDesign(_ size: CGSize) -> Design {
let axis: UILayoutConstraintAxis
if size.width > size.height {
axis = .horizontal
} else {
axis = .vertical
}
let elementKind: Design.ElementKind
let widthThreshold = CGFloat(750)
if size.width < widthThreshold {
elementKind = .small
} else {
elementKind = .large
}
return Design(axis: axis, elementKind: elementKind)
}
![Page 221: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/221.jpg)
func decideDesign(_ size: CGSize) -> Design {
let axis: UILayoutConstraintAxis
if size.width > size.height {
axis = .horizontal
} else {
axis = .vertical
}
let elementKind: Design.ElementKind
let widthThreshold = CGFloat(750)
if size.width < widthThreshold {
elementKind = .small
} else {
elementKind = .large
}
return Design(axis: axis, elementKind: elementKind)
}
![Page 222: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/222.jpg)
func decideDesign(_ size: CGSize) -> Design {
let axis: UILayoutConstraintAxis
if size.width > size.height {
axis = .horizontal
} else {
axis = .vertical
}
let elementKind: Design.ElementKind
let widthThreshold = CGFloat(750)
if size.width < widthThreshold {
elementKind = .small
} else {
elementKind = .large
}
return Design(axis: axis, elementKind: elementKind)
}
![Page 223: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/223.jpg)
func decideDesign(_ size: CGSize) -> Design {
let axis: UILayoutConstraintAxis
if size.width > size.height {
axis = .horizontal
} else {
axis = .vertical
}
let elementKind: Design.ElementKind
let widthThreshold = CGFloat(750)
if size.width < widthThreshold {
elementKind = .small
} else {
elementKind = .large
}
return Design(axis: axis, elementKind: elementKind)
}
![Page 224: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/224.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 225: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/225.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 226: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/226.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 227: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/227.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 228: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/228.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 229: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/229.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 230: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/230.jpg)
func applyDesign(_ newDesign: Design) {
stackView.axis = newDesign.axis
if displayedDesign?.elementKind != newDesign.elementKind {
for (index, elementViewController) in elementViewControllers.enumerated() {
if let oldElementViewController = elementViewController {
removeOldElementViewController(oldElementViewController)
}
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let newElementViewController = storyboard.instantiateViewController(
withIdentifier: newDesign.elementIdentifier)
addNewElementViewController(newElementViewController)
elementViewControllers[index] = newElementViewController
}
}
}
![Page 231: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/231.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 232: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/232.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 233: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/233.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 234: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/234.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 235: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/235.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 236: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/236.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 237: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/237.jpg)
// Helper functions to be a well-behaved container view controller:
func addNewElementViewController(_ elementViewController: UIViewController)
{
addChildViewController(elementViewController)
stackView.addArrangedSubview(elementViewController.view)
elementViewController.didMove(toParentViewController: self)
}
func removeOldElementViewController(_ elementViewController: UIViewController)
{
elementViewController.willMove(toParentViewController: nil)
elementViewController.view.removeFromSuperview()
elementViewController.removeFromParentViewController()
}
![Page 238: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/238.jpg)
1024 x 768
![Page 239: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/239.jpg)
1024 x 768
![Page 240: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/240.jpg)
1024 x 768
![Page 241: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/241.jpg)
1024 x 768
![Page 242: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/242.jpg)
1024 x 768
![Page 243: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/243.jpg)
1024 x 768
![Page 244: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/244.jpg)
1024 x 768
![Page 245: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/245.jpg)
1024 x 768
![Page 246: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/246.jpg)
Beyond the Basics
![Page 247: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/247.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and size
![Page 248: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/248.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and sizeImplement each design and change between them
![Page 249: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/249.jpg)
Beyond the Basics
Design for all combinations of device, orientation, and sizeImplement each design and change between themUse reusable elements
![Page 250: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/250.jpg)
PART 1 PART 2
{}Aa
![Page 252: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/252.jpg)
Related Sessions
Making Apps Adaptive, Part 1 Presidio Wednesday 11:00AM
Inclusive App Design Pacific Heights Tuesday 10:00AM
What’s New in UICollectionView in iOS 10 Presidio Thursday 9:00AM
What's New in Auto Layout Presidio Friday 3:00PM
Building Adaptive Apps with UIKit WWDC 2014
Adopting Multitasking in iOS 9 WWDC 2015
![Page 253: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/253.jpg)
Labs
Cocoa Touch and 3D Touch Lab Frameworks Lab C Friday 10:30AM
![Page 254: Making Apps Adaptive, Part 2 · How to Get the Most Out of UIKit Going Beyond Size Classes to Build Your Custom Experience. Sizes. IPHONE 4S IPAD PRO 12.9” IPHONE SE IPHONE 6S IPHONE](https://reader034.fdocuments.us/reader034/viewer/2022050305/5f6d69757426d9108530492c/html5/thumbnails/254.jpg)