# 画面設計書 55-Welcome画面

## 概要

本ドキュメントはWikipedia iOSアプリにおける「Welcome画面」（ウェルカム画面）の設計仕様を定義するものです。

### 本画面の処理概要

**業務上の目的・背景**：
本画面は、Wikipedia iOSアプリを初めて起動したユーザーに対して、アプリの主要機能や価値を紹介するオンボーディング体験を提供します。ウェルカムフローを通じて、ユーザーはWikipediaの基本概念、探索機能、言語設定、プライバシーポリシーについて学ぶことができます。このオンボーディングはユーザーの初期設定を支援し、アプリの継続利用率向上を目的としています。本画面はウェルカムフロー全体のコンテナとして機能し、内部にWelcomePageViewControllerを含む構成となっています。

**画面へのアクセス方法**：
本画面へは以下のルートでアクセスします：
1. アプリの初回起動時に自動的に表示
2. WMFAppViewControllerから初回起動フラグに基づいて表示

**主要な操作・処理内容**：
1. ページスワイプ - 複数のウェルカムページ間をスワイプで移動
2. 次へボタン - 次のウェルカムページへ進む
3. スキップボタン - ウェルカムフローを終了してメイン画面へ
4. 開始ボタン - 最終ページで押下するとウェルカムフロー完了

**画面遷移**：
- 遷移元：WMFAppViewController（初回起動時）、SplashScreen画面
- 遷移先：メインタブ（Explore画面等）

**権限による表示制御**：
本画面は初回起動時のみ表示されます。UserDefaultsに保存されたフラグにより、2回目以降の起動では表示されません。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 63 | 初回起動ウェルカム | 主機能 | 初回起動時のウェルカム・オンボーディング画面 |

## 画面種別

オンボーディング（ウェルカム画面コンテナ）

## URL/ルーティング

本画面はモーダルで表示されるため、URLルーティングは使用しません。
- ViewController: WelcomeViewController

## 入出力項目

| 項目名 | 項目ID | 入出力 | データ型 | 必須 | 最大長 | バリデーション | 備考 |
|--------|--------|--------|----------|------|--------|----------------|------|
| テーマ | theme | 入力（内部） | Theme | 必須 | - | - | 初期化時に渡される |
| ViewControllers | viewControllers | 入力（内部） | [UIViewController & Themeable] | 必須 | - | - | 表示するページ群 |
| 完了コールバック | completion | 入力（内部） | () -> Void | 必須 | - | - | フロー完了時の処理 |

## 表示項目

| 項目名 | 表示内容 | データソース |
|--------|----------|--------------|
| ページコンテンツ | 各ウェルカムページ | WelcomePageViewController経由で表示 |
| 背景 | midBackground色 | theme.colors.midBackground |

## イベント仕様

### 1-画面初期化

**トリガー**: init(theme:viewControllers:completion:)

**処理フロー**:
1. 渡されたtheme、viewControllers、completionを保持
2. WelcomePageViewControllerを子ViewControllerとして追加
3. 制約を設定して全画面表示

### 2-画面表示完了

**トリガー**: viewDidLoad

**処理フロー**:
1. apply(theme:)でテーマを適用
2. 背景色を設定

### 3-画面が消える時

**トリガー**: viewWillDisappear

**処理フロー**:
1. completion()クロージャを実行
2. 呼び出し元でウェルカムフロー完了フラグを設定

### 4-テーマ適用

**トリガー**: apply(theme:)

**処理フロー**:
1. テーマを保持
2. 背景色をtheme.colors.midBackgroundに設定
3. 子ViewControllerにテーマを伝播

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| 画面消滅時 | UserDefaults | UPDATE | 完了コールバックで初回起動フラグを更新（呼び出し元の責務） |

### テーブル別更新項目詳細

本画面自体は直接的なデータ更新を行いません。完了コールバックを通じて呼び出し元がUserDefaultsを更新します。

## メッセージ仕様

本画面自体にはメッセージ表示機能はありません。メッセージは子ViewControllerで表示されます。

## 例外処理

