这段代码有什么问题,为什么控制器上的速度不起作用?- flutter

rmbxnbpk  于 2023-01-14  发布在  Flutter
关注(0)|答案(1)|浏览(131)

我遇到了这个代码的问题,动画控制器上的速度不起作用。当它必须从上一个值传递到下一个值时,它会使速度太快,我该如何解决它?它是一个径向计数器,当你添加一个任务时,它会计算一天中完成任务的百分比。

class RadialProgress extends StatefulWidget {

  final porcentaje;
  final Color colorprimario;
  final Color colorsecundario;
  final double grosorsecundario;
  final double grosorprimario;

  RadialProgress({
  @required this.porcentaje, 
  this.colorprimario = Colors.blue,
  this.colorsecundario = Colors.grey,
  this.grosorsecundario = 4, 
  this.grosorprimario = 10
  });

  @override
  _RadialProgressState createState() => _RadialProgressState();
  
}
double porcentaje;
class _RadialProgressState extends State<RadialProgress> with SingleTickerProviderStateMixin{

  AnimationController controller;
  double porcentajeAnterior;

 @override
  void initState() {
    
    porcentajeAnterior = widget.porcentaje;
    controller = new AnimationController(vsync: this, duration: Duration( milliseconds: 1000 ));

    super.initState();
  }

  @override
  void dispose() { 
    controller.dispose();
    super.dispose();
  }
  @override
  Widget build(BuildContext context) {
      controller.forward( from: 0.0 );
      final diferenciaAnimar = widget.porcentaje - porcentajeAnterior;
      porcentajeAnterior     = widget.porcentaje;

      return AnimatedBuilder(
        
        animation: controller,
        builder: (BuildContext context, Widget child) {
          return StreamBuilder<List<Todo>>(
            stream: DatabaseService().trueItems(),
            builder: (context, snapshot) {
              // List<Todo> trueitems = snapshot.data;
              if (!snapshot.hasData) return SizedBox();
              return Container(
              padding: EdgeInsets.all(10),
              width: double.infinity,
              height: double.infinity,
              child: StreamBuilder<List<Todo>>(
                stream: DatabaseService().listTodos(),
                builder: (context, snapshot) {
                  // List<Todo> listtodo = snapshot.data;
                  // final porcentaje = ((trueitems.length/listtodo.length)).toDouble();
                  return CustomPaint(
                    painter: _MiRadialProgress(
                      ( ((widget.porcentaje*100) - (diferenciaAnimar))) + (((diferenciaAnimar) * controller.value)),
                      widget.colorprimario,
                      widget.colorsecundario,
                      widget.grosorsecundario,
                      widget.grosorprimario)
                    );
                }
              ),
              // child: Text('${widget.porcentaje}'),
        );
            }
          );
        
         
        }
      );
      
  }
}

我把_miradialprogress代码,如果它可以帮助太多。谢谢!

class _MiRadialProgress extends CustomPainter{

    final porcentaje;
    final colorprimario;
    final colorsecundario;
    final double grosorsecundario;
    final double grosorprimario;

  _MiRadialProgress(
    
    this.porcentaje, 
    this.colorprimario,
    this.colorsecundario,
    this.grosorsecundario, 
    this.grosorprimario
    
    );
  @override
  void paint(Canvas canvas, Size size) {

    // Completed circle
      final paint = new Paint()
      ..strokeWidth = grosorsecundario
      ..color = colorsecundario
      ..style = PaintingStyle.stroke;

      final center = new Offset(size.width * 0.5, size.height * 0.5);
      final radio = min(size.width * 0.5, size.height * 0.5);

      canvas.drawCircle(center, radio, paint);

      //arc 
      final paintArco = new Paint()
      ..strokeWidth = grosorprimario
      ..color = colorprimario
      ..style = PaintingStyle.stroke;

      //part that have to be filled
      double arcAngle = 2* pi * (porcentaje / 100);
      canvas.drawArc(
        Rect.fromCircle(center: center, radius: radio), 
        -pi / 2 , 
        arcAngle, 
        false, 
        paintArco);
    }
  
    @override
    bool shouldRepaint(covariant CustomPainter oldDelegate)=> true;

}
kqlmhetl

kqlmhetl1#

你不应该把controller.forward( from: 0.0 );放在build方法里面,因为你会在每次re-render(build方法执行)的时候启动动画。可能是你的动画在渲染的时候又重新开始了,所以看起来好像它不工作。只要把动画启动代码放在initState方法里面:

@override
void initState() {
  super.initState();

  porcentajeAnterior = widget.porcentaje;
  controller = new AnimationController(vsync: this, duration: Duration( milliseconds: 1000 ));
  
  controller.forward();
}

相关问题