Search code examples
flutterflutter-layout

Custom CircularProgressIndicator for Flutter

I'd like to make a custom CircularProgressIndicator to have gradient, elevation and rounded corners, but I couldn't find any libs with that ability. Could you please share your favourites or any workaround? It doesn't need to be animated, just a static progress bar to receive progress value and show it, example: Shadows, rounded corners and gradient

Solution

  • Try out this package:

    percent_indicator

    CircularPercentIndicator(
    radius: screenWidth / 4, 
    lineWidth: 5.0, 
    percent: 0.75, 
    center: new Text("75%", style: TextStyle(color: Color(0xFF535355))), 
    linearGradient: LinearGradient(begin: Alignment.topRight,end:Alignment.bottomLeft, colors: <Color>    [Color(0xFF1AB600),Color(0xFF6DD400)]),rotateLinearGradient: true, circularStrokeCap: CircularStrokeCap.round)