天天看点

Flutter 基础控件 Button Widget

Flutter 基础控件 Button Widget

BackButton

CloseButton

FlatButton

FlatButton.icon

OutlineButton

OutlineButton.icon

RaisedButton

RaisedButton.icon

MaterialButton

RawMaterialButton

FloatingActionButton

完整示例

BackButton是一个material风格的返回按钮,本身是一个IconButton,点击时默认执行Navigator.maybePop即如果路由栈有上一页则返回到上一页。

CloseButton是一个material风格的关闭按钮,本身是一个IconButton,点击时默认执行Navigator.maybePop即如果路由栈有上一页则返回到上一页。

FlatButton :扁平化的按钮,继承自MaterialButton

semanticsLabel 相当于tips 控件描述

带图标

Flutter 基础控件 Button Widget

OutlineButton :带边框的按钮,继承自MaterialButton

继承自MaterialButton,所以MaterialButton中的大多数属性这边都能用,且效果一致

Flutter 基础控件 Button Widget

onPressed: 按下之后松开的回调,也就是所谓的点击事件。其实是当用户手抬起来时的动作

onHighlightChanged: onPressed!=null 的时候可以看出 相当于用户按下时(高亮) 或者 松开时(不高亮)的监听。

textColor: 里面文本的颜色

disabledTextColor: 当状态为 disable的时候 文本的颜色,onpress=null 为disable

注意点 在这里无效 在它子类有效(RaisedButton ,FlatButton ,OutlineButton )

color: // 当是 enable (onpress != null) 背景色

disabledColor: //onpress = null 的时候的颜色(不知道为什么测试不管用)

highlightColor: 当用户 按下高亮时 的颜色

elevation: Z轴阴影 默认是2 ,当 enable 的时候的阴影

highlightElevation: 高亮时的阴影 默认是 8 button 被按下的时候

disabledElevation: 当 disabled (onpress = null) 的阴影 默认是0 ,测试的时候 阴影还是 为0.0,也就是说不管用

minWidth: 最小的宽度 默认是 88 。 在 ButtonTheme 规定的

height: 高度, 默认是 36 也是在 ButtonTheme 规定的

child: 包括的子控件

shape 边框样式

onPressed 点击回调

onHighlightChanged 高亮变化回调

textStyle 字体样式

fillColor 背景填充颜色

highlightColor 高亮颜色

splashColor 水波纹颜色

elevation 阴影Z轴值

highlightElevation 高亮 阴影Z轴值

disabledElevation 禁用阴影Z轴值

padding padding

constraints 按钮大小,一般设置最小size

shape 按钮形状

child :子视图,一般为 Icon,不推荐使用文字

tooltip FAB: 被长按时显示,也是无障碍功能

backgroundColor: 背景颜色

elevation :未点击的时候的阴影

hignlightElevation :点击时阴影值,默认 12.0

onPressed :点击事件回调

shape :可以定义 FAB 的形状等

mini: 是否是 mini 类型默认 false

Flutter 基础控件 Button Widget

继续阅读