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的更多相关文章

  1. [转]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 ...

  2. Flutter 基础组件:Widget简介

    概念 在Flutter中几乎所有的对象都是一个Widget.与原生开发中"控件"不同的是,Flutter中的Widget的概念更广泛,它不仅可以表示UI元素,也可以表示一些功能性的 ...

  3. flutter系列之:构建Widget的上下文环境BuildContext详解

    目录 简介 BuildContext的本质 BuildContext和InheritedWidget BuildContext的层级关系 总结 简介 我们知道Flutter中有两种Widget,分别是 ...

  4. 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 ...

  5. Flutter常用组件(Widget)解析-Scaffold

    实现一个应用基本的布局结构. 举个栗子: import 'package:flutter/material.dart'; void main() => runApp(MyApp()); clas ...

  6. Flutter常用组件(Widget)解析-ListView

    一个可滚动的列表组件 不管在哪,列表组件都尤为重要和常用. 首先来看个例子: import 'package:flutter/material.dart'; void main () => ru ...

  7. Flutter常用组件(Widget)解析-Container

    一个组件它往往包含了一些常见的painting, positioning和sizing这样的小部件. Container相当于我们常用的div,在Flutter中用的非常多,现在来看看Containe ...

  8. Flutter视图基础简介--Widget、Element、RenderObject

    前言:Flutter官方文档里的一句话:you build your UI out of widgets(使用Flutter开发UI界面时,都是使用Widget),然而,Widget并不是我们真正看到 ...

  9. 【Flutter学习】之Widget数据共享之InheritedWidget

    一,概述 业务开发中经常会碰到这样的情况,多个Widget需要同步同一份全局数据,比如点赞数.评论数.夜间模式等等.在安卓中,一般的实现方式是观察者模式,需要开发者自行实现并维护观察者的列表.在flu ...

随机推荐

  1. windows server系统打印服务配置

    系统环境:windows server 2008 R2 Enterprise Service Pack 1 安装内存:8G 系统类型:64位操作系统 目标:在此系统上开启打印服务,可以添加网络打印机 ...

  2. LOJ2882 JOISC2014 两个人的星座 计算几何

    传送门 一件值得注意的事情是:平面上两个不相交的三角形一定会存在两条公切线 那么我们可以枚举三角形的公切线,计算有多少个三角形的公切线之一为该线,所有的答案除以2就是我们要求的答案. 考虑如何去计算有 ...

  3. SQL Server 索引优化——无用索引

    我们知道,合理的索引能大幅提升性能,但冗余的索引也会降低数据库性能.随着我们业务的发展,数据库的中的表.表结构.查询的内容都有可能发生变化.这样,有的索引就可能不再使用了,需要删除(因为维护索引即浪费 ...

  4. C#使用共享内存与C++进行数据交互

    现在做桌面的不多了.前端太流行了,大家都去搞前端了. 需求如下: 上层UI使用C#开发,数据采集模块使用C++开发.数据采集模块采集到的数据比较大,上层需要接收这一块数据并显示 进程间通信的方式有多种 ...

  5. H5打开app指定页面(H5+app项目)

    H5+app项目,在HBuilderX中设置 详情参考官方 https://ask.dcloud.net.cn/article/64 给h5+app设置scheme值,作用:在其它app和h5页面中启 ...

  6. Fortify漏洞之Dynamic Code Evaluation: Code Injection(动态脚本注入)和 Password Management: Hardcoded Password(密码硬编码)

    继续对Fortify的漏洞进行总结,本篇主要针对  Dynamic Code Evaluation: Code Injection(动态脚本注入) 和 Password Management: Har ...

  7. Android Room 使用案例

    本内容主要介绍 Android 中使用 Room 保存数据到本地数据库的方法.  以下是 Android Room 的官方介绍文档: Room Persistence Library(Room 库的简 ...

  8. Java RMI学习

    网上资料: Java RMI Tutorial Dynamic code downloading using RMI RPC-维基:Remote procedure call implementing ...

  9. CDN详解

    一.定义 背景: 当下的互联网应用都包含大量的静态内容,但静态内容以及一些准动态内容又是最耗费带宽的,特别是针对全国甚至全世界的大型网站,如果这些请求都指向主站的服务器的话,不仅是主站服务器受不了,单 ...

  10. jenkins报错 Upgrading Jenkins. Failed to update the default Update Site 'default'. Plugi

    解决方案: jenkins\hudson.model.UpdateCenter.xml 文件, 将 url 中的 https://updates.jenkins.io/update-center.js ...