# 画面設計書 29-通貨選択画面

## 概要

本ドキュメントは、Bagisto eコマースモバイルアプリにおける通貨選択画面の設計仕様を記述したものです。アプリ内で表示される価格の通貨を選択・変更する機能を提供します。

### 本画面の処理概要

本画面は、アプリ内で表示される価格の通貨を選択するための設定画面です。選択した通貨はSharedPreferencesに保存され、アプリ全体の価格表示に反映されます。通貨変更時はアプリが再起動されます。

**業務上の目的・背景**：グローバルeコマースにおいて、複数通貨のサポートは重要な機能です。ユーザーが自身の使い慣れた通貨で価格を確認できることで、購買決定がしやすくなります。為替レートはバックエンド側で管理され、選択された通貨でのフォーマット済み価格がAPIから返却されます。

**画面へのアクセス方法**：設定メニューまたはナビゲーションドロワーから「通貨」をタップしてアクセスします。

**主要な操作・処理内容**：
1. 画面初期化時に利用可能な通貨リストを取得する
2. 現在選択されている通貨をハイライト表示する
3. 通貨をタップして新しい通貨を選択する
4. 選択確定後、アプリを再起動して変更を反映する

**画面遷移**：設定メニューまたはドロワーから本画面に遷移します。通貨変更後はスプラッシュ画面に遷移してアプリが再起動されます。

**権限による表示制御**：特別な権限は不要です。ログイン状態に関係なくアクセス可能です。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 68 | 通貨切替 | 主機能 | 表示通貨の切替処理（選択後アプリ再起動） |

## 画面種別

選択

## URL/ルーティング

ルート名: `currencyScreen`（routes定義による）

## 入出力項目

本画面は入力パラメータを受け取りません。

## 表示項目

### 通貨リスト

| 項目名 | データ型 | 説明 |
|--------|---------|------|
| 選択状態アイコン | Icon | 選択時: radio_button_checked、未選択時: radio_button_off |
| 通貨名 | String | 通貨の名称（例: US Dollar） |
| 通貨コード | String | 通貨コード（例: USD） |

### 表示フォーマット

各通貨は「通貨名 (通貨コード)」の形式で表示されます（例: US Dollar (USD)）。

## イベント仕様

### 1-画面初期化イベント

画面初期化時（initState）に通貨リストと現在の選択状態を取得します。

処理フロー：
1. GlobalData.languageDataからcurrencyLanguageListを取得
2. _fetchSharedPreferenceDataを呼び出し
3. SharedPreferencesから現在の通貨コードを取得
4. 通貨リストから現在の通貨を検索し、_selectedIndexを設定

### 2-通貨選択イベント

通貨アイテムタップ時の処理です。

処理フロー：
1. _onTapCurrencyメソッドが呼び出される
2. 同じ通貨を選択した場合：SharedPreferencesに保存してpop
3. 異なる通貨を選択した場合：
   - _selectedIndex、_currentCurrencyCodeを更新
   - appStoragePref.setCurrencyCodeで通貨コードを保存
   - appStoragePref.setCurrencyLabelで通貨名を保存
   - GlobalData.currencyCodeを更新
   - Hive.deleteBoxFromDisk("recentProducts")で最近見た商品キャッシュを削除
   - _closeThisPageを呼び出し

### 3-アプリ再起動イベント

通貨変更確定後の処理です。

処理フロー：
1. Hive.deleteBoxFromDisk("getCategoriesDrawerData")でカテゴリキャッシュを削除
2. RestartWidget.restartApp(context)でアプリを再起動
3. Navigator.pushNamedAndRemoveUntilでスプラッシュ画面に遷移

## データベース更新仕様

### 操作別データベース影響一覧

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | 本画面ではサーバー側のデータベース操作は行わない |

通貨設定はクライアント側のSharedPreferencesに保存され、API呼び出し時のパラメータとして使用されます。

### ローカルストレージ（SharedPreferences）

| 操作 | キー | 値 | 備考 |
|-----|-----|-----|------|
| 保存 | currencyCode | 選択された通貨コード | USD等 |
| 保存 | currencyLabel | 選択された通貨名 | US Dollar等 |

### Hiveキャッシュ

| 操作 | ボックス名 | 内容 | 備考 |
|-----|-----------|------|------|
| 削除 | recentProducts | 最近見た商品 | 通貨変更時に削除 |
| 削除 | getCategoriesDrawerData | カテゴリドロワー | 通貨変更時に削除 |

## メッセージ仕様

| メッセージ種別 | メッセージキー | 表示内容 | 表示条件 |
|--------------|--------------|---------|---------|
| タイトル | StringConstants.currencyTitle | 通貨 | AppBarタイトル |

## 例外処理

| 例外状況 | 処理内容 | ユーザーへの表示 |
|---------|---------|----------------|
| 通貨データなし | 空のSizedBox表示 | 空の画面 |
| 通貨コード取得失敗 | デフォルト通貨（USD）を使用 | デフォルトで選択 |

