博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
flutter常见组件之Button(第二期)
阅读量:5780 次
发布时间:2019-06-18

本文共 1218 字,大约阅读时间需要 4 分钟。

内容如果对你有帮助,帮忙点下赞,你的点赞是我更新最大的动力,谢谢啦!如果在开发的过程遇到问题可以一起讨论,可以加我的QQ群!167646174!也可以加我微信,在群里!

具体代码见 ,欢迎各位Star,以及提issues!

1.RaisedButton

clipboard.png

API 作用 参数
color 背景色 -
padding 与文字的内边距 -
textColor 按钮内文字颜色 -
textTheme 按钮主题 -
disabledColor 按钮被禁用显示的颜色 -
disabledTextColor 按钮被禁用时文字显示颜色 -
highlightColor 击高亮的时候显示在控件上面,水波纹下面的颜色 -
splashColor 水波纹颜色 -
colorBrightness 按钮主题高亮 -
elevation 按钮下面的阴影 -
highlightElevation 高亮时候的阴影 -
disabledElevation 按下时候的阴影
clipBehavior 抗锯齿能力 -
onHighlightChanged 水波纹高亮时候回调 -
onPressed 点击事件 -
shape 拓展样式 _
icon 小图标按钮 只有IconButton才会使用到

---扩展---

1.1带斜角的按钮

clipboard.png

shape: BeveledRectangleBorder(       borderRadius: BorderRadius.all(Radius.circular(20))),

1.2圆按钮

clipboard.png

shape: CircleBorder(   // 圆边颜色     side: BorderSide(      color: Colors.black     )),

1.3圆角矩形按钮

clipboard.png

shape: RoundedRectangleBorder(    borderRadius: BorderRadius.all(Radius.circular(10))  ),

1.4两端半圆按钮

clipboard.png

shape: StadiumBorder(),

2.OutlineButton

API同RaisedButton

默认边线且背景透明的按钮

clipboard.png

3.FlatButton

API同RaisedButton

4.ButtonBar

clipboard.png

API 作用 参数
alignment 对齐方式 -
mainAxisSize 主轴大小,默认MainAxisSize.max -

5.FloatingActionButton

clipboard.png

API 作用
backgroundColor 背景色
elevation 未点击的阴影值
highlightElevation 点击时的阴影值
tooltip 长按文字提示
foregroundColor 按钮里面文字小图标颜色

具体代码见 ,欢迎各位Star,以及提issues!

不定期更新,根据工作繁忙度决定!
以下是往期相关文章:

转载地址:http://ovuyx.baihongyu.com/

你可能感兴趣的文章
【leetcode】Longest Common Prefix
查看>>
前端优化及相关要点总结
查看>>
Vue 列表渲染
查看>>
struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)
查看>>
25 个精美的手机网站模板
查看>>
C#反射实例应用--------获取程序集信息和通过类名创建类实例
查看>>
VC中实现文字竖排的简单方法
查看>>
会话标识未更新
查看>>
【设计模式】数据访问对象模式
查看>>
Tomcat8 配置Oracle11g数据源
查看>>
【PHP面向对象(OOP)编程入门教程】8.构造方法__construct()与析构方法__destruct()
查看>>
阿里架构师:程序员必须掌握的几项核心技术能力
查看>>
程序员常用的六大技术博客类
查看>>
vue中动画的实现的几种方式
查看>>
Iceworks 2.8.0 发布,自定义你的 React 模板
查看>>
胖哥学SpringMVC:请求方式转换过滤器配置
查看>>
Kotlin 更加优雅的 Builder - 理解 with
查看>>
前端日拱一卒D6——字符编码与浏览器解析
查看>>
python学习笔记- 多线程
查看>>
换一种思维看待PHP VS Node.js
查看>>