Skip to content

Latest commit

 

History

History
60 lines (44 loc) · 1.66 KB

FloatingActionButton.md

File metadata and controls

60 lines (44 loc) · 1.66 KB
title description type
FloatingActionButton
控件介绍
widgets

FloatingActionButton通常和Scaffold一起使用,在底部导航栏嵌入按钮。

基本用法如下:

Scaffold(
  floatingActionButton: FloatingActionButton(),
)

没有底部导航栏的位置如下:

加入底部导航栏:

Scaffold(
  floatingActionButton: FloatingActionButton(),
  bottomNavigationBar: BottomNavigationBar(
    items: [
      BottomNavigationBarItem(icon: Icon(Icons.person),title: Text('老孟')),
      BottomNavigationBarItem(icon: Icon(Icons.home),title: Text('程序员'))
    ],
  ),
)

效果如下:

设置按钮嵌入底部导航栏:

Scaffold(
  floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
  floatingActionButton: FloatingActionButton(),
  bottomNavigationBar: BottomNavigationBar(
    backgroundColor: Colors.yellow,
    items: [
      BottomNavigationBarItem(icon: Icon(Icons.person),title: Text('老孟')),
      BottomNavigationBarItem(icon: Icon(Icons.home),title: Text('程序员'))
    ],
  )
)

用法如下: