提问人：Innomalist 提问时间：11/13/2023 最后编辑：Innomalist 更新时间：11/13/2023 访问量：37
在列中重叠 flutter widget
Overlapping flutter widgets in a column
问：
我有一列，顶部有一张展开的地图，底部有一张卡片，显示一些信息。这张卡有一个边框半径，所以如果不做任何改动，我会在卡的角落周围有一个令人不快的空白区域：
我目前的解决方案是将地图放在 Transform.scale 中，这是一种覆盖该空间的黑客方法。我想知道是否有更优选的解决方案？
我尝试使用堆栈，但我的堆栈问题是，如果我的卡片大小发生变化，那么定位的地图必须知道该更改才能相应地调整其底部，从而导致代码混乱。
编辑： 这是我目前的解决方案，我正在寻找一种改进的方法。
Column(
children: [
Transform.scale(
scale: 1.1,
child: MapView(),
),
const Card()
],
)
答：
0赞
Nouman Iqbal
11/13/2023
#1
它的解决方案是 CLipRRect 和 Stack 小部件。ClipRRect 有点难以理解，但如果你这样做了，你可以解决这个问题
Column(
children: [
Expanded(
child: MapView(),
),
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0), // Adjust the values as needed
topRight: Radius.circular(20.0),
),
child: Container(
color: Colors.white, // You can set the background color if needed
child: const Card(), // Your card widget
),
),
],
)
评论
0赞
Innomalist
11/13/2023
ClipRRect 确实添加了边框半径，但我在这里寻找的是地图将在卡片下方放置大约 20 像素，因此圆角周围的空白区域将被地图填充。建议的代码段无法实现这一点。
评论