# 画面設計書 19-クレジット画面

## 概要

本ドキュメントは、InvenTree Flutterアプリケーションの「クレジット画面」について、その機能・動作・実装を詳細に記述した設計書です。

### 本画面の処理概要

クレジット画面は、アプリケーションのクレジット情報（貢献者、使用ライブラリ、ライセンス情報等）をMarkdown形式で表示する画面です。アセットファイルから読み込まれたMarkdownテキストをレンダリングし、リンクをクリック可能な形で表示します。

**業務上の目的・背景**：オープンソースソフトウェアにおいて、貢献者への謝辞や使用ライブラリのライセンス表示は重要な責務です。この画面では、InvenTree Flutterアプリの開発に貢献した人々、使用しているオープンソースライブラリ、それらのライセンス情報を表示することで、オープンソースコミュニティへの敬意を示し、ライセンス要件を満たします。

**画面へのアクセス方法**：アバウト画面から「クレジット」をタップ

**主要な操作・処理内容**：
1. Markdownコンテンツの表示 - アセットから読み込んだクレジット情報をMarkdownとしてレンダリング
2. リンクのクリック - Markdown内のリンクをタップすると外部ブラウザで開く

**画面遷移**：
- 遷移元：アバウト画面（`lib/settings/about.dart`）
- 遷移先：外部Webサイト（Markdown内リンク）

**権限による表示制御**：この画面への権限制御はありません。全てのユーザーがクレジット情報を確認できます。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 65 | アバウト表示 | 主機能 | クレジット情報をMarkdown形式で表示 |

## 画面種別

情報表示

## URL/ルーティング

Flutter Navigator経由でのプッシュ遷移（MaterialPageRoute）

## 入出力項目

| 項目名 | 入出力 | データ型 | 必須 | 説明 |
|--------|--------|---------|------|------|
| credits | 入力 | String | 必須 | クレジット情報のMarkdownテキスト（コンストラクタ経由） |

## 表示項目

| No | 項目名 | 表示形式 | 説明 |
|----|--------|---------|------|
| 1 | AppBar | テキスト | 「クレジット」タイトル表示 |
| 2 | Markdownコンテンツ | Markdown | クレジット情報の本文をMarkdownでレンダリング |

## イベント仕様

### 1-リンクタップ時

1. `onTapLink`コールバックが発火
2. `href`からリンクURLを取得
3. `openLink()`メソッド（クラス内メソッド）を呼び出し、外部ブラウザでURLを開く

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | この画面ではデータベース更新は発生しません |

## メッセージ仕様

| No | メッセージ種別 | メッセージ内容 | 表示条件 |
|----|--------------|--------------|---------|
| - | - | - | この画面では特別なメッセージ表示はありません |

## 例外処理

| No | 例外条件 | 処理内容 |
|----|---------|---------|
| 1 | リンクURLが空 | リンクをクリックしても何も起こらない |
| 2 | URLランチ失敗 | 何も起こらない（canLaunchUrlのチェックあり） |

## 備考

- `CreditsWidget`はStatelessWidgetとして実装
- コンストラクタでMarkdownテキストを直接受け取る（アセット読み込みは呼び出し元で実施）
- `flutter_markdown`パッケージを使用してMarkdownをレンダリング
- `selectable: false`で選択不可に設定されている
- リンククリック時は独自の`openLink()`メソッドを使用（ReleaseNotesWidgetとは異なりhelpers.dartを使用しない）
- `ReleaseNotesWidget`と同じファイル（`release.dart`）で定義されている

---

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

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

### 推奨読解順序

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

この画面はシンプルな構造で、入力としてMarkdownテキスト（String）を受け取ります。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | release.dart | `lib/settings/release.dart` | `CreditsWidget`クラスのコンストラクタでのMarkdownテキスト受け取り |

**読解のコツ**:
- 35-37行目で`CreditsWidget`のコンストラクタを確認
- `credits`はfinalのString型フィールド

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

処理の起点となるウィジェットクラスを特定します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | release.dart | `lib/settings/release.dart` | `CreditsWidget`クラスの構造（StatelessWidget） |

**主要処理フロー**:
1. **35-37行目**: `CreditsWidget` StatelessWidgetの定義とコンストラクタ
2. **40-47行目**: `openLink()`メソッドの定義
3. **49-67行目**: `build()`メソッドでUI構築

#### Step 3: UI構築処理を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | release.dart | `lib/settings/release.dart` | `build()`メソッドでのMarkdownウィジェット構築 |

**主要処理フロー**:
- **49-67行目**: `build()`メソッド
- **50-55行目**: `Scaffold`と`AppBar`の構築
- **56-66行目**: `Markdown`ウィジェットの構築
  - `selectable: false` - 選択不可
  - `data: credits` - Markdownテキスト
  - `onTapLink` - リンククリック時のコールバック

#### Step 4: リンク処理を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | release.dart | `lib/settings/release.dart` | `openLink()`メソッドの実装 |

**主要処理フロー**:
- **40-47行目**: `openLink()`メソッド
  - `Uri.parse(url)`でURLをパース
  - `canLaunchUrl()`でランチ可能かチェック
  - `launchUrl()`で外部ブラウザを開く

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

```
CreditsWidget
    │
    ├─ コンストラクタ
    │      └─ credits (String) を受け取り
    │
    ├─ openLink(String url)
    │      └─ Uri.parse() → canLaunchUrl() → launchUrl()
    │
    └─ build()
           ├─ Scaffold
           │      └─ AppBar (タイトル: "クレジット")
           │
           └─ Markdown
                  ├─ data: credits
                  ├─ selectable: false
                  └─ onTapLink
                         └─ openLink()
```

### データフロー図

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

about.dart
    │
    └─ rootBundle.loadString()
           │
           ▼
    "assets/credits.md"
           │
           ▼
    Navigator.push()
           │
           ▼
    CreditsWidget(credits)  ───▶  Markdown Widget  ───▶  画面表示
```

```
[リンククリック時]

ユーザータップ  ───▶  onTapLink(href)  ───▶  openLink()  ───▶  外部ブラウザ
                            │                    │
                            │                    ├─ Uri.parse()
                            │                    ├─ canLaunchUrl()
                            │                    └─ launchUrl()
                            │
                            └─ href が空 ───▶ 何もしない
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| release.dart | `lib/settings/release.dart` | ソース | 画面本体のウィジェット実装（ReleaseNotesWidgetと同ファイル） |
| about.dart | `lib/settings/about.dart` | ソース | 遷移元（クレジット情報を読み込み遷移） |
| l10.dart | `lib/l10.dart` | ソース | 多言語対応テキスト定義 |
| app_colors.dart | `lib/app_colors.dart` | ソース | アプリカラー定数 |
| credits.md | `assets/credits.md` | アセット | クレジットMarkdownファイル |
