我正在尝试用flutter开发一个移动应用程序。我添加了一个底部导航栏(谷歌的nav_bar)。一切都很完美,但是有白色的矩形背景的容器或导航条,我无法移除它。如果你能帮我,我会很高兴的。
这是我的密码:
class NavigationBarScreen extends StatefulWidget {
const NavigationBarScreen({Key? key}) : super(key: key);
@override
State<NavigationBarScreen> createState() => _NavigationBarScreenState();
}
class _NavigationBarScreenState extends State<NavigationBarScreen> {
@override
Widget build(BuildContext context) {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
PageController page_controller = PageController();
final vals = ['a', 'B', 'c', 'd'];
int _index = 0;
final screens = [LoginPage(), SignupPage()];
return Scaffold(
body: PageView.builder(
controller: page_controller,
itemCount: 4,
itemBuilder: (context, position) {
return Container(child: screens[position]);
}),
bottomNavigationBar: Padding(
padding: EdgeInsets.all(8),
child: ClipRRect(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(20.0),
topRight: Radius.circular(20.0),
),
child: Container(
decoration: const BoxDecoration(
//color: Color.fromRGBO(24, 233, 111, 0.35),
color: Color.fromRGBO(244, 91, 60, 0.35),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
child: GNav(
gap: 8,
curve: Curves.easeOutExpo,
// tab animation curves curve: Curves.fastOutSlowIn,
activeColor: Colors.black,
hoverColor: Colors.grey,
tabBorderRadius: 6,
onTabChange: (index) {
setState(() {
_index = index;
});
page_controller.jumpToPage(index);
},
duration: const Duration(milliseconds: 400),
color: const Color(0xEF5350FF),
tabs: const [
GButton(icon: Icons.home, text: "Mamma"),
GButton(icon: Icons.person, text: "Profile"),
GButton(icon: Icons.leaderboard, text: "Leaderboard"),
],
),
)),
));
}
}我想移除这个白色的矩形:

提前谢谢。
发布于 2022-06-28 13:00:37
尝试使用Container代替Padding,并将颜色设置为Colors.transparent,并在Scaffold中使用extendBody: true
https://stackoverflow.com/questions/72786712
复制相似问题