UIKit

You are a Swift iOS developer specializing in UIKit. The user wants to create view controllers with properly configured Auto Layout constraints using UIKit.

What to check first

• Verify your project uses UIKit (not SwiftUI) by checking the AppDelegate.swift file
• Confirm your view controller has import UIKit at the top
• Check that translatesAutoresizingMaskIntoConstraints is set to false on all views you're constraining

Steps

1. Create a new UIViewController subclass and override viewDidLoad()
2. Instantiate your UI elements (UILabel, UIButton, UIImageView, etc.) and set translatesAutoresizingMaskIntoConstraints = false
3. Add subviews to self.view using addSubview()
4. Create constraint objects using NSLayoutConstraint with constant, multiplier, relation, and priority parameters
5. Activate constraints by calling NSLayoutConstraint.activate([constraint1, constraint2]) or set isActive = true on each
6. Use safeAreaLayoutGuide for top/bottom constraints to account for notches and home indicators
7. Test on multiple device sizes in the Simulator to verify responsive layout
8. Use UIStackView for common layouts (rows/columns) to reduce constraint boilerplate

Code

import UIKit

class AutoLayoutViewController: UIViewController {
    
    private let titleLabel = UILabel()
    private let descriptionLabel = UILabel()
    private let actionButton = UIButton(type: .system)
    private let containerView = UIView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .systemBackground
        
        setupSubviews()
        setupConstraints()
    }
    
    private func setupSubviews() {
        // Configure title label
        titleLabel.text = "Welcome"
        titleLabel.font = UIFont.systemFont(ofSize: 24, weight: .bold)
        titleLabel.textAlignment = .center
        titleLabel.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(titleLabel)
        
        // Configure description label
        descriptionLabel.text = "This is an Auto Layout example"
        descriptionLabel.font = UIFont.systemFont(ofSize: 16)
        descriptionLabel.numberOfLines = 0
        descriptionLabel.textAlignment = .center
        descriptionLabel.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(descriptionLabel)
        
        // Configure button
        actionButton.setTitle("Tap Me", for: .normal)
        actionButton.backgroundColor = .systemBlue
        actionButton.setTitleColor(.white, for: .normal)
        actionButton.layer.cornerRadius = 8
        actionButton.translatesAutoresizingMaskIntoConstraints

Note: this example was truncated in the source. See the GitHub repo for the latest full version.

Common Pitfalls

• Treating this skill as a one-shot solution — most workflows need iteration and verification
• Skipping the verification steps — you don't know it worked until you measure
• Applying this skill without understanding the underlying problem — read the related docs first

When NOT to Use This Skill

• When a simpler manual approach would take less than 10 minutes
• On critical production systems without testing in staging first
• When you don't have permission or authorization to make these changes

How to Verify It Worked

• Run the verification steps documented above
• Compare the output against your expected baseline
• Check logs for any warnings or errors — silent failures are the worst kind

Production Considerations

• Test in staging before deploying to production
• Have a rollback plan — every change should be reversible
• Monitor the affected systems for at least 24 hours after the change