I am developing an application containing one screen with a button and circular progress bar. It will be filled according to the button press of the user. Means if the user presses one time then It will be filled a very little and so on. And if the user for example presses 900 times then it will be filled completely

Can I change the bar based on the value?

CodePudding user response：

Total progress is 1, so you can divide 1 by n(900 for your case) and then update the value. You can play with this widget.

class Test extends StatefulWidget {
  const Test({super.key});

  @override
  State<Test> createState() => _TestState();
}

class _TestState extends State<Test> {
  double currentCircleProgressValue = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          CircularProgressIndicator(
            value: currentCircleProgressValue,
          ),
          ElevatedButton(
            onPressed: () {
              const maxCount = 900;
              currentCircleProgressValue =
                  currentCircleProgressValue   (1 / maxCount);
              setState(() {});
            },
            child: Text("Tap to to progress"),
          ),
        ],
      ),
    );
  }
}

You can find more about CircularProgressIndicator