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. A Beginner’s Guide to Webpack 4 and Module Bundling

    原文: https://www.sitepoint.com/beginners-guide-webpack-module-bundling/ ----------------------------- ...

  2. P1311 选择客栈[模拟]

    题目描述 丽江河边有nn家很有特色的客栈,客栈按照其位置顺序从 11到nn编号.每家客栈都按照某一种色调进行装饰(总共 kk 种,用整数 00 ~k-1k−1 表示),且每家客栈都设有一家咖啡店,每家 ...

  3. Analysis of algorithms: introduction

    一系列的人物角色 Programmer,client,theoretician和blocking 学生可能会承担里面的一个或者多个角色 Running time 提出running time这个概念的 ...

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

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

  5. HtmlAgilityPack解析html文档

    一.概述 HtmlAgilityPack(以下简称HAP)是一个基于.Net的.第三方免费开源的微型类库,主要用于在服务器端解析html文档. HtmlAgilityPack为网页提供了标准的DOM ...

  6. Mac下安装SQLmap的安装

    1.cd /usr/bin/ 2.sudo git clone https://github.com/sqlmapproject/sqlmap.git sqlmap-dev3.重新打开terminal ...

  7. java singleton(单例设计模式)

    单例设计模式的主要作用是: 1.控制资源的使用,我们对资源使用线程同步来实现并发访问. 2.节约资源,我们对一个类只进行一个实例化进行全局的资源访问,节约了内存. 3.作为通信媒介,也是数据共享,可以 ...

  8. sleep() 和 wait() 区别是什么?

    sleep() 和 wait() 区别是什么? 1.每个对象都有一个锁来控制同步访问,Synchronized关键字可以和对象的锁交互,来实现同步方法或同步块.sleep()方法正在执行的线程主动让出 ...

  9. go socket 服务端处理多用户

    package main import ( "fmt" "net" "strings") func main() { listener, e ...

  10. Python高级编程和异步IO并发编程(笔记)

    一.魔法函数 # 例子 class Company(object): def __init__(self, employee_list): self.employee = employee_list ...