如何将Greensock的CustomEase函数转换为可在CreateJS的Tween系统中使用？

Question

我目前正在开发一个不包含GSAP（Greensock的JS Tweening库）的项目，但由于使用它的可视化编辑器创建自己的自定义缓动函数非常容易 - 我想知道是否有办法打破按下所需的缓动功能，以便可以在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...
}

（以下是此特定缓动方法的图形。）

Answer 1

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

然而，这对我自己的使用是公平的。因此，我认为，引导您并指出使其成为可能的资源是公平的。

原始代码（与CreateJS不直接兼容）可在此处找到： https://github.com/art0rz/gsap-customease/blob/master/CustomEase.js （看起来作者也被要求取消github上的回购 - 抱歉，如果这篇文章的其余内容完全没有意义的话！）< / p>

请注意，CreateJS的缓动方法仅采用“时间比率”值（而非time, start, end, duration，就像GSAP的缓动方法一样）。鉴于它从 0.0 （您的起始值）到 1.0 （您的结束值），您真正需要的时间比率。

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

<强>优化：

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

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

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

3）最后，我不确定为什么它是这样设计的，但你可以打开返回每个类的构造函数的s.e - s.s。也许它被用来捕获一些变量的范围，但我不明白为什么它不能包装整个事物而不是单独封装每个变量。

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