# 画面設計書 6-設定画面

## 概要

本ドキュメントは、InvenTree Flutterアプリケーションの設定画面（InvenTreeSettingsWidget）の画面設計を定義するものである。

### 本画面の処理概要

設定画面はアプリケーションの各種設定カテゴリへのナビゲーションハブとして機能し、ユーザーがサーバー接続、アプリ動作、各機能の設定を行うための起点を提供する。

**業務上の目的・背景**：モバイルアプリケーションでは、ユーザーの利用環境や業務フローに合わせて動作をカスタマイズできることが重要である。本画面はサーバー接続設定、ホーム画面表示設定、バーコード動作設定、各機能の表示設定など、業務効率に直結する設定へのアクセスを一元化する。

**画面へのアクセス方法**：ドロワーメニューの「設定」項目をタップ。

**主要な操作・処理内容**：
1. サーバー設定画面への遷移（サーバープロファイルの管理）
2. アプリ設定画面への遷移（ダークモード、言語、エラー報告等）
3. ホーム画面設定への遷移（表示項目のカスタマイズ）
4. バーコード設定画面への遷移（スキャナータイプ、遅延設定）
5. 部品設定画面への遷移（BOM、価格、要件の表示設定）
6. 在庫設定画面への遷移（履歴、テスト結果の表示設定）
7. 購入注文設定画面への遷移（購入注文関連の設定）
8. 販売注文設定画面への遷移（販売注文関連の設定）
9. アバウト画面への遷移（アプリ情報、リリースノート）

**画面遷移**：
- 遷移元：ドロワーメニュー
- 遷移先：サーバー選択画面、アプリ設定画面、ホーム画面設定、バーコード設定画面、部品設定画面、在庫設定画面、購入注文設定画面、販売注文設定画面、アバウト画面

**権限による表示制御**：本画面は全ユーザーがアクセス可能。個別設定画面での制御はそれぞれの画面で行われる。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 57 | アプリ設定 | 遷移先機能 | アプリ設定メニュー押下時にアプリ設定画面へ遷移 |
| 58 | ホーム画面設定 | 遷移先機能 | ホーム画面設定メニュー押下時にホーム画面設定へ遷移 |
| 59 | バーコード設定 | 遷移先機能 | バーコード設定メニュー押下時にバーコード設定画面へ遷移 |
| 60 | パーツ設定 | 遷移先機能 | パーツ設定メニュー押下時にパーツ設定画面へ遷移 |
| 61 | 在庫設定 | 遷移先機能 | 在庫設定メニュー押下時に在庫設定画面へ遷移 |
| 62 | 発注設定 | 遷移先機能 | 発注設定メニュー押下時に発注設定画面へ遷移 |
| 63 | 受注設定 | 遷移先機能 | 受注設定メニュー押下時に受注設定画面へ遷移 |
| 65 | アバウト表示 | 遷移先機能 | アバウトメニュー押下時にアバウト画面へ遷移 |
| 2 | ユーザープロファイル管理 | 遷移先機能 | サーバー設定メニュー押下時にサーバー選択画面へ遷移 |

## 画面種別

ナビゲーションメニュー（設定ハブ型）

## URL/ルーティング

- Flutter Widget：`InvenTreeSettingsWidget`（StatefulWidget）
- 状態クラス：`_InvenTreeSettingsState`

## 入出力項目

| 項目名 | 入力/出力 | データ型 | 必須 | 説明 |
|--------|----------|----------|------|------|
| なし | - | - | - | 本画面は入力パラメータを持たない |

## 表示項目

