变量状态更改时，何时可以调用窗口小部件？

Question

 import 'package:flutter/material.dart';
import 'dart:math';

class Matrix extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: null, //AppBar(title: Center(child: Text(""))),
      body: Matrix1(),
      backgroundColor: Colors.white,
    );
  }
}

class Matrix1 extends StatefulWidget {
  @override
  _Database1State createState() => _Database1State();
}

class _Database1State extends State<Matrix1> {
  List color = [Colors.yellow, Colors.red, Colors.blue];
  List<Widget> buttons = [];
  List<TableRow> tablerow = [];
  var match = 0;
  int groupvalue = 1;
  double _height = 120;
  String actor = "";
  int rw = 2;
  int cl = 2;
  int e = 1;
  Color _color;

  Random num = Random();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Container(
          height: 40,
        ),
        Padding(
          padding: const EdgeInsets.all(30.0),
          child: Container(
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  color: Colors.deepOrangeAccent),
              height: 50,
              width: 250,
              padding: EdgeInsets.all(8),
              alignment: Alignment.center,
              child: Text("MATRIX GAME",
                  style: TextStyle(
                      fontFamily: "Times New Roman",
                      fontSize: 24,
                      color: Colors.white))),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Radio(
                activeColor: Colors.green,
                groupValue: groupvalue,
                value: 1,
                onChanged: (e) => difficulty(e)),
            Text("Kids"),
            Radio(
              activeColor: Colors.yellow,
              groupValue: groupvalue,
              value: 2,
              onChanged: (e) => difficulty(e),
            ),
            Text("Adults"),
            Radio(
              activeColor: Colors.red,
              groupValue: groupvalue,
              value: 3,
              onChanged: (e) => difficulty(e),
            ),
            Text("Legends    ")
          ],
        ),
        Container(
          height: 35,
        ),
        Padding(
          padding: const EdgeInsets.only(left: 30, right: 30),
          child: Table(children: table()),
        ),
      ],
    );
  }

  List<TableRow> table() {
    tablerow = [];

    for (int rows = 1; rows <= rw; rows++) {
      for (int columns = 1; columns <= cl; columns++) {
        _color = randomColor();
        buttons.add(MaterialButton(
          color: _color,
          height: _height,
          onPressed: () {
            setState(() {});
          },
        ));
      }
      tablerow.add(TableRow(children: buttons));
      buttons = [];
    }

    colorState();

    return tablerow;
  }

  check() {

      return showDialog(
          context: context,
          builder: (BuildContext context) {
            return SimpleDialog(
              title: Text("hello"),
            );
          });

  }

  Color randomColor() {
    return color[num.nextInt(2)];
  }

  colorState() {
    List<Color> colors = [];
    tablerow.forEach((rows) {
      //print(rows);
      var rowbtns = rows.children;
      print(rowbtns);
      rowbtns.forEach((button) {
        MaterialButton mb = button;

        colors.add(mb.color);
      });
    });
    print(colors);
    if (colors[0] == colors[1]) {
      print(colors.length);
    }
    int i;
    int result = 1;
    for (i = 0; i < colors.length; i++) {
      int val = colors[i].value;
      if (result == 0) {
        break;
      }
      print(val);
      for (int j = 0; j < colors.length; j++) {
        if (val == colors[j].value) {
          print(val == colors[j].value);
        } else {
          result = 0;
          break;
        }
      }
    }
    setState(() {
      if (i >= colors.length) {
        print("color matches");

        check();
      } else {
        print("no match");
        match = 0;
      }
    });
  }

  difficulty(e) {
    setState(() {
      if (e == 1) {
        groupvalue = 1;
        _height = 120;
        rw = 2;
        cl = 2;
      } else if (e == 2) {
        groupvalue = 2;
        _height = (120 / 1.5);
        rw = 3;
        cl = 3;
      } else if (e == 3) {
        groupvalue = 3;
        _height = (120 / 2);
        rw = 4;
        cl = 4;
      }
    });
  }
}

条件成立时如何显示对话框？。     使用上面的代码，当我在条件变为真时尝试显示对话框时，我只得到错误消息。我想在上述代码中的if条件变为true时显示对话框。错误是在 colorState（）函数的if条件变为true时引起的。有没有正确的编码方式，还是因为我没有正确使用函数调用？

Answer 1

您在构建中包含此代码

child: Table(children: table()),

在table中，您致电

colorState();

在您致电的colorState中

setState(() {

这是一个大错误。

请勿在构建中更改状态，除非传递给onTap: () => ...或类似的回调。

build()不应有副作用，而应仅构建它返回的小部件（及其子级）