| 例外条件 | 処理内容 |
|---------|---------|
| viewControllers空配列 | WelcomePageViewControllerが空のページ配列で動作（エラーにはならない） |

## 備考

- UIViewControllerを直接継承
- Themeableプロトコルに準拠（extension）
- 子ViewControllerパターンでWelcomePageViewControllerを含む
- addPageViewController(with:)でページViewControllerを追加
- preferredStatusBarStyleをテーマに応じて設定
- viewWillDisappearで完了コールバックを実行するため、画面遷移のどのタイミングでも完了処理が実行される

---

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

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

### 推奨読解順序

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

画面の構成要素と初期化パラメータを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | WelcomeViewController.swift | `Wikipedia/Code/WelcomeViewController.swift` | プロパティ定義（4-6行目）、init（7-12行目） |

**読解のコツ**: WelcomeViewControllerはコンテナとして機能し、実際のページ表示はWelcomePageViewControllerが担当します。

#### Step 2: 初期化と子ViewController追加を理解する

ページViewControllerの追加処理を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | WelcomeViewController.swift | `Wikipedia/Code/WelcomeViewController.swift` | addPageViewController(with:)（28-35行目） |

**主要処理フロー**:
1. **28行目**: WelcomePageViewControllerを生成
2. **30行目**: addChild()で子ViewControllerとして追加
3. **31-32行目**: AutoLayoutで全画面表示
4. **33行目**: didMove(toParent:)で遷移完了通知
5. **34行目**: テーマ適用

#### Step 3: ライフサイクルと完了処理を理解する

画面のライフサイクルと完了コールバックを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | WelcomeViewController.swift | `Wikipedia/Code/WelcomeViewController.swift` | viewDidLoad（18-21行目）、viewWillDisappear（23-26行目） |

**主要処理フロー**:
- **18-21行目**: viewDidLoadでテーマ適用
- **23-26行目**: viewWillDisappearで完了コールバック実行

#### Step 4: テーマ適用を理解する

Themeableプロトコルの実装を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | WelcomeViewController.swift | `Wikipedia/Code/WelcomeViewController.swift` | apply(theme:)（43-56行目） |

**主要処理フロー**:
- **44-47行目**: viewIfLoaded確認とテーマ保持
- **48行目**: 背景色設定
- **50-55行目**: 子ViewControllerへのテーマ伝播

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

```
WMFAppViewController
    │
    └─ WelcomeViewController表示
           │
           ├─ init(theme:viewControllers:completion:) [7行目]
           │      └─ addPageViewController(with:) [28行目]
           │             └─ WelcomePageViewController生成・追加
           │
           ├─ viewDidLoad() [18行目]
           │      └─ apply(theme:) [43行目]
           │             ├─ 背景色設定
           │             └─ 子VCへテーマ伝播
           │
           └─ viewWillDisappear() [23行目]
                  └─ completion() [25行目]
                         └─ 呼び出し元で初回起動フラグ更新
```

### データフロー図

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

theme ──────────────┐
                    │
viewControllers ────┼──▶ WelcomeViewController
                    │         │
completion ─────────┘         ├─▶ WelcomePageViewController
                              │         │
                              │         └─▶ 各ウェルカムページ表示
                              │
                              └─▶ viewWillDisappear
                                        │
                                        └─▶ completion()
                                                │
                                                └─▶ 初回起動フラグ更新
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| WelcomeViewController.swift | `Wikipedia/Code/WelcomeViewController.swift` | ソース | メインViewController（コンテナ） |
| WelcomePageViewController.swift | `Wikipedia/Code/WMFWelcomePageViewController.swift` | ソース | ページングViewController |
| WMFWelcomeContainerViewController.swift | `Wikipedia/Code/WMFWelcomeContainerViewController.swift` | ソース | 各ページのコンテナ |
| WMFAppViewController.m | `Wikipedia/Code/WMFAppViewController.m` | ソース | 呼び出し元 |
| Theme.swift | `Wikipedia/Code/Theme.swift` | ソース | テーマ定義 |
