I'm trying to create a custom progress bar that I want to have animate from 0 to the assigned value every time the page loads.
Here is the stateful widget:
import 'package:flutter/material.dart';
import 'package:new_platform/constants.dart';
class ProgressBarWidget extends StatefulWidget {
final max;
final val;
ProgressBarWidget(this.max, this.val);
@override
_ProgressBarWidgetState createState() => _ProgressBarWidgetState();
}
class _ProgressBarWidgetState extends State<ProgressBarWidget> {
var height;
@override
void initState() {
// TODO: implement initState
super.initState();
height = widget.val;
}
@override
Widget build(BuildContext context) {
// TODO: implement build
height = widget.val;
Widget stack = Container(
margin: EdgeInsets.all(90.0),
child: Stack(
alignment: Alignment.centerLeft,
children: <Widget>[
Container(
//background
decoration: BoxDecoration(
color: Color(0xFFE8F0F0),
borderRadius: BorderRadius.circular(30.0)),
height: 5,
width: 100,
),
AnimatedContainer(
foregroundDecoration: BoxDecoration(
borderRadius: BorderRadius.circular(30.0),
gradient: COOL_PURPLE_BLUE_GRADIENT,
boxShadow: [
BoxShadow(
color: THEME_BLUE,
spreadRadius: -1,
offset: Offset(0, 0),
blurRadius: 5)
]),
duration: Duration(milliseconds:800 ),
//foregroundS
curve: Curves.decelerate,
height: 7,
width: height,
)
],
),
);
return stack;
}
}
Is it possible to delay the animation of the AnimatedContainer or do I have to use something else to achieve the desired effect.
Im still new to flutter so any help is appreciated.
AnimatedController
AnimatedContainer
in the prev comment)