hitTestObject not working properly AS3 - actionscript-3
How to make the objects detect each other without having to be so accurate? Currently, the program that I'm working on only allow the items to be matched when it is accurately matched at the upper left edge but i did not use hitTestPoint, I used hitTestObject. Below are my codes.
if (bin1.hitTestObject(item)){
updateShape(item, bin1);
If bin1 and item are both DisplayObjects, which I don't see how they couldn't be (DisplayObject is a base class that's extended by a bunch of others like MovieClip and Sprite) then you should be able to just do a little quick and dirty calculation yourself. The way you worded your question led me to believe that bin1 and item have their origins in the top left, so you should be able to use this code to see if the complete rectangles that both of them inhabit are hitting, which isn't all that accurate if the objects are rotated, but it sounds like that's almost what you're looking for:
if(Math.abs((bin1.x+bin1.width/2)-(item.x+item.width.2)) < bin1.width/2 + item.width/2 &&
Math.abs((bin1.y+bin1.height/2)-(item.y+item.height/2)) < bin1.height/2 + item.height/2)
updateShape(item,bin1);
If their origins aren't actually in the top left and are centered, remove all the .width/2 and .height/2 parts with the .x and .y parts in the parentheses. Hopefully this helps!
Related
Dynamic focus management [ AIR / AS3 ]
I've run into a situation with a project I'm working on and I'm hoping to get some insight on how I might go about tackling it. Basically I am writing an AIR/AS3 app that allows the user to move focus around using the arrow keys on the keyboard. The problem I am trying to over come is that the clips are dynamically placed so I have no idea ahead of time what their position will be relative to each other. In addition to that, all of the clips have different shapes and sizes, so part of the weirdness is that some clips would occupy multiple columns, or multiple rows if you were laying out their positions on a grid for example. So, the goal would be to have some logic that evaluates all of the clips sizes and/or positions and creates some form of map that allows clips to know who their nearest neighbor is when pressing right, left, up or down. The question is, what is the best approach for tackling something like this? I ultimately need it to feel very natural when moving around, and be far more intelligent then a tab-index list for example. If I haven't provided enough information, please let me know and I can share additional details as needed. Just didn't want to go all crazy trying to explain things to start with. Thanks in advance for any help! Using the reference image, assume block "D" has focus. Using the logic #Pier's provided below, if I was to press "UP", would it know to go to block "A", or would it go to block "B" because it's distance and angle are less? In this case I think the user would expect it to go to block "A", but I'm thinking the code would evaluate to block "B" if I understand it correctly.
Calculating the distance and relative angle between two clips is easy (simple trigonometry). here are the function to calculate distance and angle between 2 x,y positions.
function angle(x1,y1,x2,y2):Number{
return radToDeg(Math.atan2((y2 - y1),(x2 - x1)));
}
function radToDeg(angle:Number):Number{
// to convert radians to degrees
return angle * 180 / Math.PI;
}
function distance(x1,y1,x2,y2):Number{
var dx:Number = x1 - x2;
var dy:Number = y1 - y2;
return Math.sqrt(dx * dx + dy * dy);
}
Knowing that, simply look what arrow the user has pressed. Then look the angles and distances of the other clips, and look how many clips there are in current direction (eg: what clips have an angle offset less than +-45 degrees), then look which one is closer, then change focus if there is any clip that meets the conditions.
I presume you won't have hundreds of clips placed on the stage, because in that case you should only calculate the angles for the closest clips.
Sorry for the delay following up here, but I ended up solving my issue by dynamically generating a grid map of all the clips positions which then allowed me to scan in various directions to find the next clip getting focus. Here is an output based on the example picture I provided originally: [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,3,3,3,3,3,3,3,3,3] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,2,2,2,2,2,2,2,4,4,4,4,4,4,4,4,4] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,-,-,-,-,-,-,-,-,-,5,5,5,5,5,5,5,5,5] I've had to adjust the grid size to balance the performance vs. fidelity, but it seems to be working great in the various scenarios I needed it. Thanks again for the help #Pier. Although I didn't end up using the ray casting approach, it was very informative learning about it. I could see how in a game for example that could be super powerful.
Make a turn based system like final fantasy tactics AS3
i wanted to make a turn based system like final fantasy tactics. I already created the map, which is 5x5 tiles grid and the characters which is each character places in the end of the tiles. I have 2 teams, which are named Red and Yellow. ------Red-------: First character is at 0,0. Second character is at 0,1. Third character is at0.2, fourth character is at0.3, and the last one is at0.4`. -----Yellow------: First character is at 5.0. Second character is at 5.1. Third character is at 5.2, fourth character is at 5.3, and the last one is at 5.4. I wanted Red team are moving first and make a decision (whether it is attack or wait), and after 5 characters of the Red team is already made a decision, the Yellow team is the one that make a decision (Yellow team is an AI) But, i don't know how to move my characters into the next grid (e.g: from 0,0 to 0,1) by clicking the left mouse button and also how do i display a grid (when select a move selection) that shows how many tiles that the character able to move. Anyone know about this? or how should i know more about this? is there any recommendations books or webs?
You have your basic data structures set up, but now you need to get some higher level code to manipulate that data.
First of all, I think you should work on selecting locations on the grid with the mouse. Once you can click and get that grid coordinate saved to a variable, you need to set up a function to move your characters. After the first click (on a character), you need to check the valid moves, and for each valid move, you need to render an image on the grid square (or highlight the square's texture).
Secondly, you need a function which iterates through all the characters in each team, according to who moves next. When you have gone through Red.length (red is an array consisting of each player), then you switch to counting through Yellow.length, and running the AI for each character. If you are trying to make a two player game, you instead ask for user input a second time for the yellow team.
I recommend that you learn about how to display your grid and set up a simple way to highlight squares on the grid. After that, you need to convert mouse coordinates into grid coordinates. Your teams should each be an array of characters. I'm not familiar with actionscript, but in the languages I know, they would look like this:
team[6] = {Character1, Character2, Character3... }
Character1.position = {x, y}
running a turn would be something like this:
while battle == not finished {
for (i = 0; i < red.length; i++) {
getInput();
move(red[i], newX, newY); //red[i].position = {newX, newY}
}
for (i = 0; i < yellow.length; i++) {
runAI();
move(yellow[i], newX, newY);
}
}
The hardest part will be the mouse selection and drawing the grid/characters. Graphics are always a nuisance. The data itself just takes a bit of thinking. Your question in particular seems to be about game programming. My advice is to make the grid, then figure out how to display the grid. Then get mouse input. Finally, worry about moving the characters and highlighting squares.
cocos2dx - sub layer that covers its parent partially keep capturing all touches
In my cocos2dx game, I have a CCLayer that contains another CCLayer. The sublayer just cover part of the container layer. I 'think' I achieve this through: this->setContentSize( CCSizeMake( 100, 200 ) ); however, the sublayer always capture touches even though it is outside its size and position area... Is it common? I can filter through the touches position by comparing it inside the ccTouch** functions, but I think it is a hack, what is the proper way to set the sublayer to properly cover just the partial area of its parent?
The only thing i can think of straight away is making this inner layer a CCNODE and also extent it with CCTouchDelegate. Now with this, when u register with the TouchDispatcher, you make sure it doesn't Swallowtouches(the boolean value given as the last parameter)... This way when you receive a touch ... just see if it is within the boundary of this inner layer of urs and if it is not, send let the parent class use this touch. Hope this helps.
AS3: weird getBounds() result
EDIT2: It seems that the big numbers are created because the movieclip doesnt hold any bipmapdata, but Im yet not sure about it, but my real mistake was that I just forgot "this" infront of one "getBounds" ... project size was to big and I couldnt find the bug =) EDIT: tried to use seperate containers, for the movieclips, and did all this in the root class ... everything worked fine, when I used seperate containers and attached everything to the charakter class it got screwd up again OLD: Hey I am making a game right now and I want to get the bounds of the charakter body. To understand how I did set the whole thing up I explain the hirarchy. The class of my flash document is "game.as". "game.as" adds a Child of the class Charakter my Charakterclass has a Movieclip for every body part, for example the "head" every bodypart has a movieclip which contains the picture of the bodypart, in this case "head". When I now try to use the getBounds(head.mc) inside the "head" class I get really weird results. ussualy something around x=64001, y=64001, width = 0, height = 0; I found a way how to solve this problem by simply using the getBounds(head.mc) function not inside the head, but inside the Charakter class .... but this is not what I actually want to do, I would like to use the getBounds(head.mc) function inside the head class. Any ideas why the results are so weird or what I have to do? Im very thankfull for every opinion, because this doesnt seem logical to me xD
getBounds() is inaccurate. Please read the following posts to understand the issue. getBounds "wrong" results (Source) When getting bounds of an object relative to it's OWN coordinate system, those values will NOT be scaled. getBounds() returning incorrect height (Source)
From inside head_mc, try getBounds(this.parent); (you may want to test to see if the parent exists first) - this should give you the bounds of your head_mc as its container sees it, which I think is what you want, but called from inside head_mc, as you request. bitmapdata is right, though - getBounds() can sometimes give some odd results. It looks to me like you might be asking the question before you add head_mc to the stage, and are therefore getting the undefined values for width/height/x/y.
Drawing a series of isometric enemies in the correct order or dealing with the dirty rectangle?
I'm wonderring if anyone can help me with making sure my... uhhh ... Z-index (bad pun, you'll see why in a moment) is in the wrong order. I've been doing this for a few hours straight now and my eyes are going buggy - but - maybe leaving a question on Stack overnight will help push this in the right direction. I've been working on the code for https://github.com/AlexChesser/jsSprite and I'm as far as the 6th test. Use the W key to run, A and D to turn left and right: http://chesser.ca/jsSprite/06-brainnsss....php (Gettit? Z-Index?! Hilarious). Anyways, You'll notice that if you run around the screen for a bit. the individual Zombies' white squares / dirty rectangles overlap the other zombies' squares. When working with multiple overlapping sprites, how does one go about making sure they all get drawn without upsetting any of the other sprites? (You see z is for zombies, but z index like when you're dealing with overlapping in CSS - probably way funnier when you've been coding for a number of hours straight). Thanks for your Brainsss......
It's not a z-index issue, your zombies themselves are okay.
Your problem is really with the second line of drawFrame
drawFrame: function(){
Sprite.ctx.clearRect(0,0,Sprite.width,Sprite.height); //clear previous frame
// I am trouble:
MainContext.clearRect(Sprite.Xpos, Sprite.Ypos, Sprite.width, Sprite.height);
It is clearing a rectangle of the main canvas where the zombie once was every time you draw a zombie, which can affect nearby objects!
So instead you should be clearing the entire canvas each time.
Try commenting out the MainContext.clearRect in drawFrame, and instead add one in runloop like below. It should fix your problems.
runloop = function(m) {
// New clear put here!
MainContext.clearRect(0,0,canvas.width,canvas.height);
m.drawFrame();
for (Z in Zarr) { // For ZOMBIE in "Zombie Array" Aaaaarrrgghhh...
Zarr[Z].pointTo(m);
Zarr[Z].drawFrame();
MainContext.drawImage(Zarr[Z].canvas, Zarr[Z].Xpos, Zarr[Z].Ypos);
};
MainContext.drawImage(m.canvas, m.Xpos, m.Ypos);
};
How about sorting your array (Zarr) by the y coordinate Ypos of each zombie before rendering? Or are you getting at the problem with (a lack of) transparency?