## 備考

- 通貨リストはGlobalData.languageDataから取得（CurrencyLanguageListモデル）
- デフォルト通貨コードは"USD"
- 通貨変更後はキャッシュをクリアしてアプリを再起動
- RestartWidgetはアプリ全体を再構築するためのウィジェット
- GlobalData.currencyCodeはアプリ全体で参照される通貨コード
- Hiveは高速なNoSQLデータベースで、キャッシュストレージとして使用

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

まず、通貨データの構造を理解することが重要です。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | currency_language_model.dart | `lib/data_model/currency_language_model.dart` | CurrencyLanguageList、Currenciesの構造 |

**読解のコツ**: CurrencyLanguageListがList<Currencies>を持ち、各Currenciesがnameとcodeを持ちます。言語データと共通のモデルを使用しています。

#### Step 2: エントリーポイントを理解する

処理の起点となるファイル・関数を特定します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | curency_view.dart | `lib/screens/currency/curency_view.dart` | CurrencyScreenクラスがエントリーポイント |

**主要処理フロー**:
1. **29-33行目**: initStateでGlobalData.languageDataから通貨リスト取得、現在の選択を設定
2. **36-44行目**: buildメソッドでScaffold、AppBar、通貨リスト構築
3. **47-79行目**: _currencyでListView.builderによる通貨リスト表示
4. **82-99行目**: _onTapCurrencyで通貨選択処理
5. **101-106行目**: _closeThisPageでアプリ再起動

#### Step 3: グローバルデータを理解する

アプリ全体で使用されるグローバルデータを確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | main.dart | `lib/main.dart` | GlobalData、RestartWidgetの定義 |

#### Step 4: ストレージ層を理解する

データの永続化と取得を確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | app_storage_pref.dart | `lib/utils/app_storage_pref.dart` | setCurrencyCode、getCurrencyCodeの実装 |

### プログラム呼び出し階層図

```
CurrencyScreen (curency_view.dart)
    │
    ├─ initState()
    │      ├─ GlobalData.languageData取得
    │      └─ _fetchSharedPreferenceData()
    │             └─ appStoragePref.getCurrencyCode()
    │
    ├─ build()
    │      ├─ AppBar (タイトル表示)
    │      └─ _currency(currencyLanguageList)
    │             └─ ListView.builder
    │                    └─ GestureDetector (各通貨行)
    │                           └─ _onTapCurrency()
    │
    ├─ _onTapCurrency()
    │      ├─ 同じ通貨選択時
    │      │      └─ Navigator.pop()
    │      │
    │      └─ 異なる通貨選択時
    │             ├─ setState()
    │             ├─ appStoragePref.setCurrencyCode()
    │             ├─ appStoragePref.setCurrencyLabel()
    │             ├─ GlobalData.currencyCode更新
    │             ├─ Hive.deleteBoxFromDisk("recentProducts")
    │             └─ _closeThisPage()
    │
    └─ _closeThisPage()
           ├─ appStoragePref.setCurrencyCode()
           ├─ Hive.deleteBoxFromDisk("getCategoriesDrawerData")
           ├─ RestartWidget.restartApp()
           └─ Navigator.pushNamedAndRemoveUntil(splash)
```

### データフロー図

```
[入力]                      [処理]                              [出力]

GlobalData.languageData ───▶ initState()                     ───▶ 通貨リスト表示
                                 │
                                 ▼
SharedPreferences        ───▶ _fetchSharedPreferenceData()   ───▶ 現在選択のハイライト
(currencyCode)                   │
                                 ▼
                         通貨リストから検索
                                 │
                                 ▼
                         _selectedIndex設定

通貨タップ               ───▶ _onTapCurrency()               ───▶ 通貨変更
                                 │
                                 ▼
                         SharedPreferences保存
                          ├─ currencyCode
                          └─ currencyLabel
                                 │
                                 ▼
                         GlobalData.currencyCode更新
                                 │
                                 ▼
                         Hiveキャッシュ削除
                          ├─ recentProducts
                          └─ getCategoriesDrawerData
                                 │
                                 ▼
                         RestartWidget.restartApp()          ───▶ アプリ再起動
                                 │
                                 ▼
                         スプラッシュ画面遷移               ───▶ アプリ再初期化
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| curency_view.dart | `lib/screens/currency/curency_view.dart` | ソース | 画面本体のStatefulWidget |
| currency_language_model.dart | `lib/data_model/currency_language_model.dart` | ソース | 通貨・言語データモデル |
| main.dart | `lib/main.dart` | ソース | GlobalData、RestartWidget定義 |
| app_storage_pref.dart | `lib/utils/app_storage_pref.dart` | ソース | SharedPreferencesラッパー |
| index.dart | `lib/screens/account/utils/index.dart` | ソース | 共通インポートファイル |
