Skip to main content
C
cbunbury20
Inspiring
February 2, 2017
Answered

collisions hitTest() animate 2017

  • February 2, 2017
  • 2 replies
  • 7965 views

First i want to say the adobe animate team has done a great job to rework a tool that exported this kind of interactivity in swf now in html5 I was a big user and fan of AS2 and was never a fan of AS3 and suffer greattlly with the whole flash funerall process and all that, but to be able to recicle all those habilities that where in the droor for 4 or 5 years? it fells awesome to use and fell flash as best interactive animation for the web again!

I have badder with these issue before, and been pointed by mr Skinner to tutto on his site, and found some others, but always something that was above my code level of understanding cous i an one of those with more graphic desing and anim bck plus had bad math teachers mostlly in other words i need something more simple like in the AS2 times (actionscript 2) wich was:

if(yourhero.hitTest(enemy1)){

    hero.gotoAndPlay("herosdied")

}

other two objects any movie clips on your stage

if(enemy2.hitTest(enemy3)){

   enemy1.gotoAndPlay("bounceanim")

   enemy2.gotoAndPlay("bounceanim")

}

in most game makers, construct2, buildbox, defold, unity its something similar super simple, even in free html5 libraries like enchant,js its as simple as these:

   Apple.intersect(Enemy);

would acomplish the same job very efficientlly.

I seen the flappy birds demo, wich its very good, but it gets complex cous theres lots of functions interacting together, i would need just a simple tutorial for "hodors"(got) with 2 movieclips on esene, moving movie clip with button on stage or mouseclic into a colliding path, then alert("collision success") this would send me upong the sky!!

but i have search and only found big game tutorials, where i cant quite understand or implement.

thank you very much for your attention have a great end of week!

    This topic has been closed for replies.
    Correct answer kglad

    are you creating an html5/canvas project?

    if yes, EaselJS Tutorial: Using hitTest

    if no, you can use the hitTestObject of as3 like you used the as2 hitTest

    2 replies

    markr17328370
    markr17328370
    New Participant
    February 24, 2018

    Here is an example code for Adobe Animate CC that incorporates 6 drag able items, and 2 drop areas.  This also works when the canvas is set to responsive.  It should be easy enough to cannibalize this into whatever is needed between drag and drop and collision detection / hit test. 

    this.block1.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.block2.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.block3.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.block4.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.block5.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.block6.on("pressmove", function (evt) {

    var p = stage.globalToLocal(evt.stageX, evt.stageY);

    evt.currentTarget.x = p.x;

    evt.currentTarget.y = p.y;

    });

    this.on("tick", update.bind(this));

    function update() {

    var b1 = this.block1.localToLocal(100, 0, this.frontAnswerDrop);

    var b2 = this.block2.localToLocal(100, 0, this.frontAnswerDrop);

    var b3 = this.block3.localToLocal(100, 0, this.frontAnswerDrop);

    var b4 = this.block4.localToLocal(100, 0, this.backAnswerDrop);

    var b5 = this.block5.localToLocal(100, 0, this.backAnswerDrop);

    var b6 = this.block6.localToLocal(100, 0, this.backAnswerDrop);

    if (this.frontAnswerDrop.hitTest(b1.x, b1.y)) {

    console.log("b1 collided");

    }

    if (this.frontAnswerDrop.hitTest(b2.x, b2.y)) {

    console.log("b2 collided");

    }

    if (this.frontAnswerDrop.hitTest(b3.x, b3.y)) {

    console.log("b3 collided");

    }

    if (this.backAnswerDrop.hitTest(b4.x, b4.y)) {

    console.log("b4 collided");

    }

    if (this.backAnswerDrop.hitTest(b5.x, b5.y)) {

    console.log("b5 collided");

    }

    if (this.backAnswerDrop.hitTest(b6.x, b6.y)) {

    console.log("b6 collided");

    }

    }

    kglad
    kgladCorrect answer
    Braniac
    February 2, 2017

    are you creating an html5/canvas project?

    if yes, EaselJS Tutorial: Using hitTest

    if no, you can use the hitTestObject of as3 like you used the as2 hitTest

    C
    cbunbury20Author
    Inspiring
    February 2, 2017

    hello thank you very much, but there is not a fla file, i am the kind who always used a multimedia app, toolbook, flash, construct, director, thats the pipeline i am familiar with, i could never do well in the javascript file with html file, so i loved edge animate and now getting back into adobe animate, i can do a lot back from the swf times, now on the canvas, but this tutorial is using shaps, that its creating all with code, so in other words i am and old flasher who is looking into a tutorial for these, in the .fla format, in the flash enviroment, because, i can implement it, on the fla with movieclips and timelines, i would not know how to apply that code to stuff i create in the adobe animate GUI, maybe i am too dumb for these but i am searching, tyvm

    kglad
    kglad
    Braniac
    February 2, 2017

    are you going to use adobe animate?

    if so, will you be creating an html5/canvas project?

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices