0

我目前正在开发一个不包含 GSAP（Greensock 的 JS Tweening 库）的项目，但是由于使用它的可视化编辑器创建自己的自定义缓动函数非常容易 - 我想知道是否有办法分解所需的ease-function 以便可以在 CreateJS Tween 中重用？

例子：

var myEase = CustomEase.create("myCustomEase", [
    {s:0,cp:0.413,e:0.672},{s:0.672,cp:0.931,e:1.036},
    {s:1.036,cp:1.141,e:1.036},{s:1.036,cp:0.931,e:0.984},
    {s:0.984,cp:1.03699,e:1.004},{s:1.004,cp:0.971,e:0.988},
    {s:0.988,cp:1.00499,e:1}
]);

这样它就变成了这样的东西：

var myEase = function(t, b, c, d) {
    //Some magic algorithm performed on the 7 bezier/control points above...
}

（下面是这种特殊缓动方法的图表。） 在此处输入图像描述

4

1 回答 1

-1

我花时间移植和优化原来的基于 GSAP 的CustomEase类......但由于许可证限制/法律问题（基本上是一只我不想用棍子戳的灰熊......），发布移植的代码会违反它。

但是，这对我自己来说是公平的。因此，我相信我指导您并指出使之成为可能的资源是公平的。

原始代码（与 CreateJS 不直接兼容）可以在这里找到： https ://github.com/art0rz/gsap-customease/blob/master/CustomEase.js （看起来作者也被要求删除 repo on github - 如果这篇文章的其余部分毫无意义，对不起！）

请注意，CreateJS 的缓动方法只采用“时间比率”值（time, start, end, duration不像 GSAP 的缓动方法那样）。考虑到它从0.0（您的起始值）到1.0（您的最终值），这个时间比率确实是您所需要的。

稍加努力，您就可以从ease()方法中丢弃这些参数并修剪最终返回的表达式。

优化：

我采取了一些额外的步骤来优化上面的代码。

1）在构造函数中，您可以将segments.length值直接存储this.length在 CustomEase 实例的属性中，以减少ease()方法中访问器/属性查找的数量（在哪里qty设置）。

2) 每个段都有一些冗余计算，可以在该ease()方法中消除。例如，s.cp - s.sands.e - s.s操作可以预先计算并存储在每个 Segment 的几个属性中（在其构造函数中）。

3）最后，我不确定为什么要这样设计，但你可以解开function() {...}();那些为每个类返回构造函数的东西。也许它被用来捕获某些变量的范围，但我不明白为什么它不能包装整个事物而不是单独封装每个变量。

需要更多信息？发表评论！

于 2015-01-30T17:44:47.923 回答