Flutter：如何设置父窗口小部件的 state

Question

我想使用子小部件中的按钮更改父容器的颜色。 假设我有一个 parentClass 小部件和一个 childClass 小部件。 动态颜色的容器在parentClass中，按钮在childClass中。 起初容器是蓝色的，我想在按钮点击时将其变为红色。

Color dynamicColor;

class ParentClass extends StatefulWidget {
  ParentClass({Key key}) : super(key: key);

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

class _ParentClassState extends State<ParentClass> {
  @override
  void initState() {
    super.initState();
    setState(() {
      dynamicColor = Colors.blue;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        ChildClass(),
        Container(
          color: dynamicColor,
          child: ...
        )
      ],
    );
  }
}

class ChildClass extends StatefulWidget {
  ChildClass({Key key}) : super(key: key);

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

class _ChildClassState extends State<ChildClass> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: TextButton(
        onPressed: () {
          setState(() {
            dynamicColor = Colors.red; // What I want to do
          });
        },
        child: Text('Change parent container color'),
      ),
    );
  }
}

Answer 1

您可以在父小部件上创建 function 并使用参数传递给子小部件。 喜欢：

void delete() async {
  setState(() {
    dynamicColor = Colors.blue;
  });
 }

在您的小部件树上

 CustomChild(function: () => delete()),

您的自定义小部件

class CustomChild extends StatelessWidget {
  Function function;
  CustomChild({this.function})
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}