我正在开展 createjs 游戏,其中图片保存在容器内。我想将图像补间到屏幕上的某个位置,然后将图像切换到另一个图像。经过几秒钟后,我想从画布/屏幕中删除新图像。
目前,我已将(evt)传递给该功能,但其他游戏/示例都不会对此部分感到烦恼吗?
它在第一个.call函数中工作,但是我在.wait和第二个.call之后注释掉的部分不起作用。突然,TheThingBeingTweened
是undefined
?
任何正确方向的提示都应该有所帮助。
createjs.Tween
.get(inkContainer, {onChange: onInkContainerTweenChange})
.to({
y: playerContainer.y + (Math.random() * 200 - 100),
x: playerContainer.x + (Math.random() * 200)
}, 8000)
.call(function (evt) {
var theThingBeingTweened = evt.target;
//self.stage.removeChild(theThingBeingTweened);
var theContainer = theThingBeingTweened.parent;
theContainer.removeChild(theThingBeingTweened);
splatContainer = new createjs.Container();
splat = new
createjs.Bitmap(queue.getResult("splat"));
splatContainer.addChild(splat);
splatContainer.x = theThingBeingTweened.x;
splatContainer.y = theThingBeingTweened.y;
theContainer.addChild(splatContainer);
});
//.wait(3000)
//.call(function (evt) {
// var theThingBeingTweened = evt.target;
// self.stage.removeChild(theThingBeingTweened);
//});
答案 0 :(得分:1)
您还可以通过覆盖或添加属性来扩展您的对象
例如:
// It coud be instance or singleton it can knows everything to handle your issue
var imageHandler = new ImageHandlerClass();
Object.defineProperty(inkContainer, "imageHandler", { value:imageHandler , configurable: true, writable: true, enumerable: true });
createjs.Tween
.get(inkContainer)
.to({
y: playerContainer.y + (Math.random() * 200 - 100),
x: playerContainer.x + (Math.random() * 200)
}, 8000)
.call(function (evt) {
var linkToImageHandler = evt.target.imageHandler;
// Do something with image using imageHandler defined erlier
//...
});
当你有许多重复情况的事件控制器时,它非常有用。
答案 1 :(得分:0)
虽然theThingBeingTweened
为undefined
的确切原因尚不清楚,但您可以通过在调用链范围之外声明theThingBeingTweened
来轻松绕过此限制,然后不要在第二次调用中使用undefined
值重新初始化它。
var theThingBeingTweened;
createjs.Tween
.get(inkContainer, {onChange: onInkContainerTweenChange})
.to({
y: playerContainer.y + (Math.random() * 200 - 100),
x: playerContainer.x + (Math.random() * 200)
}, 8000)
.call(function (evt) {
theThingBeingTweened = evt.target;
//self.stage.removeChild(theThingBeingTweened);
var theContainer = theThingBeingTweened.parent;
theContainer.removeChild(theThingBeingTweened);
splatContainer = new createjs.Container();
splat = new
createjs.Bitmap(queue.getResult("splat"));
splatContainer.addChild(splat);
splatContainer.x = theThingBeingTweened.x;
splatContainer.y = theThingBeingTweened.y;
theContainer.addChild(splatContainer);
}).wait(3000).call(function (evt) {
self.stage.removeChild(theThingBeingTweened);
});
答案 2 :(得分:0)
call
方法不会导致调度事件。没有event
参数,因此没有event.target
。
相反,您可以将参数传递给调用方法(第二个参数)。
createjs.Tween
.get(inkContainer, {onChange: onInkContainerTweenChange})
.to({
y: playerContainer.y + (Math.random() * 200 - 100),
x: playerContainer.x + (Math.random() * 200)
}, 8000)
.call(function (thing) {
// The thing being tweened is the first argument
}, [inkContainer, otherArg], optionalScope);
请注意,如果 是一个事件,那么目标将是补间实例,而不是补间目标。当您使用addEventListener
或on
来支持Tweens事件时(这只是“更改”)就是这种情况。
http://www.createjs.com/docs/tweenjs/classes/Tween.html#event_change