Peter Steinberger

Swiftui View Refactor

開發程式設計v1.0.0
作者:Peter Steinberger更新於 2026-05-11swiftui-view-refactor@clawhub_steipete/swiftui-view-refactor
程式碼生成程式碼審查

據 AlphaMoat 統計,截至 2026-09,Swiftui View Refactor 累計下載 3,953 次、獲 6 個星標,在全部 5,078 個 AI 技能中排名第 2,610 位,在「開發程式設計」分類(577 個)中排名第 340 位。

累計安裝
129
累計下載
3953
星標
6
全站排名
#2,610
全站前 52% · 「開發程式設計」前 59%
平台累計安裝累計下載星標評論
ClawHub ↗12839286-
SkillHub ↗12939536—

各平台的計數口徑不同,統計時間不一致。

這個技能是做什麼的

該指南整理檢視屬性與方法順序,偏好輕量檢視和 MV 組織方式,並關注依賴注入與 Observation 狀態傳遞。其架構建議具有明確傾向,未必適合每個程式碼庫;應用前應對照專案現有約定,逐項審閱差異,確保佈局、行為和業務邏輯沒有被機械式重構改變。

資料釋出於 2026-10-29

可以用來做什麼

  • 統一 SwiftUI 檢視檔案的組織結構
  • 檢查依賴注入和狀態傳遞方式
  • 在符合專案約定時整理檢視程式碼

什麼時候用

  • 使用者要求審查或整理 SwiftUI 檢視時
  • 目標專案允許採用其偏好的 MV 結構時
  • 能夠檢查程式碼差異並執行專案現有驗證時

示例提示詞

以下是根據技能文件生成的示例,不代表實際執行結果。

請按本專案現有約定審查這個 SwiftUI 檢視,先給出擬調整的結構和差異;不要改變佈局、行為或業務邏輯,等待我確認後再修改。

月度資料趨勢

累計下載3953
2606333040532026-03 · 累計下載 27062026-05 · 累計下載 32362026-06 · 累計下載 33932026-07 · 累計下載 36582026-08 · 累計下載 37952026-09 · 累計下載 395326-0326-09
星標6
5672026-03 · 星標 62026-05 · 星標 62026-06 · 星標 62026-07 · 星標 62026-08 · 星標 62026-09 · 星標 626-0326-09

2026-09 起統計方法調整:同名技能按作者分別統計,並覆蓋全部技能。圖中虛線為調整前的月份,與之後的資料不直接比較,也不計算跨越調整的增長。

月份累計下載環比星標
2026-093953—6
2026-083795+3.7%6
2026-073658+7.8%6
2026-063393+4.9%6
2026-053236—6
2026-032706—6

SKILL.md 原文

以下是作者釋出的原始檔案,按純文字顯示,本站未做修改或稽核;其中的連結不可點選,命令請核實後再執行。抓取於 2026-10-23。

4.7 KB · ClawHub v1.0.0
---
name: swiftui-view-refactor
description: Refactor and review SwiftUI view files for consistent structure, dependency injection, and Observation usage. Use when asked to clean up a SwiftUI view’s layout/ordering, handle view models safely (non-optional when possible), or standardize how dependencies and @Observable state are initialized and passed.
---

# SwiftUI View Refactor

_Attribution: copied from @Dimillian’s `Dimillian/Skills` (2025-12-31)._

## Overview
展開全部(共 135 行)
Apply a consistent structure and dependency pattern to SwiftUI views, with a focus on ordering, Model-View (MV) patterns, careful view model handling, and correct Observation usage.

## Core Guidelines

### 1) View ordering (top → bottom)
- Environment
- `private`/`public` `let`
- `@State` / other stored properties
- computed `var` (non-view)
- `init`
- `body`
- computed view builders / other view helpers
- helper / async functions

### 2) Prefer MV (Model-View) patterns
- Default to MV: Views are lightweight state expressions; models/services own business logic.
- Favor `@State`, `@Environment`, `@Query`, and `task`/`onChange` for orchestration.
- Inject services and shared models via `@Environment`; keep views small and composable.
- Split large views into subviews rather than introducing a view model.

### 3) Split large bodies and view properties
- If `body` grows beyond a screen or has multiple logical sections, split it into smaller subviews.
- Extract large computed view properties (`var header: some View { ... }`) into dedicated `View` types when they carry state or complex branching.
- It's fine to keep related subviews as computed view properties in the same file; extract to a standalone `View` struct only when it structurally makes sense or when reuse is intended.
- Prefer passing small inputs (data, bindings, callbacks) over reusing the entire parent view state.

Example (extracting a section):

```swift
var body: some View {
    VStack(alignment: .leading, spacing: 16) {
        HeaderSection(title: title, isPinned: isPinned)
        DetailsSection(details: details)
        ActionsSection(onSave: onSave, onCancel: onCancel)
    }
}
```

Example (long body → shorter body + computed views 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) { option in
                FilterChip(option: option, isSelected: option == selectedFilter)
                    .onTapGesture { selectedFilter = option }
            }
        }
    }
}
```

Example (extracting a complex computed view):

```swift
private var header: some View {
    HeaderSection(title: title, subtitle: subtitle, status: status)
}

private struct HeaderSection: View {
    let title: String
    let subtitle: String?
    let status: Status

    var body: some View {
        VStack(alignment: .leading, spacing: 4) {
            Text(title).font(.headline)
            if let subtitle { Text(subtitle).font(.subheadline) }
            StatusBadge(status: status)
        }
    }
}
```

### 4) View model handling (only if already present)
- Do not introduce a view model unless the request or existing code clearly calls for one.
- If a view model exists, make it non-optional when possible.
- Pass dependencies to the view via `init`, then pass them into the view model in the view's `init`.
- Avoid `bootstrapIfNeeded` patterns.

Example (Observation-based):

```swift
@State private var viewModel: SomeViewModel

init(dependency: Dependency) {
    _viewModel = State(initialValue: SomeViewModel(dependency: dependency))
}
```

### 5) Observation usage
- For `@Observable` reference types, store them as `@State` in the root view.
- Pass observables down explicitly as needed; avoid optional state unless required.

## Workflow

1) Reorder the view to match the ordering rules.
2) Favor MV: move lightweight orchestration into the view using `@State`, `@Environment`, `@Query`, `task`, and `onChange`.
3) If a view model exists, replace optional view models with a non-optional `@State` view model initialized in `init` by passing dependencies from the view.
4) Confirm Observation usage: `@State` for root `@Observable` view models, no redundant wrappers.
5) Keep behavior intact: do not change layout or business logic unless requested.

## Notes

- Prefer small, explicit helpers over large conditional blocks.
- Keep computed view builders below `body` and non-view computed vars above `init`.
- For MV-first guidance and rationale, see `references/mv-patterns.md`.

「開發程式設計」分類下的熱門技能

Peter Steinberger 的其他技能

資料月份:2026-09 · 下載/星標/安裝數聚合自公開技能註冊庫(ClawHub、SkillHub),按月更新。口徑說明見資料方法。