Question

例如，我有两个StatefulWidget来监视相同的回调方法。我该怎么做？如果我有三个以上的StatefulWidget来监控它的事件？

class WidgetOne extends StatefulWidget {
  @override
  _WidgetOneState createState() => new _WidgetOneState();
}

class _WidgetOneState extends State<WidgetOne> {

  // this is the callback, the widget two want listen the callback too
  bool _onNotification(ScrollNotification notification){

  }

  @override
  Widget build(BuildContext context) {
    return new Column(
      children: <Widget>[
        new NotificationListener(child: new ListView(shrinkWrap: true,),
          onNotification: _onNotification),
        new WidgetTwo()
      ],
    );
  }
}

class WidgetTwo extends StatefulWidget {
  @override
  _WidgetTwoState createState() => new _WidgetTwoState();
}

class _WidgetTwoState extends State<WidgetTwo> {

  // in this,How Can I get the callback in WidgetOne?
  @override
  Widget build(BuildContext context) {
    return new Container();
  }
}

Answer 1

你不能也不应该。小部件永远不应该依赖于其他小部件的架构。

您有两种可能性：

合并WidgetTwo和WidgetOne。分离它们没有意义（至少与你提供的一样）。
修改WidgetTwo以带孩子。并将ListView添加为WidgetTwo的子项。这样它就可以将列表包装到自己的NotificationListener中。

Answer 2

使用setState()可以实现解决方案，并在WidgetTwo的构造函数中传递状态函数。我在下面做了一个例子，这个例子的主要思想是我有 MyHomePage 作为我的主要Widget和 MyFloatButton （我想自定义为另一个StatefulWidget），所以当按下FAB时我需要调用MyHomePage中的增量计数器功能。让我们来看看我是如何做到的。

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  //Consider this function as your's _onNotification and important to note I am using setState() within :)
  void _incrementCounter() { 
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(
          widget.title,
          style: TextStyle(color: Colors.white),
        ),
      ),
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Text(
              'You have pushed the button $_counter times:',
              style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
            ),
          ],
        ),
      ),
      floatingActionButton: new MyFloatButton(_incrementCounter),//here I am calling MyFloatButton Constructor passing _incrementCounter as a function
    );
  }
}

class MyFloatButton extends StatefulWidget {

  final Function onPressedFunction;

  // Here I am receiving the function in constructor as params
  MyFloatButton(this.onPressedFunction);

  @override
  _MyFloatButtonState createState() => new _MyFloatButtonState();
}

class _MyFloatButtonState extends State<MyFloatButton> {
  @override
  Widget build(BuildContext context) {
    return new Container(
      padding: EdgeInsets.all(5.0),
      decoration: new BoxDecoration(color: Colors.orangeAccent, borderRadius: new BorderRadius.circular(50.0)),
      child: new IconButton(
        icon: new Icon(Icons.add),
        color: Colors.white,
        onPressed: widget.onPressedFunction,// here i set the onPressed property with widget.onPressedFunction. Remember that you should use "widget." in order to access onPressedFunction here!
      ),
    );
  }
}

现在将MyHomePage视为您的WidgetOne，将MyFloatButton视为您的WidgetTwo和_incrementCounter函数作为您的_onNotification。希望你能达到你想要的效果:)

（我的例子一般都是如此，所以任何人都可以根据他们面临的情况来理解）

Answer 3

您可以对有状态的小部件使用内置的 widget 属性。

https://api.flutter.dev/flutter/widgets/State/widget.html

所以在 WidgetOne 会是

new WidgetTwo(callback: callback)

在WidgetTwo

class WidgetTwo extends StatefulWidget {
  final Function callback;
  
  WidgetTwo({this.callback});


  @override
  _WidgetTwoState createState() => new _WidgetTwoState();
}

并且在 _WidgetTwoState 中您可以访问它

widget.callback

如何将回调传递给另一个StatefulWidget？

3 个答案: