How to use Flash hitTest() for adding interactivity

1. Create a new Flash document about 400x200. Insert three new layers. Name the layers actions, circle, square, text starting from the top.

2. In the first frame of the circle layer draw a green circle about 50x50. Double-click it to select both stroke and fill and choose Modify>>Convert to Symbol (F8). Set circleMC for the name, MovieClip as type and center to registration point as in the picture below:

3. In the first frame of the square layer draw an orange square about 60x60. Double-click it

to select both stroke and fill and choose Modify>>Convert to Symbol (F8). Set squareMC for

the name, MovieClip as type and center to registration point as in the picture below:

4. Now click the circle to select it and in the Properties panel type the instance name

circle_mc, set X: 20 and Y: 75. Click also the square and give it an instance name of

square_mc. Set for square_mc X: 300 and Y: 70.

5. Now go to the first frame of the text layer and make a click to select it. Select the

Text Tool (T) from the tool panel. In the Properties panel choose Dynamic Text for Text Type

drop-down list, Arial font, size 14, color black (#000000). Give it also an instance name

of hit_txt.

6. Great job! Now go in the first frame of the actions layer press F9 to open the Actions

panel and put in the following ActionScript code:

hit_txt.text="Not hit!";
circle_mc.onPress = function(){
startDrag(this, false, 25,25, 375, 175)
}

circle_mc.onRelease = circle_mc.onReleaseOutside = function(){
this.stopDrag();
if (circle_mc.hitTest(square_mc)){
hit_txt.text="Hit!"
}else{
hit_txt.text="Not hit!"
}
}

7. Test the movie (Ctrl+Enter). You will see that in the hit_txt is displayed Hit! if the

circle_mc overlaps square_mc, and Not hit! if not.

You need to Register in order to download the FLA file.

Subscribe now via RSS feed and get all the new tutorials

written by Kush , August 14, 2007

Can we remove hand impression on rollover effect
I want a normal cursor
Please Explain

written by AMS , September 02, 2007

How can we have multiple circles and multiple squares. Trying to use this as a drag and drop rating system. So, the circle could be dropped into any square to be 'rated'.

written by I. hari Kiran , September 05, 2007

action scripting used in creating web designing and creating own and new animations. Tutorials and projects for Flash.


and

DreamWeaver tutorials, creating web pages and scripting such as using HTML and CSS for creating web pages and their application

written by Bob Dole , October 04, 2007

I need to know how to make a hit test for a key-controlled object. Help?

written by daniel tilley , October 15, 2007

""I need to know how to make a hit test for a key-controlled object. Help? ""

yes you can mate, use someting like this

onClipEvent (load){
speed = 5
}
onClipEvent (enterFrame){
if (Key.isDown(Key.UP)){
this._y -= speed
}
if (this.hitTest(BALL_MC)){
gotoAndStop (1)
}
}


NOTE:! BAQLL_MC is the object that you are hitting, can be changed, hope this helps.

written by daniel tilley , October 15, 2007

""Can we remove hand impression on rollover effect
I want a normal cursor
Please Explain ""


TBH i dont know much java but what i would do, is save the cursur you would like to use in the directory of the movie. then import it into flash and use this script on it.



onClipEvent (enterFrmae){
Mouse.hide;
this._x = Mouse._x
this._y = Mouse._y
}


then obviously yo will need to set boundries, but basicaly the consept is to hide the mouse and use the image as the cursur, then this allows you to use all diferent cursurs and effects etc.

P.S am a little bit drunk so that code may make no sence but it is the way to do it.

written by Ephenia Moshweu , December 05, 2007

please help. mize game the problem is that my character are moving through the walls. Can you hepl me.

written by Emily , December 05, 2007

how to make an action for the maze character that is not controlled by the keyboard

written by Jake , December 05, 2007

Hey i have a question....I can not figure out how to make Multiple hit tests...Say i have 3 enemys that look totally different. How can i make a "lazer" hit each seperate one?

written by Dylan Bosman , February 16, 2008

I need help with my Space Shooter - side scrolling (very first game).
the ship moves fine and shoots fine.
The problem comes in when i have to perform a hitTest on the enemy and the bullet.
this is my code so far....

//ship or hero MC moving and shooting 100% fine
onClipEvent(load){
this.speed=10;
this.shotcount=0.3;
this.isshot=0;
}

onClipEvent (enterFrame) {
//to move the ship
if (Key.isDown(Key.LEFT)) {
_root.ship._x=(this._x-10);
}
if (Key.isDown(Key.RIGHT)) {
_root.ship._x=(this._x 10);
}
if (Key.isDown(Key.UP)) {
_root.ship._y=(this._y-10);
} else if (Key.isDown(Key.DOWN)) {
_root.ship._y=(this._y 10);
}
//to set boundaries so ship doesn't go off sreen
if (_root.ship._x=650) {
_root.ship._x=650;
}
if (_root.ship._y=380) {
_root.ship._y=380;
}
//to shoot actual bullet
if(Key.isDown(Key.SHIFT)&&this.isshot==0){
this.isshot=1;
_root.shot.duplicateMovieClip( "shot" this.shotcount, this.shotcount 4000 );
this.shotcount ;
}else{
this.isshot=0;
}
}


//code on bullet MC 100% fine
onClipEvent(load){
if(this._name=="shot"){
this._visible=false;
}else{
this._visible=true;
}
this.speed=50;
this._x=_root.ship._x 40;
this._y=_root.ship._y 7;
}
onClipEvent(enterFrame){
this._x =this.speed;
this._y =this.yspeed;
if(this._x>700){
this.removeMovieClip();
}
}
}

