如何在appbar flutter上更改文本和图标颜色

6qftjkof 于 2023-03-09 发布在 Flutter

关注(0)|答案(3)|浏览(197)

我有问题，而改变颜色的文本和图标小工具的appbar在flutter。
我已经尝试了主题内的材料应用程序，但它不工作。
这是在哪里起作用的：但是我想把这个应用到所有的appbars上。那么我应该在材质主题的哪里做改变呢？

MaterialApp(
          title: "My App",
          theme: ThemeData(
            appBarTheme: AppBarTheme(
              backgroundColor: Color(0xffFCD581),
              brightness: Brightness.dark,
            ),

我怎样才能改变text: profile和icon的颜色.全局.
设置headline6的颜色到Colors.black的作品。但它也使标题文本较小。我可以设置字体大小在headline6和它反映普遍。但我认为默认大小的标题，我们得到的appbar是足够合适的。所以有没有任何解决方案，将只改变color的appbar text, title而不影响fontsize。

flutter

来源：https://stackoverflow.com/questions/67517799/how-to-change-color-of-text-and-icons-on-appbar-flutter

3条答案

按热度按时间

ffx8fchx1#

使用IconButton作为后退按钮并指定颜色，使用TextStyle作为标题并指定颜色。

- 1.使用应用程序栏：**

Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        leading: IconButton(
          icon: Icon(Icons.arrow_back, color: Colors.red),
          onPressed: () => Navigator.of(context).pop(),
        ),
        title: Text("Sample", style: TextStyle(color: Colors.red),),
        centerTitle: true,
      ),

- 2.使用主题数据：**

theme: ThemeData(
    primaryTextTheme: TextTheme(
      headline6: TextStyle(color: Colors.red),
    ),
    appBarTheme: AppBarTheme(
      iconTheme: IconThemeData(color: Colors.red),
    ),
  ),

- 输出：**

赞(0）回复(0）举报 2023-03-09

f3temu5u2#

以下是如何更改文本和图标的颜色：

return Scaffold(
      appBar: AppBar(
        leading: null,
        automaticallyImplyLeading: true,
        centerTitle: true,
        iconTheme: IconThemeData(color: myCustomIconColor), //ICONS
        titleTextStyle: GoogleFonts.lato(
           textStyle: TextStyle(
           fontSize: 23,
           fontWeight: FontWeight.w700,
           color: myCustomTextColor,    //TEXT
         ),
        ),
        title: Text('Settings'),
      ),

也可以直接设置Text微件的样式并更改其颜色

赞(0）回复(0）举报 2023-03-09

eaf3rand3#

在MaterialApp小部件中使用AppBarTheme的iconTheme和titleTextStyle属性。

theme: ThemeData(
                iconTheme: IconThemeData(color: Colors.green),
                appBarTheme: AppBarTheme(color: Colors.green),
),

赞(0）回复(0）举报 2023-03-09

我来回答

如何在appbar flutter上更改文本和图标颜色

3条答案

相关问题

热门标签

最新问答