如何为Adobe动画CC动画之间进行通信“外”? [英] How to communicate 'externally' between Adobe Animate CC animations?

查看:523
本文介绍了如何为Adobe动画CC动画之间进行通信“外”?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是在HTML页面脚本,我试图控制我创建了动画的Adobe CC动画会发生什么。例如,在这里你会看到不工作,一个脚本试图告诉船动画的gotoAndPlay(5)。总之,该船舶动画不响应该。我猜是因为我不寻址/正确地命名。帮我跟我的动画。请参阅下面的code。

 <!DOCTYPE HTML>
< HTML和GT;
< HEAD>
<间的charset =UTF-8>
<标题>让搭腔< /标题>
&所述; SCRIPT SRC =HTTP://$c$c.createjs.com/easeljs-0.8.1.min.js>&下; /脚本>
&所述; SCRIPT SRC =HTTP://$c$c.createjs.com/tweenjs-0.6.1.min.js>&下; /脚本>
&所述; SCRIPT SRC =HTTP://$c$c.createjs.com/movieclip-0.8.1.min.js>&下; /脚本>
&所述; SCRIPT SRC =ship.js>&下; /脚本>
&所述; SCRIPT SRC =car.js>&下; /脚本><脚本>
功能的init(){    VAR帆布,舞台,exportRoot;    画布=的document.getElementById(canvas_ship);
    exportRoot =新libs_ship.ship();    舞台=新createjs.Stage(画布);
    stage.addChild(exportRoot);
    stage.update();    createjs.Ticker.setFPS(libs_ship.properties.fps);
    createjs.Ticker.addEventListener(嘀,舞台);
    画布=的document.getElementById(canvas_car);
    exportRoot =新libs_car.car();    舞台=新createjs.Stage(画布);
    stage.addChild(exportRoot);
    stage.update();    createjs.Ticker.setFPS(libs_car.properties.fps);
    createjs.Ticker.addEventListener(嘀,舞台);
}功能Tell_Canvas_Ship_to_gotoAndPlay5(){
    canvas_ship.gotoAndPlay(5);
}< / SCRIPT>
< /头><身体的onload =的init();风格=背景色:#D4D4D4>
    <帆布ID =canvas_shipWIDTH =300HEIGHT =250的风格=背景颜色:#FFFFFF>< /帆布>
    <帆布ID =canvas_carWIDTH =300HEIGHT =250的风格=背景颜色:#FFFFFF>< /帆布>
< /身体GT;
< / HTML>


解决方案

我收到的帮助,现在将共享答案。不用谢。只是邀请我在吃早餐的某个时候。

在Adobe动画,你需要更改库命名空间(在发布设置中的高级选项卡,我认为),以lib_jerry或者你拿出...只要它比其他动画不同的任何自定义名称。然后,只需按照此code中的设置。您可以从动画动画中调用的函数。

 <!DOCTYPE HTML>
< HTML和GT;
< HEAD>
<间的charset =UTF-8>
<标题>集装箱< /标题><脚本SRC =HTTPS://$c$c.createjs.com/createjs-2015.11.26.min.js>< / SCRIPT>
&所述; SCRIPT SRC =tommy.js>&下; /脚本>
&所述; SCRIPT SRC =jerry.js>&下; /脚本>
<脚本>VAR帆布,舞台,TomTom公司,jerjer;
功能的init(){    VAR exportRoot;    //汤米
    画布=的document.getElementById(canvas_tommy);    TomTom公司=新lib_tommy.tommy();
    舞台=新createjs.Stage(画布);
    stage.addChild(手鼓);
    stage.update();    createjs.Ticker.setFPS(lib_tommy.properties.fps);
    createjs.Ticker.addEventListener(嘀,舞台);
    //杰里
    画布=的document.getElementById(canvas_jerry);    jerjer =新lib_jerry.jerry();    舞台=新createjs.Stage(画布);
    stage.addChild(jerjer);
    stage.update();    createjs.Ticker.setFPS(lib_jerry.properties.fps);
    createjs.Ticker.addEventListener(嘀,舞台);}功能button_from_tommy_was_clicked(){
    tomtom.gotoAndPlay(5);
}功能button_from_jerry_was_clicked(){
    jerjer.gotoAndPlay(5);
}< / SCRIPT>< /头>
<身体的onload =的init();风格=背景色:#D4D4D4;保证金:0像素;>
    <帆布ID =canvas_tommyWIDTH =970HEIGHT =90的风格=背景颜色:#727272>< /帆布>
    <帆布ID =canvas_jerryWIDTH =970HEIGHT =90的风格=背景颜色:#727272>< /帆布>
