Flutterでよく使われるデザインパターン[Builder]

Flutter

Builderパターンは、オブジェクトの生成と表現を分離するデザインパターンの一つです。これにより、異なる方法でオブジェクトを作成することができ、同じコードで異なるオブジェクトを作成できるようになります。Builderパターンは、FlutterのWidgetの構築によく使われています。

例えば、以下のようなウィジェットを考えてみましょう。

class MyButton extends StatelessWidget {
  final String text;
  final Color color;
  final double width;
  final double height;

  const MyButton({Key? key, required this.text, this.color = Colors.blue, this.width = 100, this.height = 50}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: width,
      height: height,
      child: ElevatedButton(
        onPressed: () {},
        style: ElevatedButton.styleFrom(primary: color),
        child: Text(text),
      ),
    );
  }
}

このウィジェットは、文字列と背景色、幅、高さを受け取って、ボタンを表示します。しかし、このウィジェットのパラメータが多くなる場合や、異なるビューを持つ同じパラメータの異なるオブジェクトを作成する必要がある場合、コードは複雑になる可能性があります。

ここで、Builderパターンを使用すると、異なる方法でMyButtonオブジェクトを構築できます。例えば、以下のようにビルダークラスを定義することができます。

class MyButtonBuilder {
  String text = '';
  Color color = Colors.blue;
  double width = 100;
  double height = 50;

  MyButtonBuilder setText(String text) {
    this.text = text;
    return this;
  }

  MyButtonBuilder setColor(Color color) {
    this.color = color;
    return this;
  }

  MyButtonBuilder setWidth(double width) {
    this.width = width;
    return this;
  }

  MyButtonBuilder setHeight(double height) {
    this.height = height;
    return this;
  }

  MyButton build() {
    return MyButton(text: text, color: color, width: width, height: height);
  }
}

このビルダークラスは、MyButtonオブジェクトを作成するためのパラメータを設定するためのメソッドを提供します。これにより、異なるパラメータで同じオブジェクトを作成できるようになります。

例えば、以下のようにして、2つの異なるMyButtonオブジェクトを作成することができます。

final myButton1 = MyButtonBuilder()
    .setText('Button 1')
    .setColor(Colors.green)
    .setWidth(150)
    .setHeight(70)
    .build

コメント

タイトルとURLをコピーしました