FloatingActionButton 是一個懸浮在內容上的圓形圖標按鈕,每個屏幕中最多使用一個浮動按鈕奥秆。
const FloatingActionButton({
Key key,
this.child,// 子組件 一般為Icon
this.tooltip,// 文字解釋,長按時顯示
this.foregroundColor,// 前景色
this.backgroundColor, // 背景色
this.heroTag = const _DefaultHeroTag(), // hero效果使用的tag,系統(tǒng)默認會給所有FAB使用同一個tag,方便做動畫效果
this.elevation = 6.0, // 未點擊時的陰影值
this.highlightElevation = 12.0, // 點擊時的陰影值
@required this.onPressed, // 點擊事件回調
this.mini = false, // 是否是 mini類型
this.shape = const CircleBorder(), // 設置shape時荐吉,默認的elevation將會失效,默認為CircleBorder
this.clipBehavior = Clip.none, //
this.materialTapTargetSize,
this.isExtended = false, // 是否為”extended”類型
})
class _MyHomeState extends State<_MyHome> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(title: Text("ToDoList")),
// 浮動按鈕
floatingActionButton: FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add),
),
);
}
}
FloatingActionButton.extended 創(chuàng)建一個類似足球場形狀的浮動按鈕对省,可同時存在label和icon蝗拿。不過label是必須的晾捏,icon是可選的蒿涎。
FloatingActionButton.extended({
Key key,
this.tooltip,
this.foregroundColor,
this.backgroundColor,
this.heroTag = const _DefaultHeroTag(),
this.elevation = 6.0,
this.highlightElevation = 12.0,
double disabledElevation,
@required this.onPressed,
this.shape = const StadiumBorder(),
this.isExtended = true,
this.materialTapTargetSize,
this.clipBehavior = Clip.none,
Widget icon,
@required Widget label,
})
class _MyHomeState extends State<_MyHome> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(title: Text("ToDoList")),
// 浮動按鈕 icon + label
floatingActionButton: FloatingActionButton.extended(
onPressed: () {},
label: Text("新增"),
icon: Icon(Icons.add),
),
);
}
}