flutter :当我滚动时数据会越过曲线部分
flutter : data to go over the curve parts when I scroll
i post 两张图片,第一张看起来不错,但是当我滚动我的数据时,我的 ui 变得一团糟(第二张图片)
我希望它在滚动时位于曲线部分下方。
怎么做
这是我的代码
return Scaffold(
backgroundColor: appGreenColor,
appBar: new AppBar(
centerTitle: false,
backgroundColor: appGreenColor,
elevation: 0,
title: Padding(
padding: const EdgeInsets.only(left: 16.0),
child: Image.asset(
"lib/Assets/bellazIcon.png",
fit: BoxFit.fill,
height: 40,
width: 78,
),
),
actions: [
Padding(
padding: const EdgeInsets.only(right: 8.0),
child: IconButton(
icon: Image.asset(
"lib/Assets/notification1.png",
height: 22,
width: 22,
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NotificationList()));
}),
)
],
),
body: Container(
height: MediaQuery.of(context).size.height - 70,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30), topRight: Radius.circular(30))),
child: SingleChildScrollView(
child: Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 3),
child: Column(
children: [
locationView(),
imageSlider(),
genderView(),
categories(),
isMan == true
? maleTopBranches.length == 0
? Container()
: topRatedSalons(maleTopBranches)
: topRatedSalons(femaleTopBranches),
],
),
),
offerImage(),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 2.0),
child: Column(
children: [
services(),
nearByAppointment(),
],
),
),
infoImage()
],
),
),
),
);
这张图片在我不滚动之前看起来不错
但是当我滚动图像时,我的数据会出现在该曲线上
这个答案对我有用
添加:clipBehavior:Clip.hardEdge
Container(
clipBehavior: Clip.hardEdge,
height: MediaQuery.of(context).size.height - 70,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(30),
topRight: Radius.circular(30))),
child: ...,
),)
尝试添加:clipBehavior:Clip.hardEdge
Container(
clipBehavior: Clip.hardEdge,
height: MediaQuery.of(context).size.height - 70,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(30),
topRight: Radius.circular(30))),
child: ...,
),)
i post 两张图片,第一张看起来不错,但是当我滚动我的数据时,我的 ui 变得一团糟(第二张图片)
我希望它在滚动时位于曲线部分下方。
怎么做
这是我的代码
return Scaffold(
backgroundColor: appGreenColor,
appBar: new AppBar(
centerTitle: false,
backgroundColor: appGreenColor,
elevation: 0,
title: Padding(
padding: const EdgeInsets.only(left: 16.0),
child: Image.asset(
"lib/Assets/bellazIcon.png",
fit: BoxFit.fill,
height: 40,
width: 78,
),
),
actions: [
Padding(
padding: const EdgeInsets.only(right: 8.0),
child: IconButton(
icon: Image.asset(
"lib/Assets/notification1.png",
height: 22,
width: 22,
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NotificationList()));
}),
)
],
),
body: Container(
height: MediaQuery.of(context).size.height - 70,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30), topRight: Radius.circular(30))),
child: SingleChildScrollView(
child: Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 3),
child: Column(
children: [
locationView(),
imageSlider(),
genderView(),
categories(),
isMan == true
? maleTopBranches.length == 0
? Container()
: topRatedSalons(maleTopBranches)
: topRatedSalons(femaleTopBranches),
],
),
),
offerImage(),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 2.0),
child: Column(
children: [
services(),
nearByAppointment(),
],
),
),
infoImage()
],
),
),
),
);
这张图片在我不滚动之前看起来不错
但是当我滚动图像时,我的数据会出现在该曲线上
这个答案对我有用 添加:clipBehavior:Clip.hardEdge
Container(
clipBehavior: Clip.hardEdge,
height: MediaQuery.of(context).size.height - 70,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(30),
topRight: Radius.circular(30))),
child: ...,
),)
尝试添加:clipBehavior:Clip.hardEdge
Container(
clipBehavior: Clip.hardEdge,
height: MediaQuery.of(context).size.height - 70,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(topLeft: Radius.circular(30),
topRight: Radius.circular(30))),
child: ...,
),)