この章では、3DモデルのURL、表示名、クレジット表記を画面のコードから分離します。

設定値を専用ファイルへまとめると、別のモデルへ変更するときに画面全体を探す必要がありません。また、画面のレイアウトとデータの管理を分けることで、それぞれの役割が明確になります。

7.1 設定値を分離する理由

前章では、モデル名のAstronautを画面へ直接記述しました。このような値を複数箇所へ書くと、モデルを変更した際に修正漏れが発生する可能性があります。

たとえば、モデル名だけを変更してURLを変更し忘れると、画面上の名前と実際に表示されるモデルが一致しません。

そこで、次の情報を一つのクラスへまとめます。

7.2 設定ファイルを作成する

libの中にconfigフォルダを作り、model_source.dartを追加します。

lib/
├── config/
│   └── model_source.dart
├── screens/
│   └── model_viewer_screen.dart
└── main.dart

configフォルダには、アプリの動作に必要な設定値を配置します。画面を作るscreensとは役割を分けて管理します。

7.3 ModelSourceクラスを作成する

model_source.dartへ、次の内容を記述します。

// lib/config/model_source.dart

/// 3Dモデルの取得元を管理します。
abstract final class ModelSource {
  /// Google model-viewerのデモ用GLBモデルURLです。
  static const String modelUrl =
      '<https://modelviewer.dev/shared-assets/models/Astronaut.glb>';

  /// 画面上に表示するモデル名です。
  static const String displayName = 'Astronaut';

  /// 配布元が指定するクレジット表記です。
  static const String attribution = 'Astronaut by Poly · CC BY';
}

このクラスは、3Dモデルに関する情報だけを管理します。画面の配置や読み込み処理は含めません。

7.4 abstract final classを理解する

abstractを指定したクラスは、直接インスタンス化できません。そのため、次のようにオブジェクトを生成する使い方を防げます。

// ModelSourceは設定値だけを管理するため、生成して使用しません。
final ModelSource source = ModelSource();