动画事件的霓虹动画结束？

Question

我用聚合物构建了一个小型 Web 应用程序，并使用了霓虹灯动画。我想在特定动画（例如英雄动画和涟漪动画）的自动测试中测量 fps。 neon-animation中是否有animationEnd事件，或者如何判断动画结束？

Answer 1

在neon-animation-runner-behavior中，当动画完成时，触发事件neon-animation-finish。您可以为此在您的元素中添加一个 listener，这将在触发事件时调用一个函数。例如：

<script>
  Polymer({
    is: "my-animated-element",
    behaviors: [
      Polymer.NeonAnimationRunnerBehavior
    ],
    properties: {
      animationConfig: {
        value: function () {
          // config here
        }
      }
    },
    listeners: {
      'neon-animation-finish': '_onNeonAnimationFinish'
    },
    _onNeonAnimationFinish: function () {
      alert("animation finished!");
    }
  });
</script>

有关如何使用 neon-animation 元素的更多信息，请参阅 this 精彩视频。

动画事件的霓虹动画结束？

Neon animation end of animation event?

javascript

web-component

css-animations

polymer