Flutter之Drawer组件

UserAccountsDrawerHeader
UserAccountsDrawerHeader 可以设置用户头像、用户名、Email 等信息

/**
    const UserAccountsDrawerHeader({
    Key key,
    this.decoration,//
    this.margin = const EdgeInsets.only(bottom: 8.0),//
    this.currentAccountPicture,//用来设置当前用户的头像
    this.otherAccountsPictures,//用来设置当前用户的其他账号的头像
    @required this.accountName,//当前用户的姓名
    @required this.accountEmail,//当前用户的邮箱
    this.onDetailsPressed//当 accountName 或者 accountEmail 被点击的时候所触发的回调函数，可以用来显示其他额外的信息
    })
 */

var userAccountsDrawerHeader = UserAccountsDrawerHeader(
    accountName: Text("张三"),
    accountEmail: Text("123456@163.com"),
    currentAccountPicture: CircleAvatar(
      backgroundImage: NetworkImage(
          "http://img8.zol.com.cn/bbs/upload/23765/23764201.jpg"),
    ),
    otherAccountsPictures: <Widget>[
      CircleAvatar(
        backgroundImage: NetworkImage(
            "http://img8.zol.com.cn/bbs/upload/23765/23764201.jpg"),
      ),
      CircleAvatar(
        backgroundImage: NetworkImage(
            "http://img8.zol.com.cn/bbs/upload/23765/23764201.jpg"),
      ),
    ],
    onDetailsPressed: () {
      print("!!!!!!!!");
    }
);

DrawerHeader自定义Drawer的头部信息

/**
    const DrawerHeader({
    Key key,
    this.decoration,//通常用来设置背景颜色或者背景图片
    this.margin = const EdgeInsets.only(bottom: 8.0),
    this.padding = const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 8.0),
    this.duration = const Duration(milliseconds: 250),
    this.curve = Curves.fastOutSlowIn,
    @required this.child,
    })
 */

var drawerHeader = DrawerHeader(
  padding: EdgeInsets.zero,
  child: Stack(
    children: <Widget>[
      Image.network(
          "http://img.zcool.cn/community/01f5795541d50b00000115410b205a.jpg"),
      Align(
        alignment: FractionalOffset.bottomLeft,
        child: Container(
          padding: EdgeInsets.only(left: 12.0),
          height: 70.0,
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              CircleAvatar(
                backgroundImage: NetworkImage(
                    "http://img8.zol.com.cn/bbs/upload/23765/23764201.jpg"),
              ),
              Container(
                  padding: EdgeInsets.only(left: 5.0),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Text("文本1"),
                      Text("文本2"),
                    ],
                  )
              )
            ],
          ),
        ),
      )
    ],
  ),
);

Drawable使用：

drawer: Drawer(
  child: ListView(
    children: <Widget>[

      userAccountsDrawerHeader,
//drawerHeader ,

      ListTile(
        title: Text("Title1"),
        subtitle: Text("Title1  subtitle"),
        leading: CircleAvatar(
          child: Icon(Icons.home),
        ),
        onTap: () => print("Title1"),
      ),
      ListTile(
        title: Text("Title2"),
        leading: CircleAvatar(
          child: Icon(Icons.alarm),
        ),
        selected: true,
        trailing: Icon(Icons.add),

        onTap: () => print("Title2"),
      ),
      ListTile(
        title: Text("Title3"),
        leading: CircleAvatar(
          child: Icon(Icons.add),
        ),
        onTap: () => print("Title3"),
        enabled: false,
      ),
    ],
  ),
),