# 画面設計書 76-ThemeableViewController画面

## 概要

本ドキュメントは、Wikipedia iOSアプリのテーマ対応ViewControllerの基底クラス（ThemeableViewController）の設計を記述したものである。

### 本画面の処理概要

ThemeableViewControllerは、アプリ全体のテーマ（カラースキーム）対応を実現するための基底ViewControllerクラスである。これ自体は単独で表示される画面ではなく、テーマ対応が必要なすべてのViewControllerの親クラスとして機能する。テーマの保持と適用のための共通インターフェースを提供し、継承先のViewControllerでテーマに応じたUI更新を統一的に行えるようにする。

**業務上の目的・背景**：Wikipediaアプリは複数のカラーテーマ（ライト、セピア、ダーク、ブラック）をサポートしており、すべての画面でこれらのテーマに対応する必要がある。ThemeableViewControllerは、この要件を効率的に満たすための共通基盤を提供する。継承による実装により、コードの重複を防ぎ、テーマ対応の一貫性を保証する。これはアプリのアーキテクチャ上重要な役割を果たしている。

**画面へのアクセス方法**：本クラスは基底クラスであり、直接表示されることはない。アプリ内の多くのViewControllerがこのクラスを継承して実装されている。

**主要な操作・処理内容**：
1. themeプロパティでTheme.standardをデフォルト値として保持
2. apply(theme:)メソッドで受け取ったテーマを保存
3. viewDidLoad()でapply(theme:)を呼び出し、テーマを適用
4. サブクラスはapply(theme:)をオーバーライドしてUI要素の色を更新

**画面遷移**：
- 本クラスは基底クラスであり、画面遷移は発生しない
- 継承先のViewControllerでそれぞれの画面遷移が実装される

**権限による表示制御**：本クラスでは権限制御は行わない。継承先で必要に応じて実装される。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 62 | テーマ適用 | 主機能 | テーマ対応ViewControllerの基底機能 |

## 画面種別

基底クラス（画面なし）

## URL/ルーティング

本クラスは基底クラスであり、ルーティングは適用されない。

## 入出力項目

| 項目名 | 型 | 入力/出力 | 説明 |
|--------|-----|----------|------|
| theme | Theme | 入力/保持 | 適用するテーマ（デフォルト: Theme.standard） |

## 表示項目

本クラスは基底クラスであり、直接的な表示項目はない。継承先で定義される。

## イベント仕様

### 1-viewDidLoad

viewDidLoadが呼ばれると、apply(theme: theme)を呼び出して現在保持しているテーマを適用する。

### 2-apply(theme:)

テーマを受け取り、self.themeプロパティに保存する。サブクラスはこのメソッドをオーバーライドして、具体的なUI要素の色更新を実装する。

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | 本クラスではデータベース更新は発生しない |

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

本クラスはデータベース操作を行わない。

## メッセージ仕様

本クラスではメッセージ表示は行わない。

## 例外処理

本クラスでは例外処理は実装されていない。継承先で必要に応じて実装される。

## 備考

- UIViewControllerを継承し、Themeableプロトコルを実装
- 非常にシンプルな実装（約15行）
- アプリ内の多くのViewControllerの基底クラスとして使用される
- ColumnarCollectionViewControllerなど、より高機能な基底クラスがこれを継承している
- Theme.standardがデフォルトテーマとして設定されている

---

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

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

### 推奨読解順序

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

まず、テーマ関連のデータ構造を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | Theme.swift | `Wikipedia/Code/` | テーマ定義とカラー設定 |
| 1-2 | Themeable.swift | `Wikipedia/Code/` | Themeableプロトコルの定義 |

**読解のコツ**: Themeableプロトコルはapply(theme:)メソッドを要求する。ThemeableViewControllerはこのプロトコルを実装する最もシンプルな形態。

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

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

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | ThemeableViewController.swift | `Wikipedia/Code/ThemeableViewController.swift` | 本クラスの全体（わずか15行） |

**主要処理フロー**:
1. **行4**: themeプロパティをTheme.standardで初期化
2. **行6-8**: apply(theme:)でテーマを保存
3. **行10-13**: viewDidLoad()でapply(theme:)を呼び出し

#### Step 3: 継承関係を理解する

主要な継承先クラスを把握する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | ColumnarCollectionViewController.swift | `Wikipedia/Code/ColumnarCollectionViewController.swift` | ThemeableViewControllerを継承 |
| 3-2 | ArticleCollectionViewController.swift | `Wikipedia/Code/ArticleCollectionViewController.swift` | 間接的に継承 |

**主要処理フロー**:
- **ColumnarCollectionViewController 行273-283**: apply(theme:)をオーバーライドして、より多くのUI要素を更新

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

```
ThemeableViewController
    │
    ├─ var theme: Theme = Theme.standard [行4]
    │
    ├─ func apply(theme: Theme) [行6-8]
    │      └─ self.theme = theme
    │
    └─ override func viewDidLoad() [行10-13]
           ├─ super.viewDidLoad()
           └─ apply(theme: theme)

継承階層:
UIViewController
    └─ ThemeableViewController
           ├─ ColumnarCollectionViewController
           │      ├─ ArticleCollectionViewController
           │      │      ├─ ArticleFetchedResultsViewController
           │      │      │      └─ DisambiguationPagesViewController
           │      │      └─ ...
           │      ├─ NewsViewController
           │      ├─ OnThisDayViewController
           │      └─ ...
           └─ その他多数のViewController
```

### データフロー図

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

Theme ───────────────▶ apply(theme:)
                              │
                              ▼
                       self.theme = theme
                              │
                              ▼
                      (プロパティ保存)
                              │
                       ┌──────┴──────┐
                       │  サブクラス   │
                       │  オーバーライド │
                       └──────────────┘
                              │
                              ▼
                       UI要素の色更新
                       (view.backgroundColor等)
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| ThemeableViewController.swift | `Wikipedia/Code/ThemeableViewController.swift` | ソース | 本クラス（基底クラス） |
| Theme.swift | `Wikipedia/Code/Theme.swift` | ソース | テーマ定義 |
| Themeable.swift | `Wikipedia/Code/Themeable.swift` | プロトコル | Themeableプロトコル定義 |
| ColumnarCollectionViewController.swift | `Wikipedia/Code/ColumnarCollectionViewController.swift` | ソース | 主要な継承先 |
| ArticleCollectionViewController.swift | `Wikipedia/Code/ArticleCollectionViewController.swift` | ソース | 間接的な継承先 |
| NewsViewController.swift | `Wikipedia/Code/NewsViewController.swift` | ソース | 間接的な継承先 |
| OnThisDayViewController.swift | `Wikipedia/Code/OnThisDayViewController.swift` | ソース | 間接的な継承先 |
