我试图用底部的应用栏和FAB创建一个webview应用。这是我的home.dart代码
class _HomeState extends State<Home> {
// Properties & Variables needed
int currentTab = 0; // to keep track of active tab index
final List<Widget> screens = [
Dashboard(),
Profile(),
]; // to store nested tabs
final PageStorageBucket bucket = PageStorageBucket();
Widget currentScreen = Dashboard(); // Our first view in viewport
@override
Widget build(BuildContext context) {
return Scaffold(
floatingActionButton: FloatingActionButton(
child: Icon(
Icons.home,
color: currentTab == 0 ? Colors.white : Colors.black26,
),
onPressed: () {
setState(() {
currentScreen =
Dashboard(); // if user taps on this dashboard tab will be active
currentTab = 0;
});
},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: BottomAppBar(
shape: CircularNotchedRectangle(),
notchMargin: 10,
child: Container(
height: 60,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
MaterialButton(
minWidth: 40,
onPressed: () {
setState(() {
currentScreen =
Chat(); // if user taps on this dashboard tab will be active
currentTab = 1;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.chat_bubble,
color: currentTab == 1 ? Colors.orange : Colors.black26,
),
Text(
'Chats',
style: TextStyle(
color:
currentTab == 1 ? Colors.orange : Colors.black26,
),
),
],
),
)
],
),
// Right Tab bar icons
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
MaterialButton(
minWidth: 40,
onPressed: () {
setState(() {
currentScreen =
Profile(); // if user taps on this dashboard tab will be active
currentTab = 2;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(
Icons.branding_watermark,
color: currentTab == 2 ? Colors.orange : Colors.black26,
),
Text(
'Profile',
style: TextStyle(
color:
currentTab == 2 ? Colors.orange : Colors.black26,
),
),
],
),
),
],
)
],
),
),
),
body: PageStorage(
child: currentScreen,
bucket: bucket,
),
);
}
}
这是我的仪表板
class _DashboardState extends State<Dashboard> {
@override
Widget build(BuildContext context) {
return WebviewScaffold(
url: 'https://google.com',
);
}
}
结果是这样的
FAB应该位于webview小部件上方,无论我将FAB放在何处,它始终位于webview小部件之后。即使我将FAB代码放在主体窗口小部件上,但我在哪里做错了?
最佳答案
嘿,如果有人遇到此问题,我可以通过使用webview_flutter:0.2.0而不是flutter_webview_plugin:^ 0.3.10 + 1来解决它,并且我的应用程序可以像这样正常工作。
关于android - flutter 中的FAB在其他小部件后面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60086465/