如何在flutter中向谷歌地图添加边框半径？

Question

我将谷歌地图小部件添加到具有边框半径的容器中，但谷歌地图的角不是圆角的。

Container(
            height: 100,
            width: double.infinity,
            margin: EdgeInsets.only(left: 30, right: 30),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(30),
              border: Border.all(
                style: BorderStyle.solid,
              ),
            ),
            child: GoogleMap(),)

Answer 1

可能是一个昂贵的解决方案，但您可以使用

ClipRRect

。像这样的东西：

Widget build(BuildContext context) {
    return Center(
      child: ClipRRect(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(30),
          topRight: Radius.circular(30),
          bottomRight: Radius.circular(30),
          bottomLeft: Radius.circular(30),
        ),
        child: Align(
          alignment: Alignment.bottomRight,
          heightFactor: 0.3,
          widthFactor: 2.5,
          child: GoogleMap(),
        ),
      ),
    );
  }

Answer 2

请记住，

google_maps_flutter

插件只是开发者预览版。我确信在发布 1.0 版本之前还会添加更多工作。因此，不要过分强调缺少的功能。归档票据。 :)

Answer 3

Padding(
  padding: EdgeInsets.all(20.sp),
  child: SizedBox(
    width: 100.w,
    height: 30.h,
    child: ClipRRect(
      borderRadius: BorderRadius.all(Radius.circular(30)),
      child: GoogleMap(),
    ),
  )
),