ios-navigation について
ios-navigationは、clinicのモジュール型MVVM-Cアーキテクチャに沿ったSwiftUIナビゲーションのガイドです。iOS開発者向けに、コーディネーターとルートシェルの構成、画面遷移、アクセシビリティ、状態復元を扱います。
主な機能
- 01コーディネーターとルートシェルの設計
- 02プッシュ、シート、ディープリンクのパターン
- 03複数ステップとタブのナビゲーション
- 04トランジションとモーダル表示の指針
- 05ナビゲーションのアクセシビリティ
- 06状態復元の指針
活用シーン
- 01SwiftUIアプリのナビゲーション階層の設計
- 02オンボーディングなど複数ステップのフロー構築
- 03ディープリンクとナビゲーション永続化の追加
- 04モジュール性とアクセシビリティの観点でのナビゲーション確認
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ pproenca/ dot-skills --skill ios-navigationインストール後、Claude Code で/ios-navigationを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
metadata.jsonassets/templates/_template.mdreferences/_sections.mdally-focus-after-navigation.mdally-group-navigation-elements.mdally-hide-decorative-navigation.mdally-keyboard-focus.mdally-rotor-headers.mdanim-gesture-driven.mdanim-matched-geometry-same-view.mdanim-reduce-motion-transitions.mdanim-scroll-driven.mdanim-spring-config.mdanim-transition-source-styling.mdanim-zoom-transition.mdanti-hamburger-menu.mdanti-hidden-back-button.mdanti-mixed-link-styles.mdanti-navigation-in-init.mdanti-programmatic-tab-switch.mdanti-scattered-destinations.mdanti-shared-stack.mdarch-coordinator-modals.mdarch-coordinator.mdarch-deep-linking.mdarch-destination-item.mdarch-destination-registration.mdarch-equatable-views.mdarch-navigation-path.mdarch-navigation-stack.md詳細
iOS ナビゲーション(モジュラー MVVM-C)
クリニックのモジュラーアーキテクチャを使用する SwiftUI アプリ向けの、意見を明確に打ち出したナビゲーションの指針です。コーディネーターとルートシェルの連携、機能の分離、堅牢なプッシュ/シート/ディープリンクのフローに重点を置きます。
譲れない制約(iOS 26 / Swift 6.2)
- すべてのナビゲーションビューで
@Equatableマクロを使用し、AnyViewは決して使用しない - どこでも
@Observableを使用し、ObservableObject/@Publishedは決して使用しない - アプリターゲットのコーディネーターが
NavigationPathを所有し、ルートシェルが.navigationDestinationのマッピングを所有する - モーダル状態はコーディネーターが所有し、シート用のインライン
@Stateブール値は決して使用しない - ドメイン層でコーディネータープロトコルを定義し、具象コーディネーターを機能モジュールに含めない
クリニックアーキテクチャの契約(iOS 26 / Swift 6.2)
このスキルのすべてのガイダンスは、クリニックのモジュラー MVVM-C アーキテクチャを前提としています。
- 機能モジュールがインポートできるのは
DomainとDesignSystemのみです(Dataや兄弟機能は決してインポートしません) - アプリターゲットが統合地点となり、
DependencyContainer、具象コーディネーター、ルートシェルの連携を所有します Domainは純粋な Swift を保ち、モデルと、リポジトリ、*Coordinating、ErrorRouting、AppErrorの各契約を定義しますDataは SwiftData/ネットワーク/同期/再試行/バックグラウンド I/O を所有し、Domain プロトコルを実装します- 読み書きフローの既定動作は、読み取りでは stale-while-revalidate、書き込みでは楽観的なキュー処理です
- ViewModel はリポジトリプロトコルを直接呼び出します(既定のユースケース/インタラクター層はありません)
適用する場合
以下の場合にこのガイドラインを参照してください。
- NavigationStack または NavigationSplitView を使ったナビゲーション階層を設計する
- プッシュ、シート、fullScreenCover のどれを使うか選択する
- ヒーローアニメーション、ズームトランジション、またはジェスチャーによる閉じる動作を実装する
- 複数ステップのフロー(オンボーディング、チェックアウト、登録)を構築する
- 共有ナビゲーション状態に
@Environmentと@Bindableを組み合わせて@Observableを使用する - ナビゲーションのアンチパターンとモジュラーアーキテクチャへの準拠についてコードをレビューする
- ディープリンク、状態復元、またはタブの状態保持を追加する
- ナビゲーションで VoiceOver と視差効果を減らす設定への対応を確保する
優先度別のルールカテゴリ
| 優先度 | カテゴリ | 影響度 | プレフィックス |
|---|---|---|---|
| 1 | ナビゲーションアーキテクチャ | 重大 | arch- |
| 2 | ナビゲーションのアンチパターン | 重大 | anti- |
| 3 | トランジションとアニメーション | 高 | anim- |
| 4 | モーダル表示 | 高 | modal- |
| 5 | フローのオーケストレーション | 高 | flow- |
| 6 | ナビゲーションのパフォーマンス | 中〜高 | perf- |
| 7 | ナビゲーションのアクセシビリティ | 中 | ally- |
| 8 | 状態と復元 | 中 | state- |
クイックリファレンス
1. ナビゲーションアーキテクチャ(重要)
arch-navigation-stack- 非推奨の NavigationView ではなく NavigationStack を使用しますarch-value-based-links- destination クロージャではなく、値ベースの NavigationLink を使用しますarch-destination-registration- navigationDestination はスタックのルートで登録しますarch-destination-item- オプショナルベースのナビゲーションには navigationDestination(item:) を使用します(iOS 26 / Swift 6.2)arch-route-enum- ルートは Hashable な列挙型として定義しますarch-split-view- マルチカラムレイアウトには NavigationSplitView を使用しますarch-coordinator- ナビゲーションロジックを Observable コーディネーターに切り出しますarch-observable-environment- 共有状態には @Observable と @Bindable を組み合わせて @Environment を使用しますarch-deep-linking- NavigationPath に追加してディープリンクを処理しますarch-navigation-path- 異種型を型消去して扱うナビゲーションには NavigationPath を使用しますarch-equatable-views- すべてのナビゲーションビューに @Equatable マクロを適用しますarch-observable-only- @Observable のみを使用し、ObservableObject や @Published は使用しませんarch-no-anyview- ナビゲーションでは AnyView を使用せず、@ViewBuilder またはジェネリクスを使用しますarch-coordinator-modals- すべてのモーダルはコーディネーター経由で表示し、インラインの @State は使用しません
2. ナビゲーションのアンチパターン(重要)
anti-mixed-link-styles- NavigationLink(destination:) と NavigationLink(value:) を混在させないでくださいanti-scattered-destinations- navigationDestination を複数のビューに分散させないでくださいanti-shared-stack- NavigationStack をタブ間で共有しないでくださいanti-hidden-back-button- スワイプジェスチャーを維持せずに戻るボタンを非表示にしないでくださいanti-navigation-in-init- ビューのイニシャライザーで負荷の高い処理を行わないでくださいanti-hamburger-menu- ハンバーガーメニューによるナビゲーションは避けてくださいanti-programmatic-tab-switch- プログラムによるタブ選択の変更は避けてください
3. トランジションとアニメーション(高)
anim-zoom-transition- ヒーローアニメーションにはズームナビゲーショントランジションを使用します(iOS 18+)anim-matched-geometry-same-view- matchedGeometryEffect は同じビュー階層内でのみ使用しますanim-spring-config- 最新のスプリングアニメーション構文を使用します(iOS 26 / Swift 6.2)anim-gesture-driven- ジェスチャー駆動のトランジションにはインタラクティブなスプリングアニメーションを使用しますanim-transition-source-styling- トランジションのソースをシェイプと背景でスタイル設定しますanim-reduce-motion-transitions- すべてのナビゲーションアニメーションで視差効果を減らす設定を尊重しますanim-scroll-driven- スクロール駆動のトランジションには onScrollGeometryChange を使用します(iOS 18+)
4. モーダル表示(HIGH)
modal-sheet-vs-push- 詳細画面への移動にはプッシュを使い、補足コンテンツにはシートを使いますmodal-detents- コンテキストに応じたシートのサイズ設定には、表示デテントを使いますmodal-fullscreen-cover- 没入型の独立した体験に限り、fullScreenCover を使いますmodal-sheet-placement- .sheet は NavigationLink ではなく、コンテナビューに配置しますmodal-interactive-dismiss- interactiveDismissDisabled を使って、未保存の変更がある場合の操作による閉じる動作を制御しますmodal-nested-navigation- モーダル内では別の NavigationStack を使います
5. フローのオーケストレーション(HIGH)
flow-tab-independence- 各タブにそれぞれ独自の NavigationStack を持たせますflow-multi-step- 複数ステップのフローには、ルート配列を使う NavigationStack を使いますflow-sidebar-navigation- サイドバーには、選択バインディングを使う NavigationSplitView を使いますflow-tab-sidebar-adaptive- iPad でタブをサイドバーに切り替えるには、sidebarAdaptable TabView を使います(iOS 18 以降)flow-pop-to-root- NavigationPath をクリアして、ルート画面に戻る動作を実装しますflow-screen-independence- 画面を親のナビゲーションコンテキストから独立させます
6. ナビゲーションのパフォーマンス(MEDIUM-HIGH)
perf-lazy-destinations- 遷移先を遅延構築するには、値ベースの NavigationLink を使いますperf-task-modifier- ナビゲーション時の非同期データ読み込みには .task を使いますperf-state-object-ownership- @Observable の状態は @State で所有し、通常のプロパティとして渡しますperf-avoid-body-side-effects- ビューの body 内での副作用を避けます
7. ナビゲーションのアクセシビリティ(MEDIUM)
ally-rotor-headers- VoiceOver ローターでナビゲーションのセクション見出しを識別できるようにしますally-focus-after-navigation- プログラムによるナビゲーションイベントの後にフォーカスを管理しますally-group-navigation-elements- 関連するナビゲーション要素をグループ化して、スワイプ回数を減らしますally-hide-decorative-navigation- 装飾的なナビゲーション要素を VoiceOver から隠しますally-keyboard-focus- フォームでのキーボードナビゲーションには @FocusState を使います
8. 状態と復元(MEDIUM)
state-codable-routes- ナビゲーション状態を永続化するため、ルートの enum を Codable にしますstate-scene-storage- シーンごとのナビゲーション状態を永続化するには SceneStorage を使いますstate-tab-persistence- 選択中のタブを SceneStorage で永続化しますstate-deep-link-urls- ディープリンク URL をルートの enum に解析しますstate-avoid-app-level-path- App レベルで NavigationPath を定義するのは避けます
使用方法
詳しい説明とコード例については、個々のリファレンスファイルを参照してください。
- セクションの定義 - カテゴリー構成と影響レベル
- ルールのテンプレート - 新しいルールを追加するためのテンプレート
リファレンスファイル
| ファイル | 説明 |
|---|---|
| references/_sections.md | カテゴリーの定義と順序 |
| assets/templates/_template.md | 新しいルール用のテンプレート |
| metadata.json | バージョンとリファレンス情報 |
コメント
Markdown 対応