CODEWITHSUNDEEP
actionscript-3flashactionscript
Flashdace
Flashdace

Reputation: 33

Actionscript hitTest drawing

I've gotten actions on a frame, what I'm trying to do is have a hitTest that triggers gotoAndStop(<lose frame>) when the shape I am drawing collides with the touchTest. The only issue I'm having is I cannot get the hitTest to register directly when the line hits it, it only registers after the next click event. The other issue I'm encountering is a hit box on the touchTest is many times larger than the actual image of the symbol.

var myshape:Shape;
myshape = new Shape();
myshape.graphics.lineStyle(5, 0xC807DE);
var alreadyDrawn:Shape;
alreadyDrawn = new Shape();

stage.addEventListener(MouseEvent.MOUSE_DOWN, activateDraw);
function activateDraw(event:MouseEvent):void
{
    myshape.graphics.moveTo(mouseX,mouseY);
    addChild(myshape);

    stage.addEventListener(MouseEvent.MOUSE_MOVE, lineDraw);
    stage.addEventListener(MouseEvent.MOUSE_UP, stopDraw);
}

function lineDraw(event:MouseEvent):void
{
    myshape.graphics.lineTo(mouseX,mouseY);
    checkIt();
}
function stopDraw(event:MouseEvent):void
{
    alreadyDrawn.graphics.copyFrom(myshape.graphics);
    stage.removeEventListener(MouseEvent.MOUSE_MOVE, lineDraw);
    stage.removeEventListener(MouseEvent.MOUSE_UP, stopDraw);
}

function checkIt()
{
    if (alreadyDrawn.hitTestObject(touchTest) == true)
    {
        trace("wall");
        myshape.graphics.clear();
        myshape.graphics.lineStyle(5, 0xC807DE);
        alreadyDrawn.graphics.clear(); // clear this too
        stopDraw(null); // stop active draw, if any
    }
}

Upvotes: 1

Views: 213

Answers (1)

Bennett Keller
Bennett Keller

Reputation: 1714

it only registers after the next click event

This is because the object you are testing the collision against alreadyDrawn doesn't have a collision area yet. You create the new shape, add your listeners, and test your collision in your lineDraw() using the method checkIt(), but the shape doesn't have a collision area until your mouse up function stopDraw() where it does alreadyDrawn.graphics.copyFrom(myshape.graphics);

So to fix this you would have to create the graphics object earlier. The change could look something like this (at the top):

var alreadyDrawn:Shape = new Shape();
alreadyDrawn.graphics.copyFrom(myshape.graphics);

That would give a collision area to test against in checkIt()

The other issue I'm encountering is a hit box on the touchTest is many times larger than the actual image of the symbol.

For this issue, you can access the clip or a symbol inside it and grab its bounds relative to the parent of the alreadyDrawn shape. Then you can use the bounds of both shapes to test for a collision. This will give you a more accurate collision area for testing:

function checkIt()
{
    var alreadyDrawnBounds:Rectangle = alreadyDrawn.getBounds( alreadyDrawn.parent );
    var testBounds:Rectangle = touchTest.someSymbolName.getBounds( alreadyDrawn.parent );
    //could also try this instead:
    //var alreadyDrawnBounds:Rectangle = alreadyDrawn.getBounds( touchTest.parent );
    //var testBounds:Rectangle = touchTest.getBounds( touchTest );      

    if ( alreadyDrawnBounds.intersects( testBounds ) ) {
        trace("wall");
        myshape.graphics.clear();
        myshape.graphics.lineStyle(5, 0xC807DE);
        alreadyDrawn.graphics.clear(); // clear this too
        stopDraw(null); // stop active draw, if any
    }
}

Upvotes: 1

Related Questions