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

  1. Flutter——FloatingActionButton组件(浮动按钮组件)

    FloatingActionButton 简称 FAB ,可以实现浮动按钮,也可以实现类似闲鱼 app 的地步凸起导航.     属性名称 属性值 child 子视图,一般为 Icon,不推荐使用文字 ...

  2. Flutter 父子组件传值

    Flutter 父子组件传值 一父传子: 父中: void onButtonChange(val1,val2,val3){ print('============================子向父 ...

  3. flutter Container组件和Text组件

    在开始之前,我们先写一个最简单的入口文件:     后面,都是在这个结构的基础上面完成的. 由于Container组件和Text组件都是写在body里面的,所以下面,先将body抽离成一个组件的形式. ...

  4. Flutter InkWell - Flutter每周一组件

    Flutter Inkwell使用详解 该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://gi ...

  5. Flutter ListTile - Flutter每周一组件

    该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://github.com/xj124456/fl ...

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

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

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

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

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

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

  9. Flutter BottomNavigationBar 组件

    BottomNavigationBar 是底部导航条,可以让我们定义底部 Tab 切换,bottomNavigationBar是 Scaffold 组件的参数. BottomNavigationBar ...

随机推荐

  1. Kotlin继承与重写重要特性剖析

    继续Kotlin的面向对象之旅. 继承: 在Java中我们知道除了final类不能被继承,其它的情况都是可以被继承的,而在Kotlin中的规则是这样的:“在Kotlin中,所有类在默认情况下都是无法被 ...

  2. python 单元测试(unittest)

    自动化测试在各大互联网公司全面铺开,那么针对于自动化测试好的设计思想有哪些呢?.....今天我们共同探讨下Unittest之数据驱动(DDT是 “Data-Driven Tests”的缩写). 对于接 ...

  3. Servlet的入门

    什么是Servlet? Servlet是运行在服务端的java小程序,是sun公司提供的一套规范,用来处理客户端请求.响应给浏览器的动态资源.Servlet是JavaWeb三大组件之一(Setvlet ...

  4. ASCII、Unicode、UTF-8字符集编码

    ASCII码 计算机内部,所有信息都是由二进制的字符串表示 每一个二进制位有“0”.“1”两种状态,因此8个二进制位可以表示256个状态,每个状态代表一个符号就是256个符号,从0000000到111 ...

  5. SQL SERVER使用 CROSS APPLY 与 OUTER APPLY 连接查询

    概述 CROSS APPLY 与 OUTER APPLY 可以做到:      左表一条关联右表多条记录时,我需要控制右表的某一条或多条记录跟左表匹配的情况. 有两张表:Student(学生表)和 S ...

  6. CheckList 如何梳理可减少上线的验证时间(总结篇)

    对CheckList的执行发起的思考? (1)功能越来越多,CheckList越补充越多,执行CheckList时间越来越长,如何减少上线的验证时间?(2)减少上线验证的时间外,如何保证质量?上线后少 ...

  7. 编程判断输入的字符是否为‘y’或‘Y’,若是,则输出‘yes’,否则输出‘no’

    #include<stdio.h>void main(){ char ch; ch=getchar(); ch == 'y' || ch == 'Y' ? printf("yes ...

  8. 用LinkedList和ArrayList实现自定义栈的异同

    //ArrayList已连续的空间进行存储数据  //LinkedList已链表的结构存储数据    //栈  MyStark ms=new MyStark();//new 一个实现栈的类  //压栈 ...

  9. Oracle DG 三种模式

    DG有下面三种模式– Maximum protection– Maximum availability– Maximum performance 在Maximum protection下, 可以保证从 ...

  10. MongoDB 复制集监控

    1.复制集状态查询:rs.status() 2.查看当前副本集oplog状态:rs.printReplicationInfo() 3.查看复制延迟:rs.printSlaveReplicationIn ...