diegoveloper / flutter_percent_indicator

Flutter percent indicator library
BSD 2-Clause "Simplified" License
679 stars 206 forks source link

How to reload the animation on notify #132

Open Nico3652 opened 2 years ago

Nico3652 commented 2 years ago

First thanks for this great package. I'm using it a lot in my app.

In this use case, I want to implement a basic video recording animation, where the start-to-record action should trigger the circular animation, otherwise the circle should be always full (percent = 1)

Here is my code :

ValueListenableBuilder(
                    valueListenable: cameraViewModel.isRecording,
                    builder: (context, _, child) => AnimatedScale(
                          scale: cameraViewModel.isRecording.value ? 1.3 : 1,
                          duration: const Duration(
                            milliseconds: 200,
                          ),
                          child: CircularPercentIndicator(
                            radius: 70,
                            percent: 1,
                            circularStrokeCap: CircularStrokeCap.round,
                            lineWidth: 3,
                            startAngle: cameraViewModel.isRecording.value ? 0 : 90,
                            animation: cameraViewModel.isRecording.value
                                ? true
                                : false,
                            restartAnimation: cameraViewModel.isRecording.value
                                ? true
                                : false,
                            animationDuration:
                                cameraViewModel.isRecording.value ? 15000 : 0,
                            backgroundColor: Colors.white.withOpacity(0.3),
                            progressColor: Colors.white,
                            center: AnimatedContainer(
                              duration: const Duration(milliseconds: 250),
                              curve: Curves.decelerate,
                              width:
                                  cameraViewModel.isRecording.value ? 50 : 60,
                              height:
                                  cameraViewModel.isRecording.value ? 50 : 60,
                              child: Container(
                                decoration: BoxDecoration(
                                    gradient:
                                        ThemeProvider.instance.getGradientApp(),
                                    shape: BoxShape.circle),
                              ),
                            ),
                          ),
                        )
                )

The problem is the animation is never triggered with this logic . Looking into your class I can see that the animation controller call forward() in the initState() and also inside didUpdateWidget() according this condition :

if (oldWidget.percent != widget.percent ||
        oldWidget.startAngle != widget.startAngle)

In my case I'm not updating the percent because in both situation it must be 1 . Then I tried to fake the 'startAngle' change but nothing happen.

What I am suppose to do ? Going to be crazy sounds like I am missing something in global logic

Thanks in advance for any help

diegoveloper commented 2 years ago

PRs are welcome

AbirAhsan commented 2 years ago

Same issue here

ilyosbekkk commented 1 year ago

any updates on this issue?