把抽屉放在AppBar底部的正确方法



我就是这样做的

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Image.asset(
          'assets/images/logo.png',
          height: 20.0,
        ),
        leading: InkWell(
          onTap: () {
            //do something here
          },
          child: Icon(
            Icons.menu,
          ),
        ),
        backgroundColor: Colors.red,
      ),
      body: SafeArea(
        child: RefreshIndicator(
            child: Column(
                       ...
        ),
      drawer: Padding(
        padding: const EdgeInsets.only(top:89), // I've added this so that I can test it
        child: Drawer(
          child: ListView(
            padding: EdgeInsets.zero,
            children: <Widget>[
              ListTile(
                title: Text('Item 1'),
                onTap: () {
                },
              ),
              ListTile(
                title: Text('Item 2'),
                onTap: () {
                },
              ),
       ...

我已经添加了一个填充padding: const EdgeInsets.only(top:89),但appbar仍然有透明看着抽屉打开。

解决这个问题的最好方法是什么?我需要把抽屉放在其他地方,还是这是一个简单的解决方案?

为了看到没有透明外观的AppBar,您需要将Scaffold中的drawerScrimColor设置为Colors.transparent。像这样:

Widget build(BuildContext context) {
    return Scaffold(
      
      ... // other lines
      drawerScrimColor: Colors.transparent, // Set the color to transparent here
      drawer: Padding(
     
      ... // other lines
@override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        drawer: SafeArea(
            child: Drawer(
                child: Column(children: <Widget>[
                  UserAccountsDrawerHeader(
                    margin: EdgeInsets.only(bottom: 3.0),
                    onDetailsPressed: () {},
                    currentAccountPicture: CircleAvatar(
                      radius: 30,
                      child: Icon(Icons.person, size: 60,),
                    ),
                    accountName: Text("Name",),
                    accountEmail: Text("Email Id",),
                  ),
                  ListTile(
                    leading: Icon(Icons.home,size: 20,),
                    title: Text('Home'),
                    trailing: Icon(Icons.arrow_forward_ios),
                    onTap: () {},
                  ),
                ])
            )
        ),
      body: Container(),
    );
}

相关内容

最新更新