【Flutter】mobx_codegenでコードを生成する

mobx_codegenとは
使い方

mobx_codegenとは

mobx_codegenは、DartとFlutterのためのコード生成ライブラリです。
このライブラリを使用すると、@observable、@computed、@actionといったアノテーションをコードに追加でき、MobXをより簡単に利用できます。これらのアノテーションは、ストアクラス内でのみ動作します。ストアクラスは抽象クラスであり、Storeミックスインを使用します。
build_runnerを実行すると、自動的に.g.dartファイルが生成され、このファイルをコード内でインポートする必要があります。

mobx_codegen | Dart package

Code generator for MobX that adds support for annotating your code with @observable, @computed, @action and also creatin...

使い方

パッケージのインストール

dependencies:
  mobx: ^2.0.0

dev_dependencies:
  build_runner: ^2.0.0
  mobx_codegen: ^2.6.1

コードの作成

以下は、mobx_codegenを使用して簡単なTodoアプリのストアを作成する例です。

import 'package:mobx/mobx.dart';

// 生成されたファイルをインクルード
part 'todos.g.dart';

// ストアクラスとして使用されるクラス
class Todo = TodoBase with _$Todo;

// ストアクラス
abstract class TodoBase with Store {
  TodoBase(this.description);

  @observable
  String description = '';

  @observable
  bool done = false;

  @action
  void toggleDone() {
    done = !done;
  }
}

コード生成

ターミナルで以下のコマンドを実行して、コード生成を行います。

flutter packages pub run build_runner build

このコマンドにより、todos.g.dartファイルが自動的に生成されます。

パラメータの詳細

@observable

@observableアノテーションを使用すると、クラスのフィールドをリアクティブにすることができます。このフィールドの値が変更されると、自動的に関連するUIが更新されます。

@computed

@computedアノテーションを使用すると、他の@observableフィールドの値に基づいて計算されるプロパティを作成できます。@computedプロパティはキャッシュされ、依存するフィールドが変更された場合にのみ再計算されます。

@action

@actionアノテーションを使用すると、ストアの状態を変更するメソッドを定義できます。これにより、状態の変更がトランザクションとして処理され、MobXのリアクティブシステムに適切に通知されます。

Store

ストアクラスは、Storeミックスインを使用して定義されます。ストアクラスは、@observable、@computed、@actionアノテーションを含むフィールドやメソッドを持つ抽象クラスです。