| 項目名 | データ型 | 説明 | 取得元 |
|--------|----------|------|--------|
| サーバー設定項目 | ListTile | サーバープロファイル管理へのリンク | 固定表示 |
| アプリ設定項目 | ListTile | アプリ全般設定へのリンク | 固定表示 |
| ホーム画面設定項目 | ListTile | ホーム画面表示設定へのリンク | 固定表示 |
| バーコード設定項目 | ListTile | バーコード動作設定へのリンク | 固定表示 |
| 部品設定項目 | ListTile | 部品表示設定へのリンク | 固定表示 |
| 在庫設定項目 | ListTile | 在庫表示設定へのリンク | 固定表示 |
| 購入注文設定項目 | ListTile | 購入注文設定へのリンク | 固定表示 |
| 販売注文設定項目 | ListTile | 販売注文設定へのリンク | 固定表示 |
| アバウト項目 | ListTile | アプリ情報表示へのリンク | 固定表示 |

## イベント仕様

### 1-サーバー設定押下

サーバー設定項目をタップした際にサーバー選択画面へ遷移する。

**処理フロー**：
1. ユーザーがサーバー設定項目をタップ
2. `Navigator.push()`で`InvenTreeSelectServerWidget()`へ遷移

### 2-アプリ設定押下

アプリ設定項目をタップした際にアプリ設定画面へ遷移する。

**処理フロー**：
1. ユーザーがアプリ設定項目をタップ
2. `Navigator.push()`で`InvenTreeAppSettingsWidget()`へ遷移

### 3-ホーム画面設定押下

ホーム画面設定項目をタップした際にホーム画面設定へ遷移する。

**処理フロー**：
1. ユーザーがホーム画面設定項目をタップ
2. `Navigator.push()`で`HomeScreenSettingsWidget()`へ遷移

### 4-バーコード設定押下

バーコード設定項目をタップした際にバーコード設定画面へ遷移する。

**処理フロー**：
1. ユーザーがバーコード設定項目をタップ
2. `Navigator.push()`で`InvenTreeBarcodeSettingsWidget()`へ遷移

### 5-部品設定押下

部品設定項目をタップした際に部品設定画面へ遷移する。

**処理フロー**：
1. ユーザーが部品設定項目をタップ
2. `Navigator.push()`で`InvenTreePartSettingsWidget()`へ遷移

### 6-在庫設定押下

在庫設定項目をタップした際に在庫設定画面へ遷移する。

**処理フロー**：
1. ユーザーが在庫設定項目をタップ
2. `Navigator.push()`で`InvenTreeStockSettingsWidget()`へ遷移

### 7-購入注文設定押下

購入注文設定項目をタップした際に購入注文設定画面へ遷移する。

**処理フロー**：
1. ユーザーが購入注文設定項目をタップ
2. `Navigator.push()`で`InvenTreePurchaseOrderSettingsWidget()`へ遷移

### 8-販売注文設定押下

販売注文設定項目をタップした際に販売注文設定画面へ遷移する。

**処理フロー**：
1. ユーザーが販売注文設定項目をタップ
2. `Navigator.push()`で`InvenTreeSalesOrderSettingsWidget()`へ遷移

### 9-アバウト押下

アバウト項目をタップした際にアバウト画面へ遷移する。

**処理フロー**：
1. ユーザーがアバウト項目をタップ
2. `_about()`メソッドが呼び出される
3. `PackageInfo.fromPlatform()`でアプリ情報を取得
4. `Navigator.push()`で`InvenTreeAboutWidget(info)`へ遷移

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| なし | - | - | 本画面はナビゲーションのみでデータ更新なし |

## メッセージ仕様