My bad guy has an instance name of "enemy".
How can i perform a hit test on it so it disappears on contact with bullet (instance name = shot)????

Any help would be greatly appreciated since this is my first game and i want it to work since i am a big fan of flash games.

Thanks..:)

written by Lawrence , May 18, 2008

right first of, multiple hit hit tests.
The easiest thing to do here is to make a loop. say you had 10 bullets and 10 enemy's named bullet1 , bullet2 etc. and enemy1 , enemy2 etc... then you could write something like this...

onClipEvent(enterFrame){
b = 1
e = 1
while ( b < 11){
while ( e < 11){
if(_root["enemy" e].hitTest(_root["bullet"] b)){
/*note this will make the enemy just offscreen out of site
if you want write some other code like an animation*/
_root["enemy" b]._y = -1000
}
e
}
b
}
}


this works by looping every bullet against every enemy by using algebraic construction of instance names

written by Lawrence , May 18, 2008

oh and dylon with local variables using this. isnt strictly nessecery.
just write speed = 10 instead of this.speed = 10

if you need any help email me and email1993 (at) hotmail.co.uk

written by DanielRo , May 18, 2008

Thank you for all your help Lawrence, I took the liberty of editing your email address.
Spam bots are always crawling sites searching for addresses to spam.

All the best

written by Lawrence , May 18, 2008

just looking over what i said and noticed i missed the sign after ever single name. OOPS. heres the code WITH the plus sign.

onClipEvent(enterFrame){
b = 1
e = 1
while ( b < 11){
while ( e < 11){
if(_root["enemy" e].hitTest(_root["bullet" b])){
/*note this will make the enemy just offscreen out of site
if you want write some other code like an animation*/
_root["enemy" e]._y = -1000
}
e
}
b
}
}

written by Lawrence , May 18, 2008

Commenting AGAIN. i hadnt forgot the sign the bebsite keeps taking em out. So for people wondering why its not working after every "enemy" and "bullet" put a plus sign

and put two after the e and b sitting on their own near the bottom.

Hope this helps

written by Dennis Ormond , July 10, 2008

I need to use hitTests for my characters to detect walls. Problem is, I'm gonna need a lot of walls in my game and I REALLY want to be able to use the same movieclip for every single wall. Dude, I would SO die if I had to give every wall a unique instance name! Please tell me there is an easier way, like having the hitTest detect the wall movieclip and not an instance of it, maybe.

written by Mali Dharam , September 01, 2008

i have a serious pro in this code, i can not access the int moviclip, which is inside on movieclip.

so, Pls rpl if any one can solve it.

import mx.transitions.Tween;
import mx.transitions.easing.*;
import mx.utils.Delegate;
import flash.display.Sprite;

