Animate Radial Menu

controller = ToggleController( vsync: this, animationDuration: const Duration(milliseconds: 1200)); 
class ProgressCircleClipper extends CustomClipper<Rect> {  
final double currentProgress; ProgressCircleClipper({this.currentProgress});
@override
Rect getClip(Size size) {
// getting point of origin for our angle
final pointStart = Offset(size.width, size.height);
// calculate our angle
double theta = atan(pointStart.dy / pointStart.dx);
// radius
final topmostEnd = pointStart.dy / sin(theta);
//calculating radius with animation progress
final radius = topmostEnd * currentProgress;
final diameter = 2 * radius;
return Rect.fromLTWH( pointStart.dx - topmostEnd , pointStart.dy - topmostEnd , diameter, diameter);
}
@override
bool shouldReclip(CustomClipper<Rect> oldClipper) {
return true;
}}
sin θ = Opposite Side/Hypotenuse.
cos θ = Adjacent Side/Hypotenuse.
tan θ = Opposite Side/Adjacent Side.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store