参考文章:
一、基础知识
1、继承关系
Object > Diagnosticable > DiagnosticableTree > Widget > StatelessWidget > MaterialButton > RaisedButton、FlatButton、OutlineButton
- 2021-12-18
TextButton 是 1.20.0 推出的一个新的按钮
Flutter TextButton 详细使用配置、Flutter ButtonStyle概述实践
flutter 2.0版本新增了三个按钮
TextButton、OutlinedButton、ElevatedButton
2、类
| 类 | |
|---|---|
| RaisedButton | Material Design中的button, 一个凸起的材质矩形按钮。 |
| FlatButton | Material Design中的button,一个没有阴影的材质设计按钮。 |
| OutlineButton | Material Design中的button,RaisedButton和FlatButton之间的交叉:一个带边框的背景透明的按钮,当按下按钮时,其高度增加,背景变得不透明。 |
| IconButton | 用于创建仅包含图标的按钮,参数就不再讲解 |
| DropdownButton | 一个显示可供选择的选项的按钮 |
| FloatingActionButton | 材质应用程序中的圆形按钮 |
| InkWell | 实现平面按钮的墨水飞溅部分 |
RaisedButton、FlatButton、OutlineButton三个控件都继承于MaterialButton,查看源码会发现MaterialButton由RawMaterialButton(无主题Button)构建的。而RawMaterialButton与CupertinoButton是一对button组合,都继承于StatefulWidget,前者是google风格,后者iOS风格!
附:使用CupertionBUtton要注意导入库:import ‘package:flutter/cupertino.dart’;
二、 MaterialButton参数详解
这里我们仅对个别不好理解的做解释。
| 属性 | 作用 | 备注 |
|---|---|---|
| VoidCallback onPressed | 点击激活按钮时调用的方法 | |
| ValueChanged |
按下和抬起时都会调用的方法,详看后面示例 | |
| ButtonTextTheme textTheme | 定义按钮的基色,以及按钮的最小尺寸,内部填充和形状的默认值。 | |
| Color disabledTextColor | 未设置按钮点击回调时使用的文本颜色 | |
| Color splashColor | 按钮被按下的水波纹颜色,默认是有值的,不要要水波纹效果设置透明颜色即可! | |
| colorBrightness | 按钮的主题亮度,当设置了textColor、color颜色,此值无效! | |