← ClaudeAtlas

swiftui-view-refactorlisted

Refactor a SwiftUI view file for consistent property ordering, MV patterns, view model handling, and Observation usage; split an oversized body via same-file computed view properties or MARK-organized extensions. Use when asked to clean up a SwiftUI view's layout, reorder its properties, or standardize dependency/view-model initialization. For extracting reusable subviews, @ViewBuilder, container patterns, AnyView, or ZStack vs overlay/background composition, use swiftui-expert-skill instead.
patrickserrano/lacquer · ★ 1 · Code & Development · score 67
Install: claude install-skill patrickserrano/lacquer
# SwiftUI View Refactor ## View Ordering (top to bottom) 1. Environment properties 2. `private`/`public` `let` constants 3. `@State` / other stored properties 4. Computed `var` (non-view) 5. `init` 6. `body` 7. Computed view builders / view helpers 8. Helper / async functions ## Core Guidelines ### 1) Prefer MV (Model-View) Patterns - Default to MV: views are lightweight state expressions; models/services own business logic - Favor `@State`, `@Environment`, `@Query`, `task`, and `onChange` for orchestration - Inject services and shared models via `@Environment` - Split large views into smaller views instead of introducing a view model ### 2) Split Large Bodies If `body` grows beyond a screen or has multiple logical sections, split it within this file: ```swift var body: some View { VStack(alignment: .leading, spacing: 16) { HeaderSection(title: title, isPinned: isPinned) DetailsSection(details: details) ActionsSection(onSave: onSave, onCancel: onCancel) } } ``` Or use computed view properties in the same file: ```swift var body: some View { List { header filters results footer } } private var header: some View { VStack(alignment: .leading, spacing: 6) { Text(title).font(.title2) Text(subtitle).font(.subheadline) } } private var filters: some View { ScrollView(.horizontal, showsIndicators: false) { HStack { ForEach(filterOptions, id: \.self) { opt