掩盖容器内的形状 Flutter答案

【问题标题】：Mask a shape inside a container Flutter掩盖容器内的形状 Flutter
【发布时间】：2021-10-24 04:45:15
【问题描述】：

我需要在容器内屏蔽一个椭圆，但它位于容器末端的右侧，使用 ClipRect 我无法移动形状。有人可以帮助我，最终的想法是这样的：

更新：现在我通过这样做得到了类似的结果：

Container(
        height: 80,
        width: 300,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(25),
          color: Colors.red,
        ),
        child: ClipRRect(
          clipBehavior: Clip.hardEdge,
          child: Padding(
            padding: const EdgeInsets.only(left: 250, bottom: 12,),
            child: OverflowBox(
              maxHeight: 100,
              maxWidth: 200,
              child: Center(
                child: Container(
                  decoration: BoxDecoration(
                    color: Colors.green,
                    shape: BoxShape.circle,
                  ),
                ),
              ),
            ),
          ),
        ),
      ),

The result

但现在边界半径消失了。

有人有其他想法吗？

【问题讨论】：

你需要发布一些代码
我已经更新了帖子

标签： android flutter dart mobile

【解决方案1】：

你好，我会做类似的事情


class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          width: 350,
          height: 80,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(20),
            child: LayoutBuilder(
              builder: (_, constrains) {
                return Stack(
                  children: [
                    Container(
                      width: constrains.maxWidth,
                      height: constrains.maxHeight,
                      color: Colors.blue,
                    ),
                    Positioned(
                      right: -50,
                      top: -60,
                      child: Container(
                        width: 140,
                        height: 140,
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          color: Colors.red,
                        ),
                      ),
                    ),
                    Center(
                      child: Text('Your Content Here'),
                    )
                  ],
                );
              },
            ),
          ),
        ),
      ),
    );
  }
}

当然，你必须玩弄尺寸之类的东西

【讨论】：