Flutter：光滑圆角

Question

我想知道如何在 Flutter 中制作一个光滑的圆角。 我找到了与 iOS 方法类似的链接 - swift 中的平滑圆角，但它并没有帮助我找到 Flutter 方法的解决方案。 我认为ContinuousRectangleBorder是一种方式，但它不是我正在寻找的形状。 我认为某种理发器应该可以工作。

Answer 1

我发布了一个可能对您有所帮助的专用 package： figma_squircle 。

Container(
    height: 100,
    width: 100,
    decoration: ShapeDecoration(
        color: Colors.red.withOpacity(0.75),
        shape: SmoothRectangleBorder(
            borderRadius: SmoothBorderRadius(
              cornerRadius: 10,
              cornerSmoothing: 0.5,
            ),
        ),
    ),
)

Answer 2

Flutter 没有自然的方法可以做到这一点。 如果您真的想完成此操作，请使用您的文章中使用的技术，您可以使用带有Stack小部件的圆形覆盖正方形。 如下所示：

Stack(children: [
          Container(
              height: 100,
              width: 100,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.amber,
              )),
          Container(
            height: 100,
            width: 100,
            decoration: BoxDecoration(
              color: Colors.amber,
              borderRadius: BorderRadius.all(Radius.circular(16)),
            ),
          ),
        ]),

这将创建一个正方形，如下所示：

您可能需要弄乱正方形和圆形的高度和宽度，但您明白了。

Answer 3

你可以试试下面的代码

ClipRRect(
borderRadius:
      BorderRadius.circular(15.0),
child: // Your widget that needs to be rounded.
)

有关更多信息，您可以查看此参考视频