时间戳

首页 > 解决方案 > 颤振动画列表视图元素不起作用

flutter - 颤振动画列表视图元素不起作用

问题描述

我正在尝试对容器进行发光效果。我正在使用 streambuilder 来构建列表项目，当项目价格发生变化时，我想显示容器发光效果。到目前为止，我已经这样做了，但小部件根本没有显示效果。didUpdateWidget 不显示任何更新，并且当它显示时，所有列表视图项都会以无限时间为自己设置动画。有什么我想念的吗？

 AnimationController _animationController;
  @override
  void initState() {
    super.initState();
    _animationController = new AnimationController(
        vsync: this, duration: new Duration(milliseconds: 500));
  }

  @override
  void didUpdateWidget(CustomContainer oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.price != widget.price) {
      print("changed");
      _animationController.repeat(
          reverse: true, period: Duration(milliseconds: 1000));
    }
  }

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }
@override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
        animation: _animationController,
        builder: (context, _) {
          return Container(
            height:100,
            width:double.infinity,
            decoration: BoxDecoration(
              color: Theme.of(context).canvasColor,
              borderRadius: BorderRadius.circular(10),
              boxShadow: [
                BoxShadow(
                  blurRadius: 4 * _animationController.value,
                  color: primaryColor.withOpacity(0.7),
                ),
              ],
            ),
          );
        });

标签： flutterdart

解决方案

AnimationController.repeat()将开始运行动画并无限次重复。这就是为什么这些项目会无限地为自己设置动画。您将不得不使用.forward方法：

_animationController = AnimationController(
  duration: Duration(milliseconds: 500),
  vsync: this);

_animationController.forward(); //tell the animation to start without repeating

来自颤振文档：

AnimationController 是一个特殊的 Animation 对象，它在硬件准备好接收新帧时生成一个新值。默认情况下，AnimationController 在给定的持续时间内线性生成从 0.0 到 1.0 的数字。

AnimationController 派生自 Animation，因此可以在需要 Animation 对象的任何地方使用。然而，AnimationController 有额外的方法来控制动画。例如，您使用 .forward() 方法启动动画。数字的生成与屏幕刷新有关，因此通常每秒生成 60 个数字。每个数字生成后，每个 Animation 对象都会调用附加的 Listener 对象。要为每个孩子创建自定义显示列表，请参阅RepaintBoundary。

这是文档AnimationController.forward()：https ://api.flutter.dev/flutter/animation/AnimationController/forward.html

推荐阅读