Build adaptive user interfaces in iOS using Size Classes and Auto Layout in Xcode 26. Apple's adaptive layout system lets you build one universal interface that works across iPhone SE, iPhone 16 Pro Max, and iPad Pro 13-inch screens. Size Classes categorize device screen space into four combinations based on horizontal and vertical dimensions. Auto Layout constraints define view relationships that adapt automatically. Together, they eliminate the need for separate storyboards per device.
What Are Size Classes in iOS
Size Classes are Apple's abstraction for display space. Every iOS device at any orientation falls into one of four combinations. Compact Width with Regular Height applies to all iPhones in portrait orientation. Regular Width with Compact Height applies to iPhone Pro Max models in landscape orientation. Regular Width with Regular Height applies to all iPads in any orientation. Compact Width with Compact Height applies to iPhone SE and iPhone 16 Pro in landscape orientation. You design for size class combinations, not specific devices. This approach future-proofs your app because new devices automatically fit into existing categories.
How to Set Up Auto Layout Constraints in Interface Builder
Create a new Xcode 26 project using the App template with Storyboard as the interface. Drag an ImageView onto your view controller. Add a container view below it for labels and text. For each UI element, define Auto Layout constraints in Interface Builder that describe position and size relative to parent and sibling views. Pin the image view's top, leading, and trailing edges to the superview with zero spacing. Set its height to approximately 55 percent of the main view using an Equal Heights constraint with a 0.585 multiplier. Add zero vertical spacing to the container view below.
Understanding Content Hugging and Compression Resistance Priority
Each UIView has a Content Hugging Priority value that tells iOS how strongly it should resist growing beyond its intrinsic content size. UILabel defaults to 251 for the title label and 250 for the description label. That single point difference causes iOS to expand the description label to fill extra space on larger screens. Adjust these values in the Size inspector of Interface Builder to fix layout issues without adding extra constraints. Compression Resistance Priority works in the opposite direction. It controls how strongly a view resists shrinking below its intrinsic content size. Labels default to 750 for compression resistance.
Using Greater-Than-or-Equal Constraints for Flexibility
Set the bottom spacing of your description label to Greater Than or Equal instead of a strict Equal relation. This tells iOS to keep at least 15 points of space but increase it as needed. Enable Autoshrink with a Minimum Font Size on both labels. Your text displays correctly on everything from an iPhone SE to an iPad Pro 13-inch. This single constraint change prevents text clipping on small devices and excessive whitespace on large devices.
How to Apply Size Class-Specific Customizations
Once your base layout works across all devices, create targeted overrides for specific size class combinations. Interface Builder in Xcode 26 supports adding variations to nearly any property.
Customizing Fonts for iPad
iPads use Regular Width and Regular Height size classes. Select your label in Interface Builder. Find the Font field in the Attributes inspector. Click the plus button next to Font. Set Width to Any and Height to Regular. Add the variation with a larger font size such as 35 points for the title and 25 points for the description. iOS automatically applies the regular-regular size class font on iPads and the default font on iPhones. You can add multiple font variations for different size class combinations.
Creating Different Layouts for Landscape Orientation
Size classes enable entirely different layouts per orientation. On a product detail screen in portrait, the image stacks above the text. In landscape on an iPhone, the image and text appear side by side. Click the orientation button in Interface Builder to switch to landscape mode. Move all existing portrait constraints to a regular-height variation by unchecking the base Installed box and checking wC hR. Design your landscape layout with the image on the left and product info on the right, each taking 50 percent width. Add an Equal Widths constraint between the two views with the appropriate multiplier. Apply landscape constraints to the compact-height size class only. When you test in the simulator, you see two distinct UIs that transition smoothly between orientations.
Fine-Tuning Constraints for Specific Devices
For granular control, customize individual constraints for specific size classes. Set the simulator to iPhone 15 Pro Max in landscape. Select the top vertical spacing constraint of the title label. Click the plus button next to the Constant field in the Attributes inspector. Add a variation for Regular Width and Compact Height. Increase the constant value to 150 points. This constraint override only activates on devices matching that size class configuration.
How to Use Trait Collections Programmatically
Size classes are accessible in code through UITraitCollection. Access the current trait collection on any UIViewController or UIView:
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
super.traitCollectionDidChange(previousTraitCollection)
if traitCollection.horizontalSizeClass == .regular {
// Apply regular width layout adjustments
}
if traitCollection.verticalSizeClass == .compact {
// Apply compact height layout adjustments
}
}This method fires whenever the size class changes, such as during device rotation or when the app enters split-screen on iPad. Use it to make programmatic adjustments that complement your Interface Builder setup.
Best Practices for Adaptive Layout in iOS
Design for the smallest device first. Start with iPhone SE sizing and scale up. Use UIStackView for linear arrangements to reduce constraint complexity. Test on multiple simulators using Xcode's preview assistant without building. Understand constraint priorities: default priority is 1000 for required constraints, while lower priorities such as 750 create optional constraints that break when needed. Leverage trait collections in code for programmatic adjustments. Use symbolic constants for constraint constants instead of hardcoded values.
Why Adaptive UI Matters for iOS Development
Apple's app review process demands polished experiences on every device. Apps that fail to handle iPad split-screen, iPhone landscape mode, or Pro Max screen sizes feel unprofessional. Adaptive UI using Size Classes and Auto Layout is a fundamental requirement for modern iOS development in 2026. The Size Classes approach may feel unfamiliar initially, but it is the most powerful layout tool in Interface Builder. Designing for abstract categories rather than specific devices produces better interfaces faster and with less code. Your app works correctly on every device Apple ships today and any device they ship tomorrow.
Summary
This tutorial covered the complete implementation process from setup to working code. You now have a functional implementation that you can extend and customize for your own projects. The same patterns apply to related features in the iOS ecosystem.
Frequently Asked Questions
What Xcode version do I need for this tutorial? This tutorial uses Xcode 26 with Swift 6.2. The code examples work with any recent version of Xcode that supports the frameworks used here.
Can I test this on the iOS Simulator? Some features require a physical device with a compatible processor. The article notes specific sections where the Simulator is sufficient and where a real device is required.
What are the prerequisites for this tutorial? You need Xcode installed on a Mac and basic familiarity with Swift programming. No prior experience with the specific framework is required.