从另一个小部件调用小部件的方法

Question

我刚刚开始颤抖，这是一个基本问题，但我无法解决。 我创建了一个有状态小部件，我需要在单击按钮时调用setState（）方法。 该按钮不是此有状态小部件的一部分。 该按钮位于应用程序的页脚中。

完整的应用代码：

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  build(BuildContext context) {
    return new MaterialApp(
        title: "My app title",
        home: new Scaffold(
          appBar: new AppBar(
            title: new Text("My App"),
            backgroundColor: Colors.amber,
          ),
          body: new Container(
            child: new Center(
              child: new MyStateFullWidget(),
            ),
          ),
          persistentFooterButtons: <Widget>[
            new FlatButton(
              onPressed: () {
                // I need to call the update() of MyStateFullWidget/MyStateFullWidgetState class
              },
              child: new Text("Click Here"),
              color: Colors.amber,
              textColor: Colors.white,
            ),
          ],
        ));
  }
}

class MyStateFullWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new MyStateFullWidgetState();
  }
}

class MyStateFullWidgetState extends State<MyStateFullWidget> {
  int count = 0;

  @override
  Widget build(BuildContext context) {
    return new Text("Count: $count");
  }

  update() {
    setState() {
      count++;
    }
  }
}

Answer 1

我需要在单击按钮时调用setState（）方法

您可能有一些选项（或替代方案）来实现最终结果（所有这些都有不同的权衡）：

• 将状态（即count ）提升为Button和Display Widget上方的Inherited Widget。 这可能是最简单或最合适的。
• 利用某种基于动作的通信，例如Flutter Redux （您dispatch动作，通过StoreConnector影响显示小部件并重建）。 这可以被视为“提升”状态的另一种方式。 但是，这需要一个全新的依赖项和大量的开销给出你的简单示例，但我想指出它。
• 您可以创建Display小部件订阅/侦听的某种Stream和StreamController 。 但是，这可能有点过分，我不确定在流上表示按钮点击的适当程度。

可能还有其他解决方案，我没有想到; 但请记住，反应式UI的目标是保持状态简单 。

因此，如果你有多个关注状态的叶子小部件（想知道它，想要改变它），这可能意味着它属于更高级别的组件（例如，应用程序级别的状态，或者可能是某些其他常见的祖先 - 但两者都可以使用Inherited Widget来阻止所有状态的传递

Answer 2

您应该在State中使用Scaffold ，而不是在StatelessWidget中使用。 这是工作解决方案。

class MyApp extends StatelessWidget {
  @override
  build(BuildContext context) {
    return MaterialApp(
        title: "My app title",
        home: MyStateFullWidget());
  }
}

class MyStateFullWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return MyStateFullWidgetState();
  }
}

class MyStateFullWidgetState extends State<MyStateFullWidget> {
  int count = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("My App"),
        backgroundColor: Colors.amber,
      ),
      body: Container(
        child: Center(
          child:Text("Count: $count"),
        ),
      ),
      persistentFooterButtons: <Widget>[
        FlatButton(
          onPressed: update,
          child: Text("Click Here"),
          color: Colors.amber,
          textColor: Colors.white,
        ),
      ],
    );
  }

  void update() {
    setState(() {
      count++;
    });
  }
}