目的・役割
無料3種・有料9種の合計12テーマから選択できる画面。有料は 200コイン で購入。
プレミアム会員は全テーマ自動解放（実装検討）。
UI 構成
| 要素 | 種類 | 説明 |
|---|
| コインバッジ | HStack | 現在のコイン残高 |
| テーマカード | LazyVGrid | 各テーマのプレビュー（グラデーション） |
| 選択中バッジ | Overlay | 適用中テーマに ✓ マーク |
| 購入/適用ボタン | Button | 状態に応じてラベル変化 |
状態
| 状態 | 表示内容 |
|---|
| 無料テーマ | 「適用」ボタン |
| 未購入有料 | 「200コインで購入」ボタン |
| 購入済 | 「適用」ボタン |
| 残高不足 | 購入アラートで警告 |
使用するデータモデル
AppThemeItem {
let id: String
let name: String
let cost: Int // 0 or 200
let colors: [Color]
let begin: UnitPoint
let end: UnitPoint
}
ThemeService {
func getSelectedTheme() -> AppThemeItem
func setSelectedTheme(id: String)
func getUnlockedThemeIds() -> [String]
func purchaseTheme(id: String) -> Bool
}
実装メモ
- 無料テーマ3種は
cost: 0 で常時アンロック
- 有料9種は購入後に AppGroup に保存（unlocked_themes）
- 適用テーマは ThemeBackgroundView でグラデーション表示
関連
変更履歴
| バージョン | 日付 | 変更内容 |
|---|
| 1.0 | 2026-05-09 | 初版作成 |