class galleryMenu extends MovieClip {
var h:Number;//Menu heigth
var height_sel:Number;//sel height
var sel:Number;//selected menu
var oldSel:Number;//last selected menu
var cant:Number;//quantity of menues
var sqr:MovieClip;
var square:MovieClip;//This is for designers, they need some visual feedback of menu area
var desc:MovieClip;
var thumbcont:MovieClip;
var thumb:MovieClip;

public static var CurrentCount:Number;
public static var BaseHeight:Number;
public static var stSel:Number;
public static var stOldSel:Number;
public static var IsUp:Boolean;
public static var IsDown:Boolean;
/*
* Constructor
*/

function galleryMenu() {
sqr._visible = false;
//square._visible = false;
desc._visible = false;
setSel(0);//First selected by default
}
/*
* Set the menu based on passed array
*/

function setMenu(items:Array, descItems:Array, thumbs:Array) {
cant = items.length;
//trace(cant)
var t:MovieClip;
var d:MovieClip;
var k:MovieClip;
var md:MovieClip;
if (CurrentCount != cant) {
CurrentCount = cant;
}

//Attach items
for (var i = 0; i0) ? t._y t._height : 0, nr:i});
t.menu_txt.text = items[i];
t.menu_txt._height = 23;
md = attachMovie("thumbcont", "thumbcont" i, i cant*2, {nr:i});
//a = attachMovie("thumbcont", "thumbcont" i, i cant 1, {nr:i});
d = attachMovie("desc_item", "desc_item" i, i cant, {nr:i});
d._visible = false;
new Color(this.square["item" stSel].menu_txt).setRGB(0x045E83);


for (var m = 0; m1) ? act[1] ":" act[2] : act[1];
getURL(go, "_new");
break;
default :
//trace(_parent.ref.des.text);
//trace("Display Data On this click");
}
};
t.onRollOver = function() {
if (this.nr != stSel) {
var myColor = new Color(this.menu_txt).setRGB(0x045E83);//onRollOver color
}

};
t.onRollOut = function() {
if (this.nr != stSel) {
var myColor = new Color(this.menu_txt).setRGB(0xffffff);
}
//onRollOut color
};
}

for (var n = 1; n

written by TJ , October 08, 2008

I need to make a hittest that ensures that all of 8 draggable items have been dropped on droptargets but in no particular order or matchpairs ...Then they can see the solution .. Is it possible ?

written by Torre , October 17, 2008

I made a player that i can move with the keyboard...
and i made some walls...
but i cant make a hittest...
my player move through the walls...
can anybody help me?

written by starsarebent , October 18, 2008

Hi, I have a problem. I can't seem to use more than one hitTests on a single object. For my MC, I have this attached to it:

onClipEvent (enterFrame) {
var step = 5;

if (Key.isDown(Key.DOWN)) {
this._y = step;
if (this._y ~PLUS~ this._height >= Stage.height) {
this._y = (Stage.height - this._height);
}
if (this.hitTest(_root.Wall)){
this._y = _root.Wall._y - this._height ~PLUS~ 1;
}
if (this.hitTest(_root.hEnter))
goToAndStop (2)
}

The first hitTest "Wall" is working fine. However, the second hitTest "hEnter" doesn't seem to do anything. I have the instance names set properly and it's syntactically correct. It's not going to frame 2... what's the deal? anyone?

written by MiuSenshi , January 29, 2009

try an else if on all but the first if statement, see if that works, sometimes multiple ifs confuse flash, but from my experience you can have one if, and many else if

hope this helps =)

written by learning , June 30, 2009

Hi, nice. I am trying to use this for scroller bar,

so How would it write for the ball to move only horizontally, and when it hits one of the ticks on the bar, jump make a movie jump to a label with the same name?

written by Yo mama , July 06, 2009

make a mouse cursor, press f8 make it a movie clip name it mousecursorMC, make its instance name mousecursor_mc

Mouse.hide();//
startDrag("mousecursor_mc",true);//
onMouseMove = function () { updateAfterEvent()};

Name this action2 and put it above action. That is to make the mouse appear once.

written by gaurang , August 17, 2009

nice dear

written by Otobong , December 25, 2009

Hi all please how can i set road boundaries for my car racing game. I made a car that moves and rotate, but i dont know how to set boundaries. Any help please

written by ziya , December 02, 2012

Can you write the codes if I want to add a red circle and a different message when hit on the square ? Thank you so much..

Do you need more help? Ask now!

Comment
Name
Email
Website
	Add Comment

Trackback(0)

Comments (26)