# 機能設計書 17-ShowStyleEditor

## 概要

本ドキュメントは、Dear ImGuiライブラリにおけるShowStyleEditor関数の機能設計を記載する。この関数はImGuiのスタイル（色、サイズ）を対話的に編集するためのスタイルエディタブロックを提供する。

### 本機能の処理概要

ShowStyleEditor関数は、ImGuiのスタイル設定を対話的に編集するためのUIブロックを追加する。この関数自体はウィンドウを作成しないため、呼び出し側でBegin/Endで囲む必要がある。スタイルエディタでは、フォントサイズ、パディング、丸み、ボーダー、色など、ImGuiの外観を構成するすべての要素を調整できる。変更はリアルタイムで反映され、開発者は視覚的にスタイルを確認しながらカスタマイズできる。

**業務上の目的・背景**：アプリケーションのルック&フィールをカスタマイズすることは、ユーザー体験の向上やブランディングにおいて重要である。ShowStyleEditorは、ImGuiの豊富なスタイルオプションを対話的に調整するためのツールを提供し、開発者がコードを変更せずにスタイルの調整と検証を行えるようにする。完成したスタイルはコードとしてエクスポートすることも可能。

**機能の利用シーン**：
- アプリケーションのカラーテーマを調整する際
- ウィンドウのパディングや丸みを調整する際
- フォントサイズやスケールを調整する際
- カスタムスタイルを作成してコードにエクスポートする際
- ダーク/ライト/クラシックスタイルを切り替える際

**主要な処理内容**：
1. Generalセクション（スタイルセレクタ、フォントセレクタ、フォントサイズ、丸み、ボーダー）
2. Save/Revertボタン（参照スタイルの保存・復元）
3. Sizesタブ（各種サイズパラメータの調整）
4. Colorsタブ（53種類のカラーの編集とエクスポート）
5. Fontsタブ（フォント情報の表示と設定）
6. Renderingタブ（描画設定）

**関連システム・外部連携**：
- ShowStyleSelector（スタイルセレクタ）
- ShowFontSelector（フォントセレクタ）
- StyleColorsDark / StyleColorsLight / StyleColorsClassic（プリセットスタイル）
- LogToClipboard / LogToTTY（スタイルのエクスポート）

**権限による制御**：本機能に権限制御はない。ただし、IMGUI_DISABLE_DEMO_WINDOWSが定義されている場合は空の関数となる。

## 関連画面

| 画面No | 画面名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 6 | Style Editor | 主画面 | スタイルエディタの表示 |
| 1 | Demo Window | 呼び出し元 | Toolsメニューから遷移可能 |

## 機能種別

設定・カスタマイズ / スタイル編集

## 入力仕様

### 入力パラメータ

| パラメータ名 | 型 | 必須 | 説明 | バリデーション |
|-------------|-----|-----|------|---------------|
| ref | ImGuiStyle* | No | 比較・復元用の参照スタイル。NULLの場合は内部の保存スタイルを使用 | NULL許容 |

### 入力データソース

- ImGuiStyle（現在のスタイル設定）
- ImGuiIO（フォント情報等）

## 出力仕様

### 出力データ

| 項目名 | 型 | 説明 |
|--------|-----|------|
| 戻り値 | void | 戻り値なし |

### 出力先

- ImGuiウィジェットとして描画（ウィンドウ内に埋め込み）
- クリップボード / TTY（カラーエクスポート時）

## 処理フロー

### 処理シーケンス

```
1. 参照スタイルの初期化
   └─ refがNULLの場合、内部static変数を使用
2. Generalセクションの表示
   └─ ShowStyleSelector、ShowFontSelector、フォントサイズ、丸み、ボーダー
3. Save/Revertボタンの表示
4. タブバーの開始
   └─ BeginTabBar("##tabs")
5. Sizesタブ
   └─ 各種SliderFloat、DragFloat
6. Colorsタブ
   └─ ColorEdit4、エクスポートボタン
7. Fontsタブ
   └─ ShowFontAtlas
8. Renderingタブ
   └─ 描画関連設定
9. タブバーの終了
   └─ EndTabBar
```

### フローチャート

```mermaid
flowchart TD
    A[ShowStyleEditor呼び出し] --> B{ref == NULL?}
    B -->|Yes| C[内部static変数を参照として使用]
    B -->|No| D[引数refを参照として使用]
    C --> E[Generalセクション表示]
    D --> E
    E --> F[Save/Revertボタン]
    F --> G[BeginTabBar]
    G --> H[Sizesタブ]
    H --> I[Colorsタブ]
    I --> J[Fontsタブ]
    J --> K[Renderingタブ]
    K --> L[EndTabBar]
    L --> M[終了]
```

## ビジネスルール

### 業務ルール

| ルールNo | ルール名 | 内容 | 適用条件 |
|---------|---------|------|---------|
| BR-01 | ブロック形式 | この関数はウィンドウを作成しない。呼び出し側でBegin/Endが必要 | 常時 |
| BR-02 | 参照スタイル | refパラメータで比較・復元用のスタイルを指定可能 | 常時 |
| BR-03 | GrabRounding連動 | FrameRoundingを変更するとGrabRoundingも同じ値に設定 | FrameRoundingスライダー変更時 |
| BR-04 | エクスポート形式 | カラーはC++コード形式（ImVec4）でエクスポート | Export時 |

