如何更改 Flutter 中的默認后退按鈕圖標？

Question

我將如何使用主題更改 flutter 中的后退按鈕圖標。 所以它可以體現在整個應用程序中。 我在主題中看到了多個選項來更改圖標的大小和顏色。 但是沒有看到更改圖標選項。

Answer 1

我不確定這是否是正確的方法。 我還在學習，我不知道這是否適用於所有情況。 我在開發應用程序時使用 VS Code 完成了此操作。

我查找了后退按鈕引用（Shift + Alt + F12）並在 flutter sdk 中找到了實際按鈕。我在back_button.dart文件中更改了它，該文件可以在您的 flutter 安裝文件夾中找到： c:\flutter\packages\flutter\lib\src\material\back_button.dart

在那里，編輯按鈕的 static IconData 方法並選擇您想要用於任何平台的任何圖標。

  static IconData _getIconData(TargetPlatform platform) {
    switch (platform) {
      case TargetPlatform.android:
      case TargetPlatform.fuchsia:
      case TargetPlatform.linux:
      case TargetPlatform.windows:
      case TargetPlatform.iOS:
      case TargetPlatform.macOS:
        return Icons.arrow_back_ios;
    }
  }

在上述情況下，Icons.arrow_back_ios 將在所有平台中返回。 您可以為每個平台指定返回圖標。

但是，我還沒有在現實世界的“生產使用”情況下對此進行測試，所以我希望這里的其他人可以澄清一下。

Answer 2

例子：

Scaffold(
  appBar(
    leading: BackButton(), // icon depends on TargetPlattrom
  ),
),

或者，您可以使用自己的圖標設置在IconButton上創建自己的常量小部件，而不是將其用作leading屬性的值。 此外，還有一個AppBarTheme class，可以在創建ThemeData實例時使用。

https://api.flutter.dev/flutter/material/AppBarTheme-class.html

PS 如果您查看 AppBar 源代碼，您會看到使用了常規小部件CloseButton或BackButton 。 所以它沒有特定的風格。 你有兩種方法：

• 創建您自己的全局小部件並在每個 Scaffold 中使用它。
• 使用您自己的領先屬性子類 Scaffold 並使用它。

Answer 3

這將為您完成工作：

IconButton(
  onPressed: (){
    Navigator.pop(context);
  },
  icon:Icon(Icons.arrow_back_ios), 
  //replace with our own icon data.
  )

對於像我這樣的未來尋求者。

Answer 4

appBar: AppBar(
              automaticallyImplyLeading: false,
              leading: Builder(
                builder: (BuildContext context) {
                  return IconButton(
                    icon: const Icon(Icons.alarm_on), // Put icon of your preference.
                    onPressed: () {
                      // your method (function), 
                    },
                  );
                },
              ),
              title: Text(widget.title),
              centerTitle: true,

上面的代碼會將默認的后退圖標更改為圖標上的警報。 你可以把它改成任何東西。