< /身体GT;
< / HTML>

From the script in the html page, I'm trying to control what happens in the Adobe Animate CC animations I've created. For example, here you'll see a script that doesn't work that's trying to tell the ship animation to gotoAndPlay(5). Anyhow, the ship animation is not responding to that. I'm guessing it's because I'm not addressing/naming it correctly. Help me talk to my animations. See the code below.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Lets talk to each other</title>


<script src="http://code.createjs.com/easeljs-0.8.1.min.js"></script>
<script src="http://code.createjs.com/tweenjs-0.6.1.min.js"></script>
<script src="http://code.createjs.com/movieclip-0.8.1.min.js"></script>
<script src="ship.js"></script>
<script src="car.js"></script>

<script>
function init () {

    var canvas, stage, exportRoot;

    canvas = document.getElementById("canvas_ship");
    exportRoot = new libs_ship.ship();

    stage = new createjs.Stage(canvas);
    stage.addChild(exportRoot);
    stage.update();

    createjs.Ticker.setFPS(libs_ship.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);


    canvas = document.getElementById("canvas_car");
    exportRoot = new libs_car.car();

    stage = new createjs.Stage(canvas);
    stage.addChild(exportRoot);
    stage.update();

    createjs.Ticker.setFPS(libs_car.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);
}

function Tell_Canvas_Ship_to_gotoAndPlay5(){
    canvas_ship.gotoAndPlay(5);
}

</script>
</head>

<body onload="init();" style="background-color:#D4D4D4">
    <canvas id="canvas_ship" width="300" height="250" style="background-color:#FFFFFF"></canvas>
    <canvas id="canvas_car" width="300" height="250" style="background-color:#FFFFFF"></canvas>
</body>
</html>

解决方案

I've received help and will now share the answer. You are welcome. Just invite me over for breakfast sometime.

In Adobe Animate, you'll need to change the library namespace (in the Publish settings in the Advanced tab I think) to lib_jerry or whatever custom name you come up with... so long as it's different than the other animation. Then just follow the setup in this code. You can call the functions from within the Animate animations.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Container</title>

<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
<script src="tommy.js"></script>
<script src="jerry.js"></script>
<script>

var canvas, stage, tomtom, jerjer;
function init() {

    var exportRoot;

    //Tommy
    canvas = document.getElementById("canvas_tommy");

    tomtom = new lib_tommy.tommy();
    stage = new createjs.Stage(canvas);
    stage.addChild(tomtom);
    stage.update();

    createjs.Ticker.setFPS(lib_tommy.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);


    //Jerry
    canvas = document.getElementById("canvas_jerry");

    jerjer = new lib_jerry.jerry();

    stage = new createjs.Stage(canvas);
    stage.addChild(jerjer);
    stage.update();

    createjs.Ticker.setFPS(lib_jerry.properties.fps);
    createjs.Ticker.addEventListener("tick", stage);

}

function button_from_tommy_was_clicked(){   
    tomtom.gotoAndPlay(5);
}

function button_from_jerry_was_clicked(){   
    jerjer.gotoAndPlay(5);
}

</script>

</head>
<body onload="init();" style="background-color:#D4D4D4;margin:0px;">
    <canvas id="canvas_tommy" width="970" height="90" style="background-color:#727272"></canvas>
    <canvas id="canvas_jerry" width="970" height="90" style="background-color:#727272"></canvas>
</body>
</html>

这篇关于如何为Adobe动画CC动画之间进行通信“外”?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