[Flutter] Create a Customer widget
For example, we want to have to button, looks similar to FloatingActionButton:

But in the doc, it says to it is recommend to have only one floatingActionButton pre Application.
So it is good idea to implement a similar one and learn how to build custom widget.
First thing first, since Flutter source code are very easy to read, we can check how FloatActionButton are implemented.
Actually we can see it is implement as 'RawMateriaButton'.
class RoundIconButton extends StatelessWidget {
RoundIconButton({@required this.icon, @required this.onPressed});
final IconData icon;
final Function onPressed;
@override
Widget build(BuildContext context) {
return RawMaterialButton(
child: Icon(icon),
elevation: 6.0,
onPressed: onPressed,
shape: CircleBorder(),
fillColor: Color(0XFF4C4F5E),
constraints: BoxConstraints.tightFor(
width: 56.0,
height: 56.0,
),
);
}
}
Usage:
RoundIconButton(
icon: FontAwesomeIcons.plus,
onPressed: () {
setState(() {
age++;
});
},
),
[Flutter] Create a Customer widget的更多相关文章
- [转]simple sample to create and use widget for nopcommerce
本文转自:http://badpaybad.info/simple-sample-to-create-and-use-widget-for-nopcommerce Here is very simpl ...
- Flutter 基础组件:Widget简介
概念 在Flutter中几乎所有的对象都是一个Widget.与原生开发中"控件"不同的是,Flutter中的Widget的概念更广泛,它不仅可以表示UI元素,也可以表示一些功能性的 ...
- flutter系列之:构建Widget的上下文环境BuildContext详解
目录 简介 BuildContext的本质 BuildContext和InheritedWidget BuildContext的层级关系 总结 简介 我们知道Flutter中有两种Widget,分别是 ...
- Create a Qt Widget Based Application—Windows
This turtorial describes how to use Qt Creator to create a small Qt application, Text Finder. It is ...
- Flutter常用组件(Widget)解析-Scaffold
实现一个应用基本的布局结构. 举个栗子: import 'package:flutter/material.dart'; void main() => runApp(MyApp()); clas ...
- Flutter常用组件(Widget)解析-ListView
一个可滚动的列表组件 不管在哪,列表组件都尤为重要和常用. 首先来看个例子: import 'package:flutter/material.dart'; void main () => ru ...
- Flutter常用组件(Widget)解析-Container
一个组件它往往包含了一些常见的painting, positioning和sizing这样的小部件. Container相当于我们常用的div,在Flutter中用的非常多,现在来看看Containe ...
- Flutter视图基础简介--Widget、Element、RenderObject
前言:Flutter官方文档里的一句话:you build your UI out of widgets(使用Flutter开发UI界面时,都是使用Widget),然而,Widget并不是我们真正看到 ...
- 【Flutter学习】之Widget数据共享之InheritedWidget
一,概述 业务开发中经常会碰到这样的情况,多个Widget需要同步同一份全局数据,比如点赞数.评论数.夜间模式等等.在安卓中,一般的实现方式是观察者模式,需要开发者自行实现并维护观察者的列表.在flu ...
随机推荐
- Mybatis中实体类属性与数据库列表间映射方法介绍
这篇文章主要介绍了Mybatis中实体类属性与数据列表间映射方法介绍,一共四种方法方法,供大家参考. Mybatis不像Hibernate中那么自动化,通过@Co ...
- python基础 — time库
时间获取-------time() ctime() gmtime() 时间格式化-------strftime() strptime() 程序计时-------sleep() perf_count ...
- String和Irreducible Polynomial(2019牛客暑期多校训练营(第七场))
示例: 输入: 4000010010111011110 输出: 00001001 0111 01111 0 题意:给出一个只含有0和1的字符串,找出一种分割方法,使得每个分割出的字符串都是在该字符串自 ...
- Linux命令sort和uniq 的基本使用
uniq 123.txt 去除连续重复uniq -u 123.txt 保留唯一uniq -c 123.txt 去重并计算出现的个数sort -n 123.txt | uniq -c 排序后去重s ...
- ax 2012批处理不运行问题
最近在开发12的批处理,但是很奇怪所有的都配置好了就是不跑批处理,假如你也出现了那用下面的方法试试: 12的批处理和09不一样,不是运行x++代码,而且运行你CIL生成的DLL文件, 1.你必须让你的 ...
- go语言学习笔记---读取文件io/ioutil 包
io/ioutil 包几个函数方法 名称 作用 备注 ReadAll 读取数据,返回读到的字节 slice 1 ReadDir 读取一个目录,返回目录入口数组 []os.FileInfo, 2 Re ...
- NIO(2):Channel
Channel可以理解为铁轨,Buffer是铁轨上的火车.铁轨的两端连接这文件描述符或者说文件的缓冲区和程序运行时的内存.借助NIO是一种更加符合OS底层文件系统的调用方式,使用NIO可以用更小的开销 ...
- 接口认证:Bearer Token(Token 令牌)
因为HTTP协议是开放的,可以任人调用.所以,如果接口不希望被随意调用,就需要做访问权限的控制,认证是好的用户,才允许调用API. 目前主流的访问权限控制/认证模式有以下几种: 1)Bearer To ...
- 启动Nginx服务失败:Job for nginx.service failed because the control process exited with error code. See "systemctl status nginx.service" and "journalctl -xe" for details.
首次接触nginx,安装完使用命令 service nignx restart 后,出现这个错误,并按照提示给出的命令查看错误详情 systemctl status nginx.service ...
- vue_插槽的理解和使用
对于插槽的概念和使用,这是vue的一个难点,这需要我们静下心来,慢慢研究.以下是我这两天通过官网和其他资料的学习和使用总结出来的笔记,如有错误或者有不同见解的,欢迎留言,一起学习. 什么是插槽? 插槽 ...