I want to draw the below shape for my app. I can draw circles but couldn't intersect them with a different color.
How can I do that?
I draw 2 circles but the intersection of them was not a different color.
CodePudding user response:
You can use Stack widget and use Positioned
widget to place circle.
final double circleRadius = 100;
final circle = Container(
height: circleRadius * 2,
width: circleRadius * 2,
decoration: ShapeDecoration(
shape: const CircleBorder(),
color: Colors.blue.withOpacity(.3),
),
);
And using with Stack
SizedBox(
width: circleRadius * 2,
height: circleRadius * 1.5,
child: Stack(
children: [
Positioned(
top: -circleRadius * .5,
left: -circleRadius,
child: circle,
),
Positioned(
top: -circleRadius,
child: circle,
),
// circle
],
),
),
Will give you
Tweak the size & color.