| メッセージID | 種別 | メッセージ内容 | 表示条件 |
|-------------|------|--------------|---------|
| MSG-001 | タイトル | L10().settings | AppBarタイトル |
| MSG-002 | 項目 | L10().server | サーバー設定タイトル |
| MSG-003 | 項目 | L10().configureServer | サーバー設定サブタイトル |
| MSG-004 | 項目 | L10().appSettings | アプリ設定タイトル |
| MSG-005 | 項目 | L10().appSettingsDetails | アプリ設定サブタイトル |
| MSG-006 | 項目 | L10().homeScreen | ホーム画面設定タイトル |
| MSG-007 | 項目 | L10().homeScreenSettings | ホーム画面設定サブタイトル |
| MSG-008 | 項目 | L10().barcodes | バーコード設定タイトル |
| MSG-009 | 項目 | L10().barcodeSettings | バーコード設定サブタイトル |
| MSG-010 | 項目 | L10().part | 部品設定タイトル |
| MSG-011 | 項目 | L10().partSettings | 部品設定サブタイトル |
| MSG-012 | 項目 | L10().stock | 在庫設定タイトル |
| MSG-013 | 項目 | L10().stockSettings | 在庫設定サブタイトル |
| MSG-014 | 項目 | L10().purchaseOrder | 購入注文設定タイトル |
| MSG-015 | 項目 | L10().purchaseOrderSettings | 購入注文設定サブタイトル |
| MSG-016 | 項目 | L10().salesOrder | 販売注文設定タイトル |
| MSG-017 | 項目 | L10().salesOrderSettings | 販売注文設定サブタイトル |
| MSG-018 | 項目 | L10().about | アバウトタイトル |

## 例外処理

| 例外種別 | 発生条件 | 対応処理 |
|---------|---------|---------|
| パッケージ情報取得失敗 | PackageInfo.fromPlatform()が失敗 | アバウト画面への遷移をスキップ |

## 備考

- 設定画面は単純なナビゲーションハブとして機能する
- 各設定項目にはアイコン、タイトル、サブタイトル、リンクアイコン（LinkIcon）が表示される
- Dividerで論理的なグループ分け（サーバー設定、アプリ設定群、アバウト）を行っている

---

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

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

### 推奨読解順序

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

設定画面は主にナビゲーションを行うため、データ構造は比較的単純である。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | settings.dart | `lib/settings/settings.dart` | InvenTreeSettingsWidgetのクラス構造を理解する |

**読解のコツ**: 設定画面はStatefulWidgetだが、状態管理はほぼ行っていない。主にbuild()メソッドでListViewを構築している。

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

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

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | settings.dart | `lib/settings/settings.dart` | build()メソッドの構造を理解する |

**主要処理フロー**:
1. **行21-24**: InvenTreeSettingsWidgetクラスの定義
2. **行26-28**: _InvenTreeSettingsStateクラスの定義、ScaffoldKeyの宣言
3. **行32-39**: `_about()`メソッドでPackageInfoを取得してアバウト画面へ遷移
4. **行41-178**: `build()`メソッドでScaffoldとListViewを構築
5. **行51-65**: サーバー設定項目のListTile
6. **行67-80**: アプリ設定項目のListTile
7. **行81-94**: ホーム画面設定項目のListTile
8. **行95-108**: バーコード設定項目のListTile
9. **行109-122**: 部品設定項目のListTile
10. **行123-136**: 在庫設定項目のListTile
11. **行137-150**: 購入注文設定項目のListTile
12. **行151-164**: 販売注文設定項目のListTile
13. **行167-172**: アバウト項目のListTile

#### Step 3: 遷移先画面を理解する

各設定画面の概要を確認する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | select_server.dart | `lib/settings/select_server.dart` | サーバー選択画面の構造 |
| 3-2 | app_settings.dart | `lib/settings/app_settings.dart` | アプリ設定画面の構造 |
| 3-3 | home_settings.dart | `lib/settings/home_settings.dart` | ホーム画面設定の構造 |
| 3-4 | barcode_settings.dart | `lib/settings/barcode_settings.dart` | バーコード設定画面の構造 |
| 3-5 | part_settings.dart | `lib/settings/part_settings.dart` | 部品設定画面の構造 |
| 3-6 | stock_settings.dart | `lib/settings/stock_settings.dart` | 在庫設定画面の構造 |
| 3-7 | purchase_order_settings.dart | `lib/settings/purchase_order_settings.dart` | 購入注文設定画面の構造 |
| 3-8 | sales_order_settings.dart | `lib/settings/sales_order_settings.dart` | 販売注文設定画面の構造 |
| 3-9 | about.dart | `lib/settings/about.dart` | アバウト画面の構造 |

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