### 計算ロジック

- max_border_size: `IM_MAX(default_border_size, 2.0f)`
- default_border_size: `(float)(int)style._MainScale`

## データベース操作仕様

該当なし（インメモリ動作）

## エラー処理

### エラーケース一覧

| エラーコード | エラー種別 | 発生条件 | 対処方法 |
|------------|----------|---------|---------|
| - | 警告表示 | RendererHasTexturesが未設定 | 警告メッセージを表示 |

### リトライ仕様

該当なし（毎フレーム呼び出し）

## トランザクション仕様

該当なし

## パフォーマンス要件

- タブバーを使用して遅延描画
- 展開されていないタブの内容は処理されない

## セキュリティ考慮事項

該当なし（ローカルUI表示のみ）

## 備考

- IMGUI_DISABLE_DEMO_WINDOWSが定義されている場合、空の関数となる
- 色の数はImGuiCol_COUNT（53種類）
- GetStyleColorName()で各色の名前を取得可能

---

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

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

### 推奨読解順序

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

スタイル設定を保持するImGuiStyle構造体を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | imgui.h | `imgui.h` | ImGuiStyle構造体の定義 |
| 1-2 | imgui.h | `imgui.h` | ImGuiCol_列挙型（色のインデックス） |

**読解のコツ**: ImGuiStyleには、パディング、丸み、ボーダー、色配列（Colors[ImGuiCol_COUNT]）などが含まれる。

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

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | imgui.h | `imgui.h` | ShowStyleEditor関数の宣言（412行目） |
| 2-2 | imgui_demo.cpp | `imgui_demo.cpp` | ShowStyleEditor関数の実装（8350行目〜） |

**主要処理フロー**:
1. **8355-8364行目**: 参照スタイルの初期化
2. **8371行目**: PushItemWidth設定
3. **8374-8404行目**: Generalセクション
4. **8407-8415行目**: Save/Revertボタン
5. **8418-8694行目**: タブバーと各タブの内容

#### Step 3: 各タブの詳細を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | imgui_demo.cpp | `imgui_demo.cpp` | Sizesタブ（8420-8518行目） |
| 3-2 | imgui_demo.cpp | `imgui_demo.cpp` | Colorsタブ（8521-8613行目） |
| 3-3 | imgui_demo.cpp | `imgui_demo.cpp` | Fontsタブ（8615-8657行目） |
| 3-4 | imgui_demo.cpp | `imgui_demo.cpp` | Renderingタブ（8659-8693行目） |

**主要処理フロー**:
- Sizesタブ: SliderFloat/DragFloatで各サイズパラメータを調整
- Colorsタブ: ColorEdit4で各色を編集、Exportボタンでコードを出力
- Fontsタブ: ShowFontAtlasでフォント情報を表示
- Renderingタブ: アンチエイリアス等の描画設定

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

```
ShowStyleEditor()
    │
    ├─ [ref初期化] static ImGuiStyle ref_saved_style
    │
    ├─ PushItemWidth()
    │
    ├─ SeparatorText("General")
    │      ├─ ShowStyleSelector()
    │      ├─ ShowFontSelector()
    │      ├─ DragFloat("FontSizeBase")
    │      ├─ DragFloat("FontScaleMain")
    │      ├─ SliderFloat("FrameRounding")
    │      └─ Checkbox("WindowBorder" / "FrameBorder" / "PopupBorder")
    │
    ├─ Button("Save Ref") / Button("Revert Ref")
    │
    ├─ BeginTabBar("##tabs")
    │      │
    │      ├─ BeginTabItem("Sizes")
    │      │      └─ 各種SliderFloat/DragFloat
    │      │
    │      ├─ BeginTabItem("Colors")
    │      │      ├─ Button("Export")
    │      │      │      └─ LogToClipboard() / LogToTTY()
    │      │      └─ ColorEdit4() - 各色
    │      │
    │      ├─ BeginTabItem("Fonts")
    │      │      └─ ShowFontAtlas()
    │      │
    │      └─ BeginTabItem("Rendering")
    │             └─ Checkbox("Anti-aliased lines" 等)
    │
    └─ EndTabBar()
```

### データフロー図

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

ImGuiStyle &style    ShowStyleEditor()              Style Editor UI
    │                      │                              │
    ├─ Colors[]            ├─ ColorEdit4で編集            │
    ├─ WindowPadding       ├─ SliderFloatで編集           │
    ├─ FrameRounding       ├─ SliderFloatで編集           │
    └─ その他              └─ 各種ウィジェットで編集       │
                                                          │
ref (ImGuiStyle*)                                         │
    │                      ├─ Save/Revertの参照            │
    └─ 比較・復元用                                        │
                                                          │
                           └─ Export時                     │
                                  └─ LogToClipboard() ─────┘
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| imgui.h | `imgui.h` | ヘッダー | ShowStyleEditor宣言（412行目）、ImGuiStyle定義 |
| imgui_demo.cpp | `imgui_demo.cpp` | ソース | ShowStyleEditor実装（8350-8694行目） |
| imgui.cpp | `imgui.cpp` | ソース | StyleColorsDark等のプリセット関数 |
