我一直在屏幕快照中附加的该UI上进行操作,其中底部的导航栏工作正常,但是我想知道如何使容器的边缘不可见。 ScreenShot的链接-> https://imgur.com/A1muODg
Widget build(BuildContext context) {
final ThemeData theme = Theme.of(context);
return Stack(
alignment: Alignment.topCenter,
children: <Widget>[
Container(
height: 65,
margin: EdgeInsets.only(top: 45), //This is causing the issue
decoration: BoxDecoration(
color: theme.bottomAppBarColor,
boxShadow: [
BoxShadow(
color: theme.highlightColor,
offset: Offset(0, -1),
blurRadius: 8),
],
),
child: Row(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
TabItem(
selected: currentSelected == 0,
iconData: Icons.home,
title: 'Home',
callbackFunction: () {
setState(() {
nextIcon = Icons.home;
currentSelected = 0;
});
_initAnimationAndStart(_positionAnimation.value, -1);
},
),
TabItem(
selected: currentSelected == 1,
iconData: Icons.search,
title: "Search",
callbackFunction: () {
setState(() {
nextIcon = Icons.search;
currentSelected = 1;
});
_initAnimationAndStart(_positionAnimation.value, 0);
}),
TabItem(
selected: currentSelected == 2,
iconData: Icons.settings,
title: "Settings",
callbackFunction: () {
setState(() {
nextIcon = Icons.person;
currentSelected = 2;
});
_initAnimationAndStart(_positionAnimation.value, 1);
}),
],
),
),
IgnorePointer(
child: Container(
decoration: BoxDecoration(color: Colors.transparent),
child: Align(
heightFactor: 1,
alignment: Alignment(_positionAnimation.value, 0),
child: FractionallySizedBox(
widthFactor: 1 / 3,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
SizedBox(
height: 90,
width: 90,
child: ClipRect(
clipper: HalfClipper(),
child: Container(
child: Center(
child: Container(
width: 70,
height: 70,
decoration: BoxDecoration(
color: theme.bottomAppBarColor,
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: theme.highlightColor,
blurRadius: 8)
])),
),
)),
),
SizedBox(
height: 70,
width: 90,
child: CustomPaint(
painter:
HalfPainter(canvasColor: theme.bottomAppBarColor),
)),
SizedBox(
height: 60,
width: 60,
child: Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: theme.cursorColor,
border: Border.all(
color: theme.cardColor,
width: 5,
style: BorderStyle.none)),
child: Padding(
padding: const EdgeInsets.all(0.0),
child: Opacity(
opacity: iconAlpha,
child: Icon(
activeIcon,
color: theme.bottomAppBarColor,
),
),
),
),
)
],
),
),
),
),
),
],
);
}
要使该用户界面整洁,以便使底部导航栏以外的所有内容都变高,并且不会干扰背景卡的布局