简体   繁体   中英

How to add a drawer and a search icon on my app bar in flutter

I'm new to flutter and exploring it. I already have an app bar but I can't seem to figure out how to properly display a drawer icon and a search icon on it. I want it to look like the gmail app bar like the image below. I am working on a company helpdesk mobile app. Thanks.

gmail 应用栏

Do it as stated in the flutter docs .

new AppBar( 
    title: new Text('My Fancy Dress'), 
    actions: <Widget>[ 
        new IconButton( icon: new Icon(Icons.playlist_play), tooltip: 'Air it', onPressed: _airDress, ),],
    leading: <Widget>[
        new IconButton( icon: new Icon(Icons.playlist_play), tooltip: 'Air it', onPressed: _airDress, ),
], )

Where the widget under leading is the drawer and the one under actions is the search iconbutton.

You can try this code....

      appBar: AppBar(
        leading: Builder(
            builder: (BuildContext context){
              return IconButton(
                icon: Icon(Icons.menu),
                onPressed: () {

                },
              );
            }),
        title: Text("Flutter App"),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.search),
            onPressed: () {
            },
          ),
          IconButton(
            icon: Icon(Icons.search),
            onPressed: () {
            },
          )
        ],
      ),

This is the simplest

appBar: AppBar(
    actions: <Widget>[
      IconButton(
        icon: Icon(Icons.search),
        onPressed: () {},
      ),
      IconButton(
        icon: Icon(Icons.person),
        onPressed: () {
        },
      )
    ],
    centerTitle: true,
    backgroundColor: Colors.red,
    title: Text(
      "Your title",
      style: TextStyle(
        color: Colors.white,
        fontSize: 30,
        fontWeight: FontWeight.bold,
        fontStyle: FontStyle.italic,
      ),
    ),
  ),

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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