我试图在底部导航栏的中间添加一个 float Action 按钮。问题没有出现。这是问题的图片。
我的代码是这样的
import 'package:flutter/material.dart';
class MyHome extends StatefulWidget {
@override
_MyHomeState createState() => _MyHomeState();
}
class _MyHomeState extends State<MyHome> {
int _selectedTab = 0;
final _pageOptions = [
Text('Item 1'),
Text('Item 2'),
Text('Item 3'),
Text('Item 4'),
];
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primaryColor: Color(0xffFF5555),
),
home: Scaffold(
body: _pageOptions[_selectedTab],
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
floatingActionButton: FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add),
backgroundColor: Colors.red,
foregroundColor: Colors.white,
elevation: 2.0,
),
bottomNavigationBar: BottomAppBar(
notchMargin: 2.0,
shape: CircularNotchedRectangle(),
child: SizedBox(
height: 80,
child: Theme(
data: Theme.of(context).copyWith(
// sets the background color of the `BottomNavigationBar`
canvasColor: Color(0xff1B213B),
// sets the active color of the `BottomNavigationBar` if `Brightness` is light
primaryColor: Color(0xffFF5555),
textTheme: Theme.of(context)
.textTheme
.copyWith(caption: new TextStyle(color: Colors.white))),
child: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: _selectedTab,
onTap: (int index) {
setState(() {
_selectedTab = index;
});
},
fixedColor: Color(0xffFF5555),
items: [
BottomNavigationBarItem(
icon: Icon(Icons.tv), title: Text('')),
BottomNavigationBarItem(
icon: Icon(Icons.card_membership), title: Text('')),
BottomNavigationBarItem(
icon: Icon(Icons.share), title: Text('')),
BottomNavigationBarItem(
icon: Icon(Icons.home), title: Text('')),
],
),
),
),
),
),
);
}
}
我想在中间的红色fab图标周围添加缺口。我尝试了两种形状:CircularNotchedRectangle()和AutomaticNotchedShape方法。但是没有任何效果。大多数示例显示在“BottomAppBar”内使用“Row”。但是我想使用BottomNavigationBar。请帮我找到解决方案
最佳答案
在小部件BottomAppBar()中使用此属性clipBehavior: Clip.antiAlias,
关于android - 如何在带有缺口的底部导航栏中心添加 float Action 按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55727315/