Flutter3.16后如何修改primarySwatch主题样式

发布于 15 天前 作者 itying888 163 次浏览 最后一次编辑是 15 天前 来自 分享

大地老师Flutter系列教程免费学习地址http://bbs.itying.com/topic/620268d1a4bcc00fe8e9d6e1

Flutter3.16 官方把 Material3 定义成了默认样式,但是Material3样式并不好用 比较丑,下面给大家看看如何把默认的Material3样式改成以前的样式

Material3中可以需要通过 colorScheme配置主题样式(很多同学发现比较丑),Material3中修改样式方法

  theme: ThemeData(
        useMaterial3: true,
        ColorScheme.fromSeed(seedColor: Colors.blue)
),
 

Material3之前可以使用primarySwatch配置主题,下面我们就带大家一起看看如何使用以前的primarySwatch配置主题。

Flutter3.16后可以把useMaterial3配置成false ,这样就可以禁用Material3样式,使用以前的方式配置主题样式了。

Flutter3.16后参考下面代码配置主题(推荐)

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          useMaterial3: false,
          primarySwatch: Colors.blue,
          appBarTheme: const AppBarTheme(color: Colors.blue)),
      home: const MyHomePage(title: 'Flutter Demo Home Page1'),
    );
  }
}

AppBar可以去掉背景,或者使用Theme.of(context).colorScheme.primary

appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.primary,
        title: Text(widget.title),
      )
回到顶部