プレビュー
概要
SwiftUIアプリで使うHUDオーバーレイです。
- ドラッグ、画面端へのスナップ、折りたたみと展開を実装しました。
- matchedGeometryEffectとスプリングで状態遷移を調整しました。
- Swift Packageとして切り出し、ほかのアプリでも使えるようにしました。
詳しい開発記録
期間
2025.02 - (進行中)
- HUDオーバーレイをSwift Packageとして切り出し、どのアプリにもすぐ組み込めるように整理
- ドラッグとスナップに使うスプリングを調整し、カードの移動・展開を滑らかに
使用ツール・スキル
スキル
- SwiftUIレイアウト・matchedGeometryEffect
- インタラクティブスプリングとジェスチャ処理
- Swift Packageとしてのモジュール化
動機
メトリクスやデバッグ情報を手軽に表示できる、再利用可能なHUDが欲しかった。既存のHUDは特定のアプリに依存するものやUIKitベースのものが多いため、SwiftUIだけでコンパクト表示と展開表示を同期し、画面端にスナップするオーバーレイを自作しました。
学んだこと
- コンパクト表示と展開表示のSwiftUIビュー間での状態共有とmatched geometry
- ドラッグやアンカーへのスナップ、変化を強調した折りたたみ動作に合わせたスプリングの調整
- 利用者が定数やカードスタイルを差し替えやすい設計