解决Flutter中ThemeData.primaryColor在AppBar等组件中不生效

解决Flutter中ThemeData.primaryColor在AppBar等组件中不生效,第1张

出现场景

闲着没事,将Flutter SDK升级到了2.10.5,结果发现app所有页面的AppBar颜色全变成了默认的蓝色,在MaterialApp中设置的primaryColor颜色没有生效。

MaterialApp(
	theme: ThemeData(
	  primaryColor: Colors.green,
	),
)

解决方法

通过Flutter的github issues发现,从Flutter 2.5开始,Flutter团队开始慢慢移除ThemeData.primaryColor属性对所有组件的影响,取而代之的是基于ColorScheme的Color。

MaterialApp(
	theme: ThemeData(
	  primaryColor: Colors.green,
	  colorScheme: ColorScheme.light().copyWith(primary: Colors.green),
	),
)


如果想要所有组件保持统一主题,目前可以使用以下代码达到统一。

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        ///因为有的组件的默认颜色使用的是 primaryColor,有的用的是primarySwatch,所以必须同时设置
        primaryColor: Colors.green,
        colorScheme: ColorScheme.light().copyWith(primary: Colors.green),
        primarySwatch: Colors.green
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/993547.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存