Question

抽屉具有默认的三个水平条作为默认图标，但我想将其更改为其他内容。我已经检查了Drawer（）下的可能选项，但是似乎没有属性附加到该选项。 PS：我是Flutter的初学者。

Answer 1

这应该有效。

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:Text('hi'),
        leading: IconButton(
          icon: Icon(Icons.accessible),
          onPressed: () => Scaffold.of(context).openDrawer(),
        ),
      ),
);

从文档->

{Widget前导}类型：Widget
显示在[title]前面的小部件。如果为null，并且[automaticallyImplyLeading]设置为true，则[AppBar]将暗示适当的窗口小部件。例如，如果[AppBar]位于也具有[Drawer]的[Scaffold]中，则[Scaffold]将用打开抽屉的[IconButton]填充此小部件（使用[Icons.menu]）。如果没有[抽屉]，并且父级[导航器]可以返回，则[AppBar]将使用调用[Navigator.maybePop]的[BackButton]。以下代码显示了如何手动指定抽屉按钮，而不是依靠[automaticallyImplyLeading]：

import 'package:flutter/material.dart';
Widget build(context) {
  return AppBar(
    leading: Builder(
      builder: (BuildContext context) {
        return IconButton(
          icon: const Icon(Icons.menu),
          onPressed: () {
            Scaffold.of(context).openDrawer();
          },
          tooltip: MaterialLocalizations.of(context).openAppDrawerTooltip,
        );
      },
    ),
  );
}

在此示例中，使用[Builder]以确保上下文引用子树的该部分。这样，即使在创建[Scaffold]的代码中也可以使用此代码段（在这种情况下，如果没有[Builder]，上下文将无法看到[Scaffold]，因为它将指向该小部件的祖先）。

Answer 2

appBar: AppBar(
        leading: Builder(
          builder: (context) => IconButton(
            icon: Icon(Icons.menu_rounded),
            onPressed: () => Scaffold.of(context).openDrawer(),
          ),
        ),
        title: Text(
          "Track your Shipment",
        ),
      ),

Answer 3

 appBar: AppBar(

    leading: Icon(Icons.favorite),

    title: Text("Drawer"),),

Answer 4

假设您有：index.dart（您要使用应用栏的位置）、drawer.dart（您的抽屉或导航菜单）和 appbar.dart（您的应用栏）

你可以在抽屉里做这个：

Widget drawer(BuildContext context) {
    return Drawer(
child: ListView(
  padding: EdgeInsets.zero,
  children: <Widget>[
    Container(
        ...
    )
);

然后是你的 appbar.dart：

class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
  @override
  Widget build(BuildContext context) {
    return AppBar(
      backgroundColor: Colors.white,
      leading: InkWell(
        onTap: () => Scaffold.of(context).openDrawer(),
        child: Image.asset("assets/images/imgAppBar.png"),
      ),
     title: Container(...

然后你的 index.dart:

@override
Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      drawer: drawer(context),
      appBar: CustomAppBar(),
    ...

这只是一个简单的。如果您想使用图标等，您可以使用 IconButton。

Answer 5

实际上，我尝试了 cmd_prompter 的答案，但对我不起作用。

描述了更好的方法here

我的工作代码在这里：

return DefaultTabController(
      key: Key("homePage"),
      length: 2,
      child: Scaffold(
          endDrawer: Drawer(

        ),
          appBar: AppBar(
            leading: BackButton(
                onPressed: () {
                  },
              ),
            title: Text(profile.selectedCity!),
            actions: [
              Padding(
                padding: EdgeInsets.symmetric(horizontal: baseUnit(3)),
                child: Builder(
                  builder: (context) => IconButton(
                      icon: Icon(Icons.account_circle),
                      onPressed: () => Scaffold.of(context).openEndDrawer(),
                    )
                )
              )

它对我来说很好 - 特别是关于使用 Builder 的这部分。这很重要 - 否则它对我不起作用。

Answer 6

如果有人只需要更改图标颜色：

通过adding an iconTheme to the AppBar

更容易做到

Answer 7

您需要创建 ScaffoldKey 类型的全局键，用于打开抽屉并更改图标

    Widget build(BuildContext context) {
    var scafoldKey = GlobalKey<ScaffoldState>();
    return Scaffold(
      appBar: AppBar(
        title:Text('hi'),
        leading: IconButton(
          icon: Icon(Icons.accessible),
          onPressed: () => scafoldKey.currentState.openDrawer(),
        ),
      ),
    );

如何在颤动中更改抽屉图标？

7 个答案: