繁体   English   中英

我想在Flutter应用中添加App Drawer,但在脚手架之外

[英]I want to add an App Drawer in my flutter app but outside of scaffold

问题是我在使用自定义appBar的应用程序抽屉中添加了一个应用程序抽屉,这是一个不同的类,我想从没有脚手架的CustomAppBar类中调用应用程序抽屉(进入白屏)当我添加脚手架时)。

我尝试了多种方法,可以想到使用IconButton的onPressed属性来调用它。

这是我的主班

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Container(
          child: ListView(
            children: <Widget>[
              FirstHalf(),
              SizedBox(
                height: 45.0,
              ),
                   for (var foodItem in fooditemList.foodItems)
                   ItemContainer(foodItem: foodItem)
                 ],
              ),
            ),
      ),
    );
  }
}

这是CustomAppBar的调用位置

class FirstHalf extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.fromLTRB(35, 25, 0, 0),
      child: Column(
        children: <Widget>[
          CustomAppBar(),  //CustomAppBar
          SizedBox(
            height: 30.0,
          ),
          title(),
          SizedBox(
            height: 30.0,
          ),
          searchBar(),
          SizedBox(
            height: 30.0,
          ),
          categories(),
        ],
      ),
    );
  }

此类的代码并未在此处结束,但我认为这足以共享而不是共享整个代码

这是CustomAppBar类,我要在其中调用应用抽屉

class CustomAppBar extends StatelessWidget {
  final CartListBLoc bloc = BlocProvider.getBloc<CartListBLoc>();
  CustomAppBar(); 
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(bottom: 15.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(
            icon: Icon(Icons.menu),
            onPressed: () {},//want to call app drawer here
          ),
          StreamBuilder(
            stream: bloc.listStream,
            builder: (context, snapshot) {
              List<FoodItem> foodItems = snapshot.data;
              int length = foodItems != null ? foodItems.length : 0;
              return buildGestureDetector(length, context, foodItems);
            },
            initialData: <FoodItem>[],
          ),
        ],
      ),
    );
  }
 }

我可以想到一种方法,可以将GlobalKeyScaffoldState GlobalKey使用。 ScaffoldState上有一个openDrawer()方法。

  @override
  Widget build(BuildContext context) {
    final scaffoldKey = GlobalKey<ScaffoldState>(); // Define key
    return Scaffold(
      key: scaffoldKey, // pass scaffoldKey to Scaffold
      drawer: Drawer(), // your drawer implementation
      body: SafeArea(
        ....
              FirstHalf(scaffoldKey: scaffoldKey), // Pass scaffold key down the path.
        ...
       ....
}
class FirstHalf extends StatelessWidget {
  final GlobalKey<ScaffoldState> scaffoldKey;

  FirstHalf(this.scaffoldKey);

  @override
  Widget build(BuildContext context) {
    ....
    ....
    CustomAppBar(scaffoldKey), //CustomAppBar
    ....
  }
class CustomAppBar extends StatelessWidget {
  final GlobalKey<ScaffoldState> scaffoldKey;

  final CartListBLoc bloc = BlocProvider.getBloc<CartListBLoc>();
  CustomAppBar(this.scaffoldKey);

  @override
  Widget build(BuildContext context) {
    ....
    ....
    onPressed: () {
      this.scaffoldKey.currentState.openDrawer() // This opens drawer.
    },
    ....
}

通常,我通常会尝试避免使用CustomAppBar。

希望这可以帮助。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM