Flutter FAB

Flutter FAB (FloatingActionButton) 是 Flutter 框架中的一种常见的用户界面组件，通常作为页面中的主要/最主要操作的快捷方式。

模块：

• material.dart 包含了一个类MaterialButton，可以让你轻松创建一个按钮；
• floating_action_button.dart 包括 FloatingActionButton类需要实现浮动操作按钮 （Floating Action Button）。

代码示例

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter FAB'),
      ),
      body: Center(
        child: Text(
          'Flutter FAB - Floating Action Button',
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        tooltip: '顶端按钮',
        child: Icon(Icons.add),
      ),
    );
  }
}

参数

FloatingActionButton 中又许多自定义的参数，其中常用的有：

• onPressed:按钮被点击时回调；
• backgroundColor：设置按钮背景颜色；
• foregroundColor：块级文本的颜色；
• child：按钮中的Widget或Icon。

更多详情，请查看 官方文档。

结论

Flutter FAB （FloatingActionButton）是 Flutter 应用开发中一个重要的组件，你可以使用 Flutter FAB 按钮快速创建一个用户操作按钮。Flutter FAB 的参数丰富，可以轻松自定义按钮的外观和操作。