Flutter 自定义 Drawer 弹出的 Icon

最新推荐文章于 2025-10-22 21:07:33 发布

原创最新推荐文章于 2025-10-22 21:07:33 发布 · 3.4k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#Flutter #Dart

本文介绍如何在Flutter中自定义AppBar的左侧图标，使其点击后仍能弹出Drawer。通过使用Builder和IconButton组件，可以实现将默认的Drawer图标替换为自定义图标的功能。

当我们创建一个Drawer后，在AppBar左侧会默认出现一个图标，点击它可以弹出drawer，但是有时候我们希望将这个图标换成我们想要的图标。如果我们单纯地直接改AppBar的leading属性，改了之后再点击新的Icon不会再弹出Drawer了。

正确的做法如下：

appBar: AppBar(
          leading: Builder(builder: (BuildContext context) {
            return IconButton(
              icon: const Icon(Icons.face),
              onPressed: (){
                Scaffold.of(context).openDrawer();
              },
            );
          }),
          title: Text(title),
        ),