[Flutter]Scaffoldのbodyでif文を使うには?

Flutter

どうも、ちょげ(@chogetarou)です。

Scaffoldのboydでif文を使う方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

Scaffoldのbodyでif文を使うには、関数やメソッドを使います。

具体的には、bodyで表示するWidgetを戻り値とする関数やメソッドを定義します。

そして、関数やメソッド内で、if文を使います。

  Widget _buildBody(int count) {

    Widget body;

    if (条件) {
     ・・・・
    } else {
      ・・・
    }

    return body;
  }

あとは、定義した関数もしくはメソッドをScaffoldの引数「body」に指定します。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _buildBody(),
    );
  }

使用例

以下は、使用例です。

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  var _counter = 0;
  Widget _buildBody() {
    Widget child;
    if (_counter % 2 == 0) {
      child = Container(
        color: Colors.yellow,
      );
    } else if (_counter == 1) {
      child = Container(
        color: Colors.orange,
      );
    } else {
      child = Container(
        color: Colors.green,
      );
    }

    return Stack(
      children: [
        child,
        Center(
          child: ElevatedButton(
            child: Text('Increment'),
            onPressed: () {
              setState(() {
                _counter++;
              });
            },
          ),
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _buildBody(),
    );
  }
}

コメント

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