四分之一圆形与颤动的容器答案

【问题标题】：Quarter circle shape with a container in flutter四分之一圆形与颤动的容器
【发布时间】：2018-08-05 00:30:57
【问题描述】：

我想要一个四分之一圆形的容器，想象一下整个披萨的四分之一。

我如何实现这一目标？基本上我想将它放在右下角的另一个容器的顶部，圆形部分朝内，并且使用堆栈小部件，当然角度与右下角形成底部容器的位置相匹配。

谢谢。

【问题讨论】：

【解决方案1】：

您可以使用CustomPainter 结合ClipRect 绘制一个圆圈并对其进行裁剪。

enum CircleAlignment {
  topLeft,
  topRight,
  bottomLeft,
  bottomRight,
}

class QuarterCircle extends StatelessWidget {
  final CircleAlignment circleAlignment;
  final Color color;

  const QuarterCircle({
    this.color = Colors.grey,
    this.circleAlignment = CircleAlignment.topLeft,
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox.expand(
      child: ClipRect(
        child: CustomPaint(
          painter: QuarterCirclePainter(
            circleAlignment: circleAlignment,
            color: color,
          ),
        ),
      ),
    );
  }
}

class QuarterCirclePainter extends CustomPainter {
  final CircleAlignment circleAlignment;
  final Color color;

  const QuarterCirclePainter({this.circleAlignment, this.color});

  @override
  void paint(Canvas canvas, Size size) {
    final radius = math.min(size.height, size.width);
    final offset = circleAlignment == CircleAlignment.topLeft
        ? Offset(.0, .0)
        : circleAlignment == CircleAlignment.topRight
            ? Offset(size.width, .0)
            : circleAlignment == CircleAlignment.bottomLeft
                ? Offset(.0, size.height)
                : Offset(size.width, size.height);
    canvas.drawCircle(offset, radius, Paint()..color = color);
  }

  @override
  bool shouldRepaint(QuarterCirclePainter oldDelegate) {
    return color == oldDelegate.color &&
        circleAlignment == oldDelegate.circleAlignment;
  }
}

你可以通过这样做来使用

QuarterCircle(
  circleAlignment: CircleAlignment.bottomLeft,
),

【讨论】：

在默认的颤振创建应用程序中测试了它，但我没有看到它出现在任何地方，我错过了什么吗？我把它放在柱子上，直接作为脚手架主体。
你需要给它一个大小。它不会神奇地知道您想要哪种尺寸。将其包装成 SizedBox 或其他任何东西
现在它工作了，请使用包装器编辑帖子，我将标记为已接受的答案。谢谢！
你这是什么意思？
在“您可以通过做”评论下方，将 QuarterCircle 包装在您建议的 SizedBox 中。