swiftui-ui-patterns

Build and refactor SwiftUI interfaces using component patterns for navigation, state, and layout.

Updated Jul 31, 2026
One-click install
npx skills add https://github.com/AarnavBaddam/skills --skill swiftui-ui-patterns-aarnavbaddam
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: swiftui-ui-patterns
Source: https://github.com/AarnavBaddam/skills/tree/main/swiftui-ui-patterns
Command: npx skills add https://github.com/AarnavBaddam/skills --skill swiftui-ui-patterns-aarnavbaddam

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? SwiftUI developers often struggle with choosing the right state ownership model, wiring navigation and sheets consistently, and avoiding anti-patterns like giant views or scattered modal presentation. This Skill provides opinionated, production-tested patterns for building and refactoring SwiftUI UIs with correct state management, navigation, and composition. ## Core Features & Use Cases - State ownership guidance: Decision tables for choosing between @State, @Binding, @Observable, @Environment, and legacy ObservableObject patterns based on ownership and deployment target. - Navigation and presentation patterns: Per-tab NavigationStack routing with enum-based routes, centralized sheet destinations, and deep link handling. - Component reference library: Over 20 focused references covering TabView, List, Form, grids, search, media, haptics, theming, performance, previews, and async task lifecycle. - Use Case: When adding a new settings screen to an iOS app, use this Skill to structure the Form with proper sections, wire it into the enum-driven sheet router, and add previews with mock environment dependencies. ## Quick Start Use the swiftui-ui-patterns skill to design a new SwiftUI screen with proper state ownership, navigation routing, and sheet presentation for my app.

Frequently Asked Questions about swiftui-ui-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I choose between @State, @Observable, and @Environment in SwiftUI?

Choose based on ownership: use @State for local view state, @State with an @Observable type for root-owned reference models on iOS 17+, and @Environment for shared app services. Pick the ownership location first, then select the narrowest wrapper that fits.

How do I set up NavigationStack with per-tab history in SwiftUI?

Create one NavigationStack per tab, each bound to its own router object holding a path array of Hashable route enums. Inject the router via the environment so child views navigate programmatically, and centralize destination mapping with navigationDestination(for:).

Should I use sheet(isPresented:) or sheet(item:) in SwiftUI?

Prefer sheet(item:) when the state represents a selected model, as it guarantees a single active sheet and avoids if-let unwrapping inside the sheet body. For app-wide modals, centralize presentation with an enum-driven SheetDestination stored on a router.

Does the @Observable macro work on iOS 16?

No, the Observation framework requires iOS 17 or later. For iOS 16 and earlier, fall back to ObservableObject with @StateObject for root ownership, @ObservedObject for injected objects, and @EnvironmentObject only for truly shared app-level state.

Why does my SwiftUI view re-render too often?

Excessive re-renders usually come from unstable ForEach identity, expensive computation inside body, or overly broad observation scope. Give rows stable IDs, move heavy transforms into models, and narrow observation so only views reading changed state update.

How do I handle async loading and cancellation in SwiftUI views?

Use .task for load-on-appear work and .task(id:) when work should restart for changing inputs like search queries. Treat cancellation as normal, debounce user-driven requests, and keep explicit loading, loaded, and error states.