[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 ...
随机推荐
- 【LEETCODE】43、1002. Find Common Characters
package y2019.Algorithm.array; import java.util.*; /** * @ProjectName: cutter-point * @Package: y201 ...
- THUSC2019:Illusory World
拿了1=就来更 Update:没约咕了
- 在 WPF 中获取一个依赖对象的所有依赖项属性
原文:在 WPF 中获取一个依赖对象的所有依赖项属性 本文介绍如何在 WPF 中获取一个依赖对象的所有依赖项属性. 本文内容 通过 WPF 标记获取 通过设计器专用方法获取 通过 WPF 标记获取 p ...
- 修改CentOS默认yum源为国内镜像
参考文档 https://blog.csdn.net/inslow/article/details/54177191 国内主要开源的开源镜像站点应该是网易和阿里云了. 修改为163yum源-mirro ...
- 【CF1095F】 Make It Connected(最小生成树)
题目链接 如果没有特殊边的话显然答案就是权值最小的点向其他所有点连边. 所以把特殊边和权值最小的点向其他点连的边丢一起跑最小生成树就行了. #include <cstdio> #inclu ...
- JavaScript_day02
10.随机数 随机数一般和数组组合使用. 生成随机数:使用Math.random()函数,生成的随机数0-1.一般乘以10^n扩大随机数范围. Math.round()函数和parseInt()函数. ...
- js实现图片上传本地预览
演示地址:https://xibushijie.github.io/static/uploadImg.html <!DOCTYPE> <html> <head> & ...
- C++遍历磁盘驱动器
#include <stdio.h> #include <windows.h> typedef struct tagDRIVER { // (1)磁盘盘符 wchar_t di ...
- [TensorFlow]Windows下安装并运行Hello World
参考网址:https://www.tensorflow.org/install/pip (或要VPN) 建议电脑是独显N卡机,安装前先升级驱动,减少不必要错误 1.下载Microsoft Visual ...
- linux设备模型与内核中的面向对象思想
linux内核用C语言实现了C++面向对象的大部分特性:封装,继承,多态.在看内核的过程中,开始追寻其中的设计思想,封装.继承.多态.恰好今天又在看Linux设备模型,找了很多资料.总结如下: 1.l ...