```
InvenTreeSettingsWidget (settings.dart)
    |
    +-- _InvenTreeSettingsState
            |
            +-- build()
                    |
                    +-- Scaffold
                            |
                            +-- AppBar (L10().settings)
                            |
                            +-- ListView
                                    |
                                    +-- ListTile (サーバー)
                                    |       +-- Navigator.push(InvenTreeSelectServerWidget)
                                    |
                                    +-- Divider
                                    |
                                    +-- ListTile (アプリ設定)
                                    |       +-- Navigator.push(InvenTreeAppSettingsWidget)
                                    |
                                    +-- ListTile (ホーム画面)
                                    |       +-- Navigator.push(HomeScreenSettingsWidget)
                                    |
                                    +-- ListTile (バーコード)
                                    |       +-- Navigator.push(InvenTreeBarcodeSettingsWidget)
                                    |
                                    +-- ListTile (部品)
                                    |       +-- Navigator.push(InvenTreePartSettingsWidget)
                                    |
                                    +-- ListTile (在庫)
                                    |       +-- Navigator.push(InvenTreeStockSettingsWidget)
                                    |
                                    +-- ListTile (購入注文)
                                    |       +-- Navigator.push(InvenTreePurchaseOrderSettingsWidget)
                                    |
                                    +-- ListTile (販売注文)
                                    |       +-- Navigator.push(InvenTreeSalesOrderSettingsWidget)
                                    |
                                    +-- Divider
                                    |
                                    +-- ListTile (アバウト)
                                            +-- _about()
                                                    +-- PackageInfo.fromPlatform()
                                                    +-- Navigator.push(InvenTreeAboutWidget)
```

### データフロー図

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

画面表示                -->  build()                          -->  ListView描画
                                |
                                v
[項目タップ]            -->  Navigator.push()                 -->  画面遷移
                                |
                                +-- InvenTreeSelectServerWidget
                                +-- InvenTreeAppSettingsWidget
                                +-- HomeScreenSettingsWidget
                                +-- InvenTreeBarcodeSettingsWidget
                                +-- InvenTreePartSettingsWidget
                                +-- InvenTreeStockSettingsWidget
                                +-- InvenTreePurchaseOrderSettingsWidget
                                +-- InvenTreeSalesOrderSettingsWidget
                                +-- InvenTreeAboutWidget

[アバウトタップ]        -->  _about()                         -->  PackageInfo取得
                                |
                                v
                        PackageInfo.fromPlatform()           -->  アプリ情報
                                |
                                v
                        Navigator.push(InvenTreeAboutWidget) -->  アバウト画面
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| settings.dart | `lib/settings/settings.dart` | ソース | 設定画面のメインWidget |
| select_server.dart | `lib/settings/select_server.dart` | ソース | サーバー選択画面（遷移先） |
| app_settings.dart | `lib/settings/app_settings.dart` | ソース | アプリ設定画面（遷移先） |
| home_settings.dart | `lib/settings/home_settings.dart` | ソース | ホーム画面設定（遷移先） |
| barcode_settings.dart | `lib/settings/barcode_settings.dart` | ソース | バーコード設定画面（遷移先） |
| part_settings.dart | `lib/settings/part_settings.dart` | ソース | 部品設定画面（遷移先） |
| stock_settings.dart | `lib/settings/stock_settings.dart` | ソース | 在庫設定画面（遷移先） |
| purchase_order_settings.dart | `lib/settings/purchase_order_settings.dart` | ソース | 購入注文設定画面（遷移先） |
| sales_order_settings.dart | `lib/settings/sales_order_settings.dart` | ソース | 販売注文設定画面（遷移先） |
| about.dart | `lib/settings/about.dart` | ソース | アバウト画面（遷移先） |
| app_colors.dart | `lib/app_colors.dart` | ソース | COLOR_APP_BAR、COLOR_ACTIONの定義 |
| l10.dart | `lib/l10.dart` | ソース | 多言語対応 |
| link_icon.dart | `lib/widget/link_icon.dart` | ソース | リンクアイコンWidget |
