flutter FloatingActionButton组件
import 'package:flutter/material.dart';
class FloatingActionButtonDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
final Widget _floatingActionButton = FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add),
elevation: 0.0,
backgroundColor: Colors.black87,
// shape: BeveledRectangleBorder(
// borderRadius: BorderRadius.circular(30.0)
// ),
);
final Widget _floatingActionButtonExtended = FloatingActionButton.extended(
onPressed: () {},
icon: Icon(Icons.add),
label: Text('Add'),
);
return Scaffold(
appBar: AppBar(
title: Text('FloatingActionButtonDemo'),
elevation: 0.0,
),
floatingActionButton: _floatingActionButton,
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: BottomAppBar(
child: Container(
height: 80.0,
),
shape: CircularNotchedRectangle(),
),
);
}
}
一个圆形图标按钮,它悬停在内容之上,以展示应用程序中的主要动作。FloatingActionButton通常用于Scaffold.floatingActionButton字段
效果:

文档:https://api.flutter.dev/flutter/material/FloatingActionButton-class.html
flutter FloatingActionButton组件的更多相关文章
- Flutter——FloatingActionButton组件(浮动按钮组件)
FloatingActionButton 简称 FAB ,可以实现浮动按钮,也可以实现类似闲鱼 app 的地步凸起导航. 属性名称 属性值 child 子视图,一般为 Icon,不推荐使用文字 ...
- Flutter 父子组件传值
Flutter 父子组件传值 一父传子: 父中: void onButtonChange(val1,val2,val3){ print('============================子向父 ...
- flutter Container组件和Text组件
在开始之前,我们先写一个最简单的入口文件: 后面,都是在这个结构的基础上面完成的. 由于Container组件和Text组件都是写在body里面的,所以下面,先将body抽离成一个组件的形式. ...
- Flutter InkWell - Flutter每周一组件
Flutter Inkwell使用详解 该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://gi ...
- Flutter ListTile - Flutter每周一组件
该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://github.com/xj124456/fl ...
- 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 BottomNavigationBar 组件
BottomNavigationBar 是底部导航条,可以让我们定义底部 Tab 切换,bottomNavigationBar是 Scaffold 组件的参数. BottomNavigationBar ...
随机推荐
- yum 异常解决一例
http://mirrors.cloud.aliyuncs.com/centos/6/os/x86_64/repodata/repomd.xml: [Errno 14] PYCURL ERROR 22 ...
- 基于Java+Selenium的WebUI自动化测试框架(十一)-----读取Excel文件(POI)(1)
上一篇说了利用JXL的jar包来读取Excel的代码.在Java中,还可以用另外一种jar包来读取Excel的内容,那就是Apache的POI. 这里和之前一样,需要导入POI的jar包,建议导入这三 ...
- 51nod 1657 电子龟
电子龟的行动,是沿着直线左右走动的.他能够接受两种指令,“T”(向后转,即如果面向左,改成向右:否则就向左)和“F”(向当前面朝的方向往前移动一个单位距离). 现在给出一串指令,让电子龟来执行.你必须 ...
- 错误:找不到或无法加载主类(myEclipse and IDEA)
一.myEclipse: 一个简单的main类启动时报无法加载主类的处理方法 1.找到Prolems--->Error--->右键Delete 2.点击项目,右键刷新 3.点击导航栏上的P ...
- postgresql —— 数组类型
创建数组 CREATE TABLE sal_emp ( name text, pay_by_quarter integer[] --还可以定义为integer[4]或integer ARRAY[4] ...
- C# 8.0 的新特性( NET Framework 4.8 与 Visual Studio 2019 )
C#8.0 于 2019年4月 随 .NET Framework 4.8 与 Visual Studio 2019 一同发布 使用VS2019体检C#8.0新功能: 编辑.csproj文件,添加如下代 ...
- jpg/jpeg/png格式的区别与应用场景
注:在存储图像时采用JPG还是PNG主要依据图像上的色彩层次和颜色数量进行选择 一..jpg/jpeg格式的图片(jpg全名:jpeg) JPG(或是JPEG): 优点: (1)占用内存小,网页加载速 ...
- 入门node.js
我们现在要做一个简单的h5应用:包含登录.注册.修改密码.个人中心主页面.个人中心内页修改名称.个人中心修改手机号码. 第一步:工具安装,我选择了能够辅助我们快速开发的light开发工具 1. lig ...
- LeetCode 381. Insert Delete GetRandom O(1) - Duplicates allowed
原题链接在这里:https://leetcode.com/problems/insert-delete-getrandom-o1-duplicates-allowed/?tab=Description ...
- 汇编语言笔记 CALL和RET指令
转载地址:http://www.cnblogs.com/dennisOne ☞模块化程序设计 模块化程序设计 汇编语言通过call和ret指令实现了模块化程序设计.可以实现多个相互联系.功能独立的子程 ...