├── LICENSE ├── README.md ├── SwiftUI with Size Classes.xcodeproj ├── project.pbxproj ├── project.xcworkspace │ ├── contents.xcworkspacedata │ └── xcshareddata │ │ └── IDEWorkspaceChecks.plist └── xcuserdata │ └── renaudjenny.xcuserdatad │ └── xcschemes │ └── xcschememanagement.plist ├── SwiftUI with Size Classes ├── Assets.xcassets │ ├── AppIcon.appiconset │ │ └── Contents.json │ └── Contents.json ├── Base.lproj │ └── LaunchScreen.storyboard ├── ContentView.swift ├── CubeView.swift ├── Info.plist ├── Preview Content │ └── Preview Assets.xcassets │ │ └── Contents.json ├── SceneDelegate.swift ├── SizeClassesExampleApp.swift └── SwiftUI with Size Classes.entitlements └── docs └── assets ├── iPadFullscreen.png ├── iPadSplitView.png ├── iPhoneLandscape.png ├── iPhoneLandscapeLarge.png ├── iPhonePortrait.png └── macOS.png /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Renaud Jenny 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # SwiftUI with Size Classes 2 | 3 | In SwiftUI, there is no built-in easy way to know the device screen sizes and orientations (portrait or landscape). 4 | 5 | But there is something better: Size Classes. Size Class allow you to take in account more than just device orientation. 6 | 7 | For instance, iPad allows you to do Multitasking by splitting the screen in 1/3, 2/3. So the app has to respond to this change. Size Classes can help. 8 | 9 | And yes there is a built-in access to current Size Classes in SwiftUI. 10 | 11 | Moreover, it seems to be the new recommendations from Apple Human Interface Guidelines: https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/ 12 | 13 | ## Access to current Size Classes 14 | 15 | Access to Size Classes is very simple in SwiftUI, it changes automatically if the user change the device orientation or split the view with iPad Multitasking thanks to `@Environment` wrapper. 16 | 17 | ```swift 18 | struct ContentView: View { 19 | @Environment(\.verticalSizeClass) var verticalSizeClass: UserInterfaceSizeClass? 20 | @Environment(\.horizontalSizeClass) var horizontalSizeClass: UserInterfaceSizeClass? 21 | 22 | var body: some View { 23 | Group { 24 | if verticalSizeClass == .regular && horizontalSizeClass == .compact { 25 | // iPhone Portrait or iPad 1/3 split view for Multitasking for instance 26 | ... 27 | } else if verticalSizeClass == .compact && horizontalSizeClass == .compact { 28 | // some "standard" iPhone Landscape (iPhone SE, X, XS, 7, 8, ...) 29 | ... 30 | } else if verticalSizeClass == .compact && horizontalSizeClass == .regular { 31 | // some "bigger" iPhone Landscape (iPhone Xs Max, 6s Plus, 7 Plus, 8 Plus, ...) 32 | ... 33 | } else if verticalSizeClass == .regular && horizontalSizeClass == .regular { 34 | // macOS or iPad without split view - no Multitasking 35 | ... 36 | } 37 | } 38 | } 39 | } 40 | ``` 41 | 42 | I illustrated all possiblities with examples and screenshots bellow. 43 | 44 | You can also download and run this project with Xcode in differents simulators to see the differences. 45 | 46 | ## Vertical Regular, Horizontal Compact. E.g. iPhone Portrait and iPad 1/3 split view for Multitasking 47 | 48 | ```swift 49 | if verticalSizeClass == .regular && horizontalSizeClass == .compact { 50 | // iPhone Portrait or iPad 1/3 split view for Multitasking for instance 51 | // A 52 | // B 53 | // C 54 | VStack { 55 | Text("V: Regular, H: Compact").padding() 56 | Spacer() 57 | VStack { 58 | CubeView(letter: "A").padding() 59 | CubeView(letter: "B").padding() 60 | CubeView(letter: "C").padding() 61 | } 62 | Spacer() 63 | } 64 | } 65 | ``` 66 | ![iPhone in Portrait mode](docs/assets/iPhonePortrait.png) 67 | ![iPad with 1/3 Split View for Multitasking](docs/assets/iPadSplitView.png) 68 | 69 | ## Vertical Compact, Horizontal Compact. E.g. "Standard" iPhone Landscape 70 | 71 | ```swift 72 | if verticalSizeClass == .compact && horizontalSizeClass == .compact { 73 | // some "standard" iPhone Landscape (iPhone SE, X, XS, 7, 8, ...) 74 | // A B C 75 | VStack { 76 | Text("V: Compact, H: Compact").padding() 77 | Spacer() 78 | HStack { 79 | CubeView(letter: "A").padding() 80 | CubeView(letter: "B").padding() 81 | CubeView(letter: "C").padding() 82 | } 83 | Spacer() 84 | } 85 | } 86 | ``` 87 | ![Standard iPhone in Landscape mode](docs/assets/iPhoneLandscape.png) 88 | 89 | ## Vertical Compact, Horizontal Regular. E.g. "Bigger" iPhone Landscape 90 | 91 | ```swift 92 | if verticalSizeClass == .compact && horizontalSizeClass == .regular { 93 | // some "bigger" iPhone Landscape (iPhone Xs Max, 6s Plus, 7 Plus, 8 Plus, ...) 94 | // A B C D 95 | VStack { 96 | Text("V: Compact, H: Regular").padding() 97 | Spacer() 98 | HStack { 99 | CubeView(letter: "A").padding() 100 | CubeView(letter: "B").padding() 101 | CubeView(letter: "C").padding() 102 | CubeView(letter: "D").padding() 103 | } 104 | Spacer() 105 | } 106 | } 107 | ``` 108 | ![Bigger iPhone in Landscape mode](docs/assets/iPhoneLandscapeLarge.png) 109 | 110 | ## Vertical Regular, Horizontal Regular. E.g. iPad fullscreen, iPad 1/2 split view, macOS 111 | 112 | ```swift 113 | if verticalSizeClass == .regular && horizontalSizeClass == .regular { 114 | // macOS or iPad without split view - no Multitasking 115 | // A B 116 | // C D 117 | VStack { 118 | Text("V: Regular, H: Regular").padding() 119 | Spacer() 120 | HStack { 121 | CubeView(letter: "A").padding() 122 | CubeView(letter: "B").padding() 123 | } 124 | HStack { 125 | CubeView(letter: "C").padding() 126 | CubeView(letter: "D").padding() 127 | } 128 | Spacer() 129 | } 130 | } 131 | ``` 132 | ![iPad Fullscreen](docs/assets/iPadFullscreen.png) 133 | ![macOS](docs/assets/macOS.png) 134 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes.xcodeproj/project.pbxproj: -------------------------------------------------------------------------------- 1 | // !$*UTF8*$! 2 | { 3 | archiveVersion = 1; 4 | classes = { 5 | }; 6 | objectVersion = 50; 7 | objects = { 8 | 9 | /* Begin PBXBuildFile section */ 10 | 4C940E6723E571E500DCD4AB /* SizeClassesExampleApp.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4C940E6623E571E500DCD4AB /* SizeClassesExampleApp.swift */; }; 11 | 4C940E6923E571E500DCD4AB /* SceneDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4C940E6823E571E500DCD4AB /* SceneDelegate.swift */; }; 12 | 4C940E6B23E571E500DCD4AB /* ContentView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4C940E6A23E571E500DCD4AB /* ContentView.swift */; }; 13 | 4C940E6D23E571EC00DCD4AB /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 4C940E6C23E571EC00DCD4AB /* Assets.xcassets */; }; 14 | 4C940E7023E571EC00DCD4AB /* Preview Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 4C940E6F23E571EC00DCD4AB /* Preview Assets.xcassets */; }; 15 | 4C940E7323E571EC00DCD4AB /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 4C940E7123E571EC00DCD4AB /* LaunchScreen.storyboard */; }; 16 | 4CDB166F23E5B0EA002878C6 /* CubeView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4CDB166E23E5B0EA002878C6 /* CubeView.swift */; }; 17 | /* End PBXBuildFile section */ 18 | 19 | /* Begin PBXFileReference section */ 20 | 4C940E6323E571E500DCD4AB /* SwiftUI with Size Classes.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "SwiftUI with Size Classes.app"; sourceTree = BUILT_PRODUCTS_DIR; }; 21 | 4C940E6623E571E500DCD4AB /* SizeClassesExampleApp.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SizeClassesExampleApp.swift; sourceTree = ""; }; 22 | 4C940E6823E571E500DCD4AB /* SceneDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SceneDelegate.swift; sourceTree = ""; }; 23 | 4C940E6A23E571E500DCD4AB /* ContentView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ContentView.swift; sourceTree = ""; }; 24 | 4C940E6C23E571EC00DCD4AB /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = ""; }; 25 | 4C940E6F23E571EC00DCD4AB /* Preview Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = "Preview Assets.xcassets"; sourceTree = ""; }; 26 | 4C940E7223E571EC00DCD4AB /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = ""; }; 27 | 4C940E7423E571EC00DCD4AB /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = ""; }; 28 | 4C940E7A23E5723600DCD4AB /* SwiftUI with Size Classes.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = "SwiftUI with Size Classes.entitlements"; sourceTree = ""; }; 29 | 4CDB166E23E5B0EA002878C6 /* CubeView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CubeView.swift; sourceTree = ""; }; 30 | /* End PBXFileReference section */ 31 | 32 | /* Begin PBXFrameworksBuildPhase section */ 33 | 4C940E6023E571E500DCD4AB /* Frameworks */ = { 34 | isa = PBXFrameworksBuildPhase; 35 | buildActionMask = 2147483647; 36 | files = ( 37 | ); 38 | runOnlyForDeploymentPostprocessing = 0; 39 | }; 40 | /* End PBXFrameworksBuildPhase section */ 41 | 42 | /* Begin PBXGroup section */ 43 | 4C940E5A23E571E500DCD4AB = { 44 | isa = PBXGroup; 45 | children = ( 46 | 4C940E6523E571E500DCD4AB /* SwiftUI with Size Classes */, 47 | 4C940E6423E571E500DCD4AB /* Products */, 48 | ); 49 | sourceTree = ""; 50 | }; 51 | 4C940E6423E571E500DCD4AB /* Products */ = { 52 | isa = PBXGroup; 53 | children = ( 54 | 4C940E6323E571E500DCD4AB /* SwiftUI with Size Classes.app */, 55 | ); 56 | name = Products; 57 | sourceTree = ""; 58 | }; 59 | 4C940E6523E571E500DCD4AB /* SwiftUI with Size Classes */ = { 60 | isa = PBXGroup; 61 | children = ( 62 | 4C940E6623E571E500DCD4AB /* SizeClassesExampleApp.swift */, 63 | 4C940E6C23E571EC00DCD4AB /* Assets.xcassets */, 64 | 4C940E6A23E571E500DCD4AB /* ContentView.swift */, 65 | 4CDB166E23E5B0EA002878C6 /* CubeView.swift */, 66 | 4C940E7423E571EC00DCD4AB /* Info.plist */, 67 | 4C940E7123E571EC00DCD4AB /* LaunchScreen.storyboard */, 68 | 4C940E6E23E571EC00DCD4AB /* Preview Content */, 69 | 4C940E6823E571E500DCD4AB /* SceneDelegate.swift */, 70 | 4C940E7A23E5723600DCD4AB /* SwiftUI with Size Classes.entitlements */, 71 | ); 72 | path = "SwiftUI with Size Classes"; 73 | sourceTree = ""; 74 | }; 75 | 4C940E6E23E571EC00DCD4AB /* Preview Content */ = { 76 | isa = PBXGroup; 77 | children = ( 78 | 4C940E6F23E571EC00DCD4AB /* Preview Assets.xcassets */, 79 | ); 80 | path = "Preview Content"; 81 | sourceTree = ""; 82 | }; 83 | /* End PBXGroup section */ 84 | 85 | /* Begin PBXNativeTarget section */ 86 | 4C940E6223E571E500DCD4AB /* SwiftUI with Size Classes */ = { 87 | isa = PBXNativeTarget; 88 | buildConfigurationList = 4C940E7723E571EC00DCD4AB /* Build configuration list for PBXNativeTarget "SwiftUI with Size Classes" */; 89 | buildPhases = ( 90 | 4C940E5F23E571E500DCD4AB /* Sources */, 91 | 4C940E6023E571E500DCD4AB /* Frameworks */, 92 | 4C940E6123E571E500DCD4AB /* Resources */, 93 | ); 94 | buildRules = ( 95 | ); 96 | dependencies = ( 97 | ); 98 | name = "SwiftUI with Size Classes"; 99 | productName = "SwiftUI with Size Classes"; 100 | productReference = 4C940E6323E571E500DCD4AB /* SwiftUI with Size Classes.app */; 101 | productType = "com.apple.product-type.application"; 102 | }; 103 | /* End PBXNativeTarget section */ 104 | 105 | /* Begin PBXProject section */ 106 | 4C940E5B23E571E500DCD4AB /* Project object */ = { 107 | isa = PBXProject; 108 | attributes = { 109 | LastSwiftUpdateCheck = 1130; 110 | LastUpgradeCheck = 1250; 111 | ORGANIZATIONNAME = "Renaud JENNY"; 112 | TargetAttributes = { 113 | 4C940E6223E571E500DCD4AB = { 114 | CreatedOnToolsVersion = 11.3.1; 115 | }; 116 | }; 117 | }; 118 | buildConfigurationList = 4C940E5E23E571E500DCD4AB /* Build configuration list for PBXProject "SwiftUI with Size Classes" */; 119 | compatibilityVersion = "Xcode 9.3"; 120 | developmentRegion = en; 121 | hasScannedForEncodings = 0; 122 | knownRegions = ( 123 | en, 124 | Base, 125 | ); 126 | mainGroup = 4C940E5A23E571E500DCD4AB; 127 | productRefGroup = 4C940E6423E571E500DCD4AB /* Products */; 128 | projectDirPath = ""; 129 | projectRoot = ""; 130 | targets = ( 131 | 4C940E6223E571E500DCD4AB /* SwiftUI with Size Classes */, 132 | ); 133 | }; 134 | /* End PBXProject section */ 135 | 136 | /* Begin PBXResourcesBuildPhase section */ 137 | 4C940E6123E571E500DCD4AB /* Resources */ = { 138 | isa = PBXResourcesBuildPhase; 139 | buildActionMask = 2147483647; 140 | files = ( 141 | 4C940E7323E571EC00DCD4AB /* LaunchScreen.storyboard in Resources */, 142 | 4C940E7023E571EC00DCD4AB /* Preview Assets.xcassets in Resources */, 143 | 4C940E6D23E571EC00DCD4AB /* Assets.xcassets in Resources */, 144 | ); 145 | runOnlyForDeploymentPostprocessing = 0; 146 | }; 147 | /* End PBXResourcesBuildPhase section */ 148 | 149 | /* Begin PBXSourcesBuildPhase section */ 150 | 4C940E5F23E571E500DCD4AB /* Sources */ = { 151 | isa = PBXSourcesBuildPhase; 152 | buildActionMask = 2147483647; 153 | files = ( 154 | 4C940E6723E571E500DCD4AB /* SizeClassesExampleApp.swift in Sources */, 155 | 4C940E6923E571E500DCD4AB /* SceneDelegate.swift in Sources */, 156 | 4C940E6B23E571E500DCD4AB /* ContentView.swift in Sources */, 157 | 4CDB166F23E5B0EA002878C6 /* CubeView.swift in Sources */, 158 | ); 159 | runOnlyForDeploymentPostprocessing = 0; 160 | }; 161 | /* End PBXSourcesBuildPhase section */ 162 | 163 | /* Begin PBXVariantGroup section */ 164 | 4C940E7123E571EC00DCD4AB /* LaunchScreen.storyboard */ = { 165 | isa = PBXVariantGroup; 166 | children = ( 167 | 4C940E7223E571EC00DCD4AB /* Base */, 168 | ); 169 | name = LaunchScreen.storyboard; 170 | sourceTree = ""; 171 | }; 172 | /* End PBXVariantGroup section */ 173 | 174 | /* Begin XCBuildConfiguration section */ 175 | 4C940E7523E571EC00DCD4AB /* Debug */ = { 176 | isa = XCBuildConfiguration; 177 | buildSettings = { 178 | ALWAYS_SEARCH_USER_PATHS = NO; 179 | CLANG_ANALYZER_NONNULL = YES; 180 | CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE; 181 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++14"; 182 | CLANG_CXX_LIBRARY = "libc++"; 183 | CLANG_ENABLE_MODULES = YES; 184 | CLANG_ENABLE_OBJC_ARC = YES; 185 | CLANG_ENABLE_OBJC_WEAK = YES; 186 | CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES; 187 | CLANG_WARN_BOOL_CONVERSION = YES; 188 | CLANG_WARN_COMMA = YES; 189 | CLANG_WARN_CONSTANT_CONVERSION = YES; 190 | CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES; 191 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 192 | CLANG_WARN_DOCUMENTATION_COMMENTS = YES; 193 | CLANG_WARN_EMPTY_BODY = YES; 194 | CLANG_WARN_ENUM_CONVERSION = YES; 195 | CLANG_WARN_INFINITE_RECURSION = YES; 196 | CLANG_WARN_INT_CONVERSION = YES; 197 | CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES; 198 | CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES; 199 | CLANG_WARN_OBJC_LITERAL_CONVERSION = YES; 200 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 201 | CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES; 202 | CLANG_WARN_RANGE_LOOP_ANALYSIS = YES; 203 | CLANG_WARN_STRICT_PROTOTYPES = YES; 204 | CLANG_WARN_SUSPICIOUS_MOVE = YES; 205 | CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE; 206 | CLANG_WARN_UNREACHABLE_CODE = YES; 207 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 208 | COPY_PHASE_STRIP = NO; 209 | DEBUG_INFORMATION_FORMAT = dwarf; 210 | ENABLE_STRICT_OBJC_MSGSEND = YES; 211 | ENABLE_TESTABILITY = YES; 212 | GCC_C_LANGUAGE_STANDARD = gnu11; 213 | GCC_DYNAMIC_NO_PIC = NO; 214 | GCC_NO_COMMON_BLOCKS = YES; 215 | GCC_OPTIMIZATION_LEVEL = 0; 216 | GCC_PREPROCESSOR_DEFINITIONS = ( 217 | "DEBUG=1", 218 | "$(inherited)", 219 | ); 220 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 221 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 222 | GCC_WARN_UNDECLARED_SELECTOR = YES; 223 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 224 | GCC_WARN_UNUSED_FUNCTION = YES; 225 | GCC_WARN_UNUSED_VARIABLE = YES; 226 | IPHONEOS_DEPLOYMENT_TARGET = 14.0; 227 | MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE; 228 | MTL_FAST_MATH = YES; 229 | ONLY_ACTIVE_ARCH = YES; 230 | SDKROOT = iphoneos; 231 | SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG; 232 | SWIFT_OPTIMIZATION_LEVEL = "-Onone"; 233 | }; 234 | name = Debug; 235 | }; 236 | 4C940E7623E571EC00DCD4AB /* Release */ = { 237 | isa = XCBuildConfiguration; 238 | buildSettings = { 239 | ALWAYS_SEARCH_USER_PATHS = NO; 240 | CLANG_ANALYZER_NONNULL = YES; 241 | CLANG_ANALYZER_NUMBER_OBJECT_CONVERSION = YES_AGGRESSIVE; 242 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++14"; 243 | CLANG_CXX_LIBRARY = "libc++"; 244 | CLANG_ENABLE_MODULES = YES; 245 | CLANG_ENABLE_OBJC_ARC = YES; 246 | CLANG_ENABLE_OBJC_WEAK = YES; 247 | CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES; 248 | CLANG_WARN_BOOL_CONVERSION = YES; 249 | CLANG_WARN_COMMA = YES; 250 | CLANG_WARN_CONSTANT_CONVERSION = YES; 251 | CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES; 252 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 253 | CLANG_WARN_DOCUMENTATION_COMMENTS = YES; 254 | CLANG_WARN_EMPTY_BODY = YES; 255 | CLANG_WARN_ENUM_CONVERSION = YES; 256 | CLANG_WARN_INFINITE_RECURSION = YES; 257 | CLANG_WARN_INT_CONVERSION = YES; 258 | CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES; 259 | CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES; 260 | CLANG_WARN_OBJC_LITERAL_CONVERSION = YES; 261 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 262 | CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES; 263 | CLANG_WARN_RANGE_LOOP_ANALYSIS = YES; 264 | CLANG_WARN_STRICT_PROTOTYPES = YES; 265 | CLANG_WARN_SUSPICIOUS_MOVE = YES; 266 | CLANG_WARN_UNGUARDED_AVAILABILITY = YES_AGGRESSIVE; 267 | CLANG_WARN_UNREACHABLE_CODE = YES; 268 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 269 | COPY_PHASE_STRIP = NO; 270 | DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym"; 271 | ENABLE_NS_ASSERTIONS = NO; 272 | ENABLE_STRICT_OBJC_MSGSEND = YES; 273 | GCC_C_LANGUAGE_STANDARD = gnu11; 274 | GCC_NO_COMMON_BLOCKS = YES; 275 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 276 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 277 | GCC_WARN_UNDECLARED_SELECTOR = YES; 278 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 279 | GCC_WARN_UNUSED_FUNCTION = YES; 280 | GCC_WARN_UNUSED_VARIABLE = YES; 281 | IPHONEOS_DEPLOYMENT_TARGET = 14.0; 282 | MTL_ENABLE_DEBUG_INFO = NO; 283 | MTL_FAST_MATH = YES; 284 | SDKROOT = iphoneos; 285 | SWIFT_COMPILATION_MODE = wholemodule; 286 | SWIFT_OPTIMIZATION_LEVEL = "-O"; 287 | VALIDATE_PRODUCT = YES; 288 | }; 289 | name = Release; 290 | }; 291 | 4C940E7823E571EC00DCD4AB /* Debug */ = { 292 | isa = XCBuildConfiguration; 293 | buildSettings = { 294 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 295 | CODE_SIGN_ENTITLEMENTS = "SwiftUI with Size Classes/SwiftUI with Size Classes.entitlements"; 296 | CODE_SIGN_STYLE = Automatic; 297 | DERIVE_MACCATALYST_PRODUCT_BUNDLE_IDENTIFIER = YES; 298 | DEVELOPMENT_ASSET_PATHS = "\"SwiftUI with Size Classes/Preview Content\""; 299 | DEVELOPMENT_TEAM = ""; 300 | ENABLE_PREVIEWS = YES; 301 | INFOPLIST_FILE = "SwiftUI with Size Classes/Info.plist"; 302 | LD_RUNPATH_SEARCH_PATHS = ( 303 | "$(inherited)", 304 | "@executable_path/Frameworks", 305 | ); 306 | PRODUCT_BUNDLE_IDENTIFIER = "renaud.jenny.SwiftUI-with-Size-Classes"; 307 | PRODUCT_NAME = "$(TARGET_NAME)"; 308 | SUPPORTS_MACCATALYST = YES; 309 | SWIFT_VERSION = 5.0; 310 | TARGETED_DEVICE_FAMILY = "1,2"; 311 | }; 312 | name = Debug; 313 | }; 314 | 4C940E7923E571EC00DCD4AB /* Release */ = { 315 | isa = XCBuildConfiguration; 316 | buildSettings = { 317 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 318 | CODE_SIGN_ENTITLEMENTS = "SwiftUI with Size Classes/SwiftUI with Size Classes.entitlements"; 319 | CODE_SIGN_STYLE = Automatic; 320 | DERIVE_MACCATALYST_PRODUCT_BUNDLE_IDENTIFIER = YES; 321 | DEVELOPMENT_ASSET_PATHS = "\"SwiftUI with Size Classes/Preview Content\""; 322 | DEVELOPMENT_TEAM = ""; 323 | ENABLE_PREVIEWS = YES; 324 | INFOPLIST_FILE = "SwiftUI with Size Classes/Info.plist"; 325 | LD_RUNPATH_SEARCH_PATHS = ( 326 | "$(inherited)", 327 | "@executable_path/Frameworks", 328 | ); 329 | PRODUCT_BUNDLE_IDENTIFIER = "renaud.jenny.SwiftUI-with-Size-Classes"; 330 | PRODUCT_NAME = "$(TARGET_NAME)"; 331 | SUPPORTS_MACCATALYST = YES; 332 | SWIFT_VERSION = 5.0; 333 | TARGETED_DEVICE_FAMILY = "1,2"; 334 | }; 335 | name = Release; 336 | }; 337 | /* End XCBuildConfiguration section */ 338 | 339 | /* Begin XCConfigurationList section */ 340 | 4C940E5E23E571E500DCD4AB /* Build configuration list for PBXProject "SwiftUI with Size Classes" */ = { 341 | isa = XCConfigurationList; 342 | buildConfigurations = ( 343 | 4C940E7523E571EC00DCD4AB /* Debug */, 344 | 4C940E7623E571EC00DCD4AB /* Release */, 345 | ); 346 | defaultConfigurationIsVisible = 0; 347 | defaultConfigurationName = Release; 348 | }; 349 | 4C940E7723E571EC00DCD4AB /* Build configuration list for PBXNativeTarget "SwiftUI with Size Classes" */ = { 350 | isa = XCConfigurationList; 351 | buildConfigurations = ( 352 | 4C940E7823E571EC00DCD4AB /* Debug */, 353 | 4C940E7923E571EC00DCD4AB /* Release */, 354 | ); 355 | defaultConfigurationIsVisible = 0; 356 | defaultConfigurationName = Release; 357 | }; 358 | /* End XCConfigurationList section */ 359 | }; 360 | rootObject = 4C940E5B23E571E500DCD4AB /* Project object */; 361 | } 362 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes.xcodeproj/project.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | IDEDidComputeMac32BitWarning 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes.xcodeproj/xcuserdata/renaudjenny.xcuserdatad/xcschemes/xcschememanagement.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | SchemeUserState 6 | 7 | SwiftUI with Size Classes.xcscheme_^#shared#^_ 8 | 9 | orderHint 10 | 0 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/Assets.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "size" : "20x20", 6 | "scale" : "2x" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "size" : "20x20", 11 | "scale" : "3x" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "size" : "29x29", 16 | "scale" : "2x" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "size" : "29x29", 21 | "scale" : "3x" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "size" : "40x40", 26 | "scale" : "2x" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "size" : "40x40", 31 | "scale" : "3x" 32 | }, 33 | { 34 | "idiom" : "iphone", 35 | "size" : "60x60", 36 | "scale" : "2x" 37 | }, 38 | { 39 | "idiom" : "iphone", 40 | "size" : "60x60", 41 | "scale" : "3x" 42 | }, 43 | { 44 | "idiom" : "ipad", 45 | "size" : "20x20", 46 | "scale" : "1x" 47 | }, 48 | { 49 | "idiom" : "ipad", 50 | "size" : "20x20", 51 | "scale" : "2x" 52 | }, 53 | { 54 | "idiom" : "ipad", 55 | "size" : "29x29", 56 | "scale" : "1x" 57 | }, 58 | { 59 | "idiom" : "ipad", 60 | "size" : "29x29", 61 | "scale" : "2x" 62 | }, 63 | { 64 | "idiom" : "ipad", 65 | "size" : "40x40", 66 | "scale" : "1x" 67 | }, 68 | { 69 | "idiom" : "ipad", 70 | "size" : "40x40", 71 | "scale" : "2x" 72 | }, 73 | { 74 | "idiom" : "ipad", 75 | "size" : "76x76", 76 | "scale" : "1x" 77 | }, 78 | { 79 | "idiom" : "ipad", 80 | "size" : "76x76", 81 | "scale" : "2x" 82 | }, 83 | { 84 | "idiom" : "ipad", 85 | "size" : "83.5x83.5", 86 | "scale" : "2x" 87 | }, 88 | { 89 | "idiom" : "ios-marketing", 90 | "size" : "1024x1024", 91 | "scale" : "1x" 92 | } 93 | ], 94 | "info" : { 95 | "version" : 1, 96 | "author" : "xcode" 97 | } 98 | } -------------------------------------------------------------------------------- /SwiftUI with Size Classes/Assets.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "info" : { 3 | "version" : 1, 4 | "author" : "xcode" 5 | } 6 | } -------------------------------------------------------------------------------- /SwiftUI with Size Classes/Base.lproj/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/ContentView.swift: -------------------------------------------------------------------------------- 1 | import SwiftUI 2 | 3 | struct ContentView: View { 4 | @Environment(\.verticalSizeClass) var verticalSizeClass: UserInterfaceSizeClass? 5 | @Environment(\.horizontalSizeClass) var horizontalSizeClass: UserInterfaceSizeClass? 6 | 7 | var body: some View { 8 | // https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/ 9 | Group { 10 | if verticalSizeClass == .regular && horizontalSizeClass == .compact { 11 | // iPhone Portrait or iPad 1/3 split view for Multitasking for instance 12 | // A 13 | // B 14 | // C 15 | VStack { 16 | Text("V: Regular, H: Compact").padding() 17 | Spacer() 18 | VStack { 19 | CubeView(letter: "A").padding() 20 | CubeView(letter: "B").padding() 21 | CubeView(letter: "C").padding() 22 | } 23 | Spacer() 24 | } 25 | } else if verticalSizeClass == .compact && horizontalSizeClass == .compact { 26 | // some "standard" iPhone Landscape (iPhone SE, X, XS, 7, 8, ...) 27 | // A B C 28 | VStack { 29 | Text("V: Compact, H: Compact").padding() 30 | Spacer() 31 | HStack { 32 | CubeView(letter: "A").padding() 33 | CubeView(letter: "B").padding() 34 | CubeView(letter: "C").padding() 35 | } 36 | Spacer() 37 | } 38 | } else if verticalSizeClass == .compact && horizontalSizeClass == .regular { 39 | // some "bigger" iPhone Landscape (iPhone Xs Max, 6s Plus, 7 Plus, 8 Plus, ...) 40 | // A B C D 41 | VStack { 42 | Text("V: Compact, H: Regular").padding() 43 | Spacer() 44 | HStack { 45 | CubeView(letter: "A").padding() 46 | CubeView(letter: "B").padding() 47 | CubeView(letter: "C").padding() 48 | CubeView(letter: "D").padding() 49 | } 50 | Spacer() 51 | } 52 | } else if verticalSizeClass == .regular && horizontalSizeClass == .regular { 53 | // macOS or iPad without split view - no Multitasking 54 | // A B 55 | // C D 56 | VStack { 57 | Text("V: Regular, H: Regular").padding() 58 | Spacer() 59 | HStack { 60 | CubeView(letter: "A").padding() 61 | CubeView(letter: "B").padding() 62 | } 63 | HStack { 64 | CubeView(letter: "C").padding() 65 | CubeView(letter: "D").padding() 66 | } 67 | Spacer() 68 | } 69 | } 70 | } 71 | } 72 | } 73 | 74 | struct ContentView_Previews: PreviewProvider { 75 | static var previews: some View { 76 | ContentView() 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/CubeView.swift: -------------------------------------------------------------------------------- 1 | import SwiftUI 2 | 3 | struct CubeView: View { 4 | let letter: Character 5 | var color: Color { 6 | switch letter { 7 | case "A": return .red 8 | case "B": return .blue 9 | case "C": return .green 10 | case "D": return .orange 11 | default: return .gray 12 | } 13 | } 14 | 15 | var body: some View { 16 | GeometryReader { geometry in 17 | ZStack { 18 | CubeShape(depth: self.squareWidth(geometry)/6) 19 | .fill(self.color) 20 | .overlay(CubeShape(depth: self.squareWidth(geometry)/6) 21 | .stroke()) 22 | .frame(width: self.squareWidth(geometry), height: self.squareWidth(geometry)) 23 | Text(String(self.letter)) 24 | .font(.largeTitle) 25 | .projectionEffect(.init(.init( 26 | translationX: -self.squareWidth(geometry)/12, y: self.squareWidth(geometry)/12))) 27 | } 28 | } 29 | } 30 | 31 | func squareWidth(_ geometry: GeometryProxy) -> CGFloat { 32 | return min(geometry.frame(in: .local).width, geometry.frame(in: .local).height) 33 | } 34 | } 35 | 36 | struct CubeShape: Shape { 37 | let depth: CGFloat 38 | 39 | func path(in rect: CGRect) -> Path { 40 | var path = Path() 41 | let width = min(rect.width, rect.height) 42 | path.move(to: CGPoint( 43 | x: depth, 44 | y: 0 45 | )) 46 | path.addLine(to: CGPoint( 47 | x: width, 48 | y: 0 49 | )) 50 | path.addLine(to: CGPoint( 51 | x: width, 52 | y: width - depth 53 | )) 54 | path.addLine(to: CGPoint( 55 | x: width - depth, 56 | y: width 57 | )) 58 | path.addLine(to: CGPoint( 59 | x: 0, 60 | y: width 61 | )) 62 | path.addLine(to: CGPoint( 63 | x: 0, 64 | y: depth 65 | )) 66 | path.addLine(to: CGPoint( 67 | x: depth, 68 | y: 0 69 | )) 70 | path.move(to: CGPoint( 71 | x: 0, 72 | y: depth 73 | )) 74 | path.addLine(to: CGPoint( 75 | x: width - depth, 76 | y: depth 77 | )) 78 | path.addLine(to: CGPoint( 79 | x: width - depth, 80 | y: width 81 | )) 82 | path.move(to: CGPoint( 83 | x: width - depth, 84 | y: depth 85 | )) 86 | path.addLine(to: CGPoint( 87 | x: width, 88 | y: 0 89 | )) 90 | return path 91 | } 92 | } 93 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | $(DEVELOPMENT_LANGUAGE) 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | $(PRODUCT_BUNDLE_PACKAGE_TYPE) 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleVersion 20 | 1 21 | LSRequiresIPhoneOS 22 | 23 | UILaunchStoryboardName 24 | LaunchScreen 25 | UIRequiredDeviceCapabilities 26 | 27 | armv7 28 | 29 | UISupportedInterfaceOrientations 30 | 31 | UIInterfaceOrientationPortrait 32 | UIInterfaceOrientationLandscapeLeft 33 | UIInterfaceOrientationLandscapeRight 34 | 35 | UISupportedInterfaceOrientations~ipad 36 | 37 | UIInterfaceOrientationPortrait 38 | UIInterfaceOrientationPortraitUpsideDown 39 | UIInterfaceOrientationLandscapeLeft 40 | UIInterfaceOrientationLandscapeRight 41 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/Preview Content/Preview Assets.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "info" : { 3 | "version" : 1, 4 | "author" : "xcode" 5 | } 6 | } -------------------------------------------------------------------------------- /SwiftUI with Size Classes/SceneDelegate.swift: -------------------------------------------------------------------------------- 1 | import UIKit 2 | import SwiftUI 3 | 4 | class SceneDelegate: UIResponder, UIWindowSceneDelegate { 5 | var window: UIWindow? 6 | 7 | func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) { 8 | let contentView = ContentView() 9 | 10 | if let windowScene = scene as? UIWindowScene { 11 | let window = UIWindow(windowScene: windowScene) 12 | window.rootViewController = UIHostingController(rootView: contentView) 13 | self.window = window 14 | window.makeKeyAndVisible() 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/SizeClassesExampleApp.swift: -------------------------------------------------------------------------------- 1 | import SwiftUI 2 | 3 | @main 4 | struct SizeClassesExampleApp: App { 5 | var body: some Scene { 6 | WindowGroup { 7 | ContentView() 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /SwiftUI with Size Classes/SwiftUI with Size Classes.entitlements: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | com.apple.security.app-sandbox 6 | 7 | com.apple.security.network.client 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /docs/assets/iPadFullscreen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/iPadFullscreen.png -------------------------------------------------------------------------------- /docs/assets/iPadSplitView.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/iPadSplitView.png -------------------------------------------------------------------------------- /docs/assets/iPhoneLandscape.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/iPhoneLandscape.png -------------------------------------------------------------------------------- /docs/assets/iPhoneLandscapeLarge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/iPhoneLandscapeLarge.png -------------------------------------------------------------------------------- /docs/assets/iPhonePortrait.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/iPhonePortrait.png -------------------------------------------------------------------------------- /docs/assets/macOS.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/renaudjenny/SwiftUI-with-Size-Classes/42dcb02fdc1499b0009155cbf5d3096d754e4689/docs/assets/macOS.png --------------------------------------------------------------------------------