在Flutter3.3版本以上,支持Material3,使用Material3样式首先是要配置启用Material3。
Material3 主要体现在 圆角风格、颜色、文本样式等方面。
1 配置启用 Material3
查看当前 Flutter的版本
在程序的入口 MaterialApp中设置主题ThemeData中的useMaterial3属性为true.
2 按钮样式的改变
按钮默认的圆角大小改变
2.1 ElevatedButton
2.2 ElevatedButton 自定义样式
2.2 ElevatedButton 自定义样式
ElevatedButton 可通过 style 来设置样式,onPrimary 属性来设置前景色,比如这里的文本的颜色,primary 用来设置背景色,也就是这里的ElevatedButton按钮的填充颜色。
2.3 OutlinedButton
2.3 OutlinedButton
2.4 FloatingActionButton.small
2.4 FloatingActionButton.small
2.5 FloatingActionButton
2.5 FloatingActionButton
2.6 FloatingActionButton.extended
2.6 FloatingActionButton.extended
2.7 FloatingActionButton.large
2.7 FloatingActionButton.large
3 AlertDialog 的边框圆角改变
3 AlertDialog 的边框圆角改变
4 主题文本样式的默认大小改变
4 主题文本样式的默认大小改变
5 ColorScheme 的变更
5 ColorScheme 的变更