flutter - 如何从另一个类中定义的平面按钮的onPressed调用主类中定义的方法(('_MyHomePageState()')？

Question

我有一个主要类_MyHomePageState()，其中为主页定义了脚手架，并且我定义了非常小部件，它将在新类中加入脚手架。现在，我必须从主类中FlatButton的onPressed调用主类中定义的函数/方法。

主类中的函数将触发BottomSheet，底部工作表的代码将写入新的dart文件中。

当我正常在脚手架内部编写“平铺”按钮代码并调用该函数时，它确实触发了底页。

这是代码片段:

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<ScaffoldState> scaffoldKey = GlobalKey<ScaffoldState>();

  ///This below is the function
  void openBottomSheet() {
    var sheetController = scaffoldKey.currentState
        .showBottomSheet((context) => BottomSheetWidget());
    sheetController.closed.then((value) {
      print("Bottom Sheet Closed");
    });
  }

  @override
  Widget build(BuildContext context) {

    // TODO: implement build
    return Scaffold(
      key: scaffoldKey,
      appBar: AppBar(
        title: Text("Hello,World"),
      ),
      backgroundColor: Colors.grey[800],
      body: Stack(children: <Widget>[
        Container(
          height: MediaQuery.of(context).size.height,
          width: MediaQuery.of(context).size.width,
          color: Colors.blueGrey,
        ),
        Column(
          children: <Widget>[
            TopMenu(),
            ButtonClass(),
          ],
        ),
      ]),
    );
  }
}

这是按钮类:

class ButtonClass extends StatefulWidget {
  _ButtonClassState createState() => _ButtonClassState();

}

class _ButtonClassState extends State<ButtonClass> {

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: <Widget>[
          //Container(color: Colors.blue, child: Text("Hello,World")),
          Container(
            height: 50,
            width:100,
            margin: EdgeInsets.all(10.0),
            child: FlatButton(
              onPressed: (){
                ///And I am trying to call that function here, but is not working
                _MyHomePageState().openBottomSheet();
              },
              child: Container(
                color: Colors.red,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Answer 1

您可以在子Button类中接受一个函数参数，然后从父类_MyHomePageState中将所需的函数传递给它。

class MyHomePage extends StatefulWidget {
      @override
      _MyHomePageState createState() => _MyHomePageState();
    }

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<ScaffoldState> scaffoldKey = GlobalKey<ScaffoldState>();

  ///This below is the function
  void openBottomSheet() {
    var sheetController = scaffoldKey.currentState
        .showBottomSheet((context) => BottomSheetWidget());
    sheetController.closed.then((value) {
      print("Bottom Sheet Closed");
    });
  }

  @override
  Widget build(BuildContext context) {

    // TODO: implement build
    return Scaffold(
      key: scaffoldKey,
      appBar: AppBar(
        title: Text("Hello,World"),
      ),
      backgroundColor: Colors.grey[800],
      body: Stack(children: <Widget>[
        Container(
          height: MediaQuery.of(context).size.height,
          width: MediaQuery.of(context).size.width,
          color: Colors.blueGrey,
        ),
        Column(
          children: <Widget>[
            TopMenu(),
           ButtonClass(onPressed: ()=> openBottomSheet() ),
          ],
        ),
      ]),
    );
  }
}



class ButtonClass extends StatefulWidget {
   Function onPressed;
   ButtonClass({this.onPressed});
  _ButtonClassState createState() => _ButtonClassState();

}

class _ButtonClassState extends State<ButtonClass> {

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: <Widget>[
          //Container(color: Colors.blue, child: Text("Hello,World")),
          Container(
            height: 50,
            width:100,
            margin: EdgeInsets.all(10.0),
            child: FlatButton(
              onPressed: () => widget.onPressed,
              child: Container(
                color: Colors.red,
              ),
            ),
          ),
        ],
      ),
    );
  }
}