I am trying to add a border radius to a LinearProgressIndicator
in Flutter.
When I replace the LinearProgressIndicator
with another widget (e.g. Text
) in the code below, it works, as expected.
Container(
decoration: new BoxDecoration(
borderRadius:
new BorderRadius.all(const Radius.circular(20.0))),
child: LinearProgressIndicator(
value: _time,
),
)
1) Using Widget
Container(
margin: EdgeInsets.symmetric(vertical: 20),
width: 300,
height: 20,
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(10)),
child: LinearProgressIndicator(
value: 0.7,
valueColor: AlwaysStoppedAnimation<Color>(Color(0xff00ff00)),
backgroundColor: Color(0xffD6D6D6),
),
),
)
2) Using dependency
List of different types indicator https://pub.dev/packages/percent_indicator
Try this template code
child: Padding(
padding: EdgeInsets.all(15.0),
child: LinearPercentIndicator(
width: MediaQuery.of(context).size.width - 50,
animation: true,
lineHeight: 20.0,
animationDuration: 2000,
percent: 0.9,
linearStrokeCap: LinearStrokeCap.roundAll,
progressColor: Colors.greenAccent,
),
)