如何在Flutter中在应用栏上添加抽屉和搜索图标

Question

我刚开始学习Flutter并探索它。我已经有了一个应用栏，但似乎无法正确显示抽屉图标和搜索图标。我希望它看起来像Gmail应用栏下面的图片那样。我正在开发一款公司帮助台移动应用程序。谢谢。

- Principiante

---

这个问题可以通过简单查看Flutter文档https://flutter.io/catalog/samples/basic-app-bar/和https://docs.flutter.io/flutter/material/Drawer-class.html轻松解决。 - J. S.

升级版 => https://dev59.com/4FUL5IYBdhLWcg3wYG_D#57942351 - Pasan Randula Eramusugoda

Answer 1

按照Flutter文档中所述进行操作。

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, ),
], )

小部件中，位于leading下面的是抽屉，位于actions下面的是搜索iconbutton。

- Bostrot

Answer 2

您可以尝试以下代码...

      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: () {
            },
          )
        ],
      ),

- Parth

Answer 3

这是最简单的

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,
      ),
    ),
  ),

- Kennedy Owusu

---

@mate00 这是一个带有操作的AppBar（包含搜索图标、个人图标和检测），具有居中的标题和背景颜色。 - Kennedy Owusu