视差 滑动 长影片剪辑 动画 CC 和 TweenJs

Question

我正在Animate CC中创建一个滑动影片剪辑。我有一个 19200 像素宽的影片剪辑。单击右箭头时，如何将影片剪辑 1920 向左吐温，在单击向左箭头时向右吐温相同的影片剪辑 1920？

以下是我目前在 Animate CC HTML5 Canvas 中拥有的内容：

/* Mouse Click Event
Clicking on the specified symbol instance executes a function in which you can add your own custom code.
*/
this.next.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler()
{
createjs.Tween.get(this.movieClip_1).to({x:-1920}, 500, Ease.getPowIn(2.2))
}
this.prev.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler()
{
createjs.Tween.get(this.movieClip_1).to({x:1920}, 500, Ease.getPowIn(2.2))
}

Answer 1

1(在你的代码中，你有两个名字相同的函数，但里面的代码不同。在侦听器添加代码上指定相同的名称。因此，两个侦听器将仅链接到其中一个函数(特别是第二个函数，因为是最后一个声明的函数(。

this.next.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler()
{
/* Code */
}
this.prev.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler()
{
/* Code */
}

要解决这个问题，更改两个函数的名称就足够了。当然，您必须更改侦听器添加代码中的名称。

下一个鼠标点击处理程序((

this.next.addEventListener("click", nextMouseClickHandler.bind(this));
function nextMouseClickHandler() {
/* Code */
}

上一页鼠标点击处理程序((

this.prev.addEventListener("click", prevMouseClickHandler.bind(this));
function prevMouseClickHandler() {
/* Code */ 
}

2(在两个函数中补间的to方法上，在ease参数中，在指定缓动之前，您需要添加createjs：

Tween in nextMouseClickHandler((

createjs.Tween.get(this.movieClip_1).to({x:-1920}, 500, createjs.Ease.getPowIn(2.2));

Tween in prevMouseClickHandler((

createjs.Tween.get(this.movieClip_1).to({x:1920}, 500, createjs.Ease.getPowIn(2.2));

解决这两个问题将生成以下代码：

this.next.addEventListener("click", nextMouseClickHandler.bind(this));
function nextMouseClickHandler() {
createjs.Tween.get(this.movieClip_1).to({x:-1920}, 500, createjs.Ease.getPowIn(2.2));
}
this.prev.addEventListener("click", prevMouseClickHandler.bind(this));
function prevMouseClickHandler() {
createjs.Tween.get(this.movieClip_1).to({x:1920}, 500, createjs.Ease.getPowIn(2.2));
}

此代码在 Animate CC 中工作，复制您指定的影片剪辑名称。