I am playing with animation in AS3 and flex4, and I've come into a problem. My application is a game board (like a chess board), where each field is a border container added to some position.
Also I am adding a child element (shape), to this container on mouse click. What I want to achieve is to be able to move shapes smoothly from one field to another. But it appears that the shape goes behind the neighbor field this way http://screencast.com/t/iZ3DCdobs.
I believe this happens because shape is a child of specific border container, and to make it visible over every other container, I would need to use layers somehow....
I would be happy if anybody could suggest a solution
Yes you're right on that. You should add the movable objects to a different layer.
As there are no typical layers in AS, you could try to drop the fields in one sprite and any other objects to a different an than place them on each other, so that when you will move a object it won't go behind other objects.
If you place both sprites in the same position you will still have accurate x,y positions between movable objects and fields.
You have two options:
First one is to have different layers for your DisplayObjects: as an example, the bottom layer would hold all the boards, and the upper layer would hold all the pieces.
Second option is to manipulate the index of the objects with swapChildren(), swapChildrenAt(), and setChildIndex(). So to bring a MovieClip to the topmost front, you would do MovieClip(parent).setChildIndex(this, 0);
If the situation is that always the shape object gets hidden behind the next ( right side ) grid container, the I suggest you create your grid in reverse.
Suppose you are creating a chess grid. that is a 8x8 grid. Normally you would create your grid using 2 for loops, looping from 0 to 8 with say the x and y points starting at 0,0 for the first grid and going on till the end. What I suggest you to do is to create from 8,8 to 0,0.
Display objects in flash are stacked on top of each other based on their child index.
For example: If you create two objects. Rectangle and Circle as follows
var rect:Rectangle = new Rectangle();
this.addChild(rect);
var circ:Circle = new Circle();
this.addChild(circ);
The circle will always be on top of the rectangle in this scenario because the circle was added after the rectangle to the display list.
So if you reverse the order of creation of your grid, the right grid cell will be added to the display list first and so the grid cells to the left will always be on top of the right ones. Hence, the problem that you are facing will not occur.
Related
I'm trying to make a hotkey type button which has a main image, a number in the top left indicating the hotkey button, and a number in the bottom right indicating the quantity of the item. I could use a Table to place these but they wouldn't be overlapping. I'd like to have the numbers on top of the main image so I used a stack, unfortunately it doesn't look like there's a way to control the actors on a stack - they all get placed at 0,0 within the biggest actor in the stack. Is there a way to place the actors in the appropriate positions or do I have to use table?
By definition, Stack puts its children in 0,0 coordinates and trying to stretch them to fill Stack.
You can use Group, for more control over actors you putting in:
You can simply get X and Y coordinates of inserted Actor by getX() and getY() methods. With little bit of help by getHeight() and getWidth() methods you can make simple table layout.
I am writing now a flash game and I run into a an issue. I have a map for the game which is defined as a 2-D array, where each element represents a component of the map. The player is always in the center of the map.
The problem is when the player reaches one end of the map. Now it is empty space. I want that the player instead of seeing the empty space, to see another end of the map and in this way, the map will loo like it goes around.
So for example if the player goes to right he will eventually start seeing the the left side of the map and the world will look continuous.
Does anyone knows how to implement this functionality?
You could make the array 2 times and put the first one behind the second one again and than the second one behind the first etc etc..
It's done here with 2 pictures, just use the arrays instead:
//The speed of the scroll movement.
var scrollSpeed:uint = 2;
//This adds two instances of the movie clip onto the stage.
var s1:ScrollBg = new ScrollBg();
var s2:ScrollBg = new ScrollBg();
addChild(s1);
addChild(s2);
//This positions the second movieclip next to the first one.
s1.x = 0;
s2.x = s1.width;
//Adds an event listener to the stage.
stage.addEventListener(Event.ENTER_FRAME, moveScroll);
//This function moves both the images to left. If the first and second
//images goes pass the left stage boundary then it gets moved to
//the other side of the stage.
function moveScroll(e:Event):void{
s1.x -= scrollSpeed;
s2.x -= scrollSpeed;
if(s1.x < -s1.width){
s1.x = s1.width;
}else if(s2.x < -s2.width){
s2.x = s2.width;
}
}
You simply check if your player is about to get off the "right" or "left" edge of the map, and position him at the other edge. To draw a circular map, you can use the following technique: if you are about to draw a column of a number that exceeds the map's width, decrease that number by width and draw the column at resultant index; and if you are about to draw a column at index below zero, add width and draw the column at resultant index. If you are in troubles of making a hitcheck at continuous map's borders, you can employ the same trick to find neighbors. (The "circular array" is a pretty basic algorithmic problem, and is resolved in many ways already)
You have a few options here. You can do the pac-man style of just making your character pop up on the other side of the screen, but that would require you to abandon the cool bit of the character being in the middle at all times.
On to the real suggestions:
If you're not implementing your array as one solid object (i.e. making it draw individual collumns/rows at a time) then this is a no-brainer. Just have a function that returns the index of the next collumn/row, within certain bounds. Like, if your array is 40 elements wide, when it tries to draw element 41, subtract the size of the array, and make it draw element 1 instead.
If your array is one solid object (like if you drew it onto a stage object and are just manipulating that) and it's not very big, you could probably get away with drawing a total of four of them, and just having a new one cover up any whitespace that's about to appear. Like, as you approach the right edge of the first array, the second array moves to the right of it for a lawless transition.
If your array is a solid object and is very big, perhaps you could make eight buffer objects (one per edge and one per corner) that hold approximately half a screen's worth of the array. That way as you approach the right edge, you see the left edge, but then when you cross into the buffer zone, you could teleport the player to the corresponding position on the left of the array, which has the buffer for the right size. To the player, nothing has changed, but now they're on the other side of the world.
I am creating a fighting game. I've got a spritesheet for the hero and a spritesheet for a monster. Since both will be able to do multiple attacks I would like to avoid to merge them in a single spritesheet. And I am intending to create more characters.
Now I am creating a SpriteBatchNode for each spritesheet and add them to layer.
CCLayer* stage = CCLayer::create();
CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("character_hero.plist");
this->characterHeroBatchNode = CCSpriteBatchNode::create("character_hero.pvr.ccz");
CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("character_monster.plist");
this->characterMonsterBatchNode = CCSpriteBatchNode::create("character_monster.pvr.ccz");
stage->addChild(characterHeroBatchNode);
stage->addChild(characterMonsterBatchNode);
Now I have one sprite in characterHeroBatchNode and multiple in characterMonsterBatchNode.
How can I reorder the monsters and the heros z-Order based on their PositionY attribute.
For example>
monster1->setPositionY(10); // In monster batch node
hero->setPositionY(24); // In hero batch node
monster2->setPositionY(43); // In monster batch node
I want the monster 1 behind the hero. And the hero behind monster2.
In the past, I've had to create games where I wanted some sprites in the foreground and others in the background. The sprites were in different sheets, like you have them.
To get them in the order I wanted, I put the "front" sprites into one CCLayer and the "back" sprites into another CCLayer. I added the layers to the scene in the order I wanted them to appear. I also manipulated each the respective layers to make them fade in/out as needed. So you could have the hero in the scene and then have the enemies appear behind him.
If you want to mix and match, you can have 3 layers, one for the "middle ground", one for "front", and one for "back", and dynamically move the sprites between the layers.
Was this what you were looking for?
If I understand what you're asking, the answer is, you can't. Consider each CCSpriteBatchNode to be its own container. You can adjust the Z order of the sprites inside the CCSpriteBatchNode, but when you add the batch to the CCLayer the whole CCSpriteBatchNode is applied to the CCLayer in whatever Z order you added it at. So in order to do what you want you would need another batch of monsters. Or use CCSprites and add/adjust them on the CCLayer in the way you want, but then you obviously lose the CCSpriteBatchNode benefits.
This should be fairly simple I'd think, I'm just not that familiar with actionscript haha.
I have a game where I have the background moving behind a character that stays in one position on screen. I'm relatively new to actionscript 3 but I'm wanting to have text boxes pop up whenever the player presses a key over certain objects passing in the background.
So, basically the background itself is a movie clip, and I have other graphics and movie clips within the background mc.
I was thinking of getting the player.x and y position and then "comparing" that position (>= and <=, etc.) with the graphic/movie clip in the background. But I just don't know how to obtain the x and y coordinate of the graphics/movie clips in the background mc.
You could try to target your movie clips in the background by getting their coordinates, then removing their parent's position (the background container).
Something like :
var finalXPosition:int = targetMovieClip.x - backgroundContainer.x;
var finalYPosition:int = targetMovieClip.y - backgroundContainer.y;
By substracting the target movieclip parent's position to its position, you gain the final position in the parent's scope coordinates.
It should work for you as soon as your character and your background container are situated at the same level of the display list.
Here is a quick diagram of what I try to explain (please forgive my inaptitude to draw nice and explicit drawings ^^)
Usually, when I stumble upon such a case, I try to make a quick and even dirty drawing, starting with what I want, then breaking down every useful data I have to achieve that result, you should keep that method in mind and try it the next time ! :-)
Basically i have x circles represented as MovieClips.
They are all assigned the same base color (for example red).
They should all have a brightness property ranging from 0 to 1 (0 would be completely white and 1 completely red).
I would like the following properties for representing these circles on stage:
When the circles dont overlap they are represented as stated above.
When the circles overlap the overlapping region should have the same base color as the original circles but the brightness of that area should be the sum of the brightnesses of all the circles that define the overlap.
The brightness saturates at 1. So the overlap of 2 circles with brightness 0.8 is 1 (the maximum value) instead of 1.6.
I am wondering if there is some kind of BitmapFilter i could use on the circles to achieve these properties? Or am I looking in the wrong place?
I am relatively new to Actionscript so any pointers are welcome!
Hi and welcome to SO and AS3!
I'll take each point separately:
1) Quite simple, you've probably already figured out that "addChild()" will add MovieClip objects to the Display List, meaning Flash will render them every frame.
2) The easiest way to do this is through "Blend Modes", which is Adobe's way of handling overlapping display objects.
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/DisplayObject.html#blendMode
Try setting the .blendMode property of each circle to BlendMode.ADD:
var circle:MovieClip = new MovieClip();
circle.blendMode = BlendMode.ADD;
3) If BlendMode.ADD doesn't give you the results you want, try creating a custom shader to do the job.
http://help.adobe.com/en_US/as3/dev/WSB19E965E-CCD2-4174-8077-8E5D0141A4A8.html
IMHO Blendmode is the easiest way of achieving the desired effect, and blendShader if you want precise customization. Please comment if you have further questions!
Some tutorials and examples:
http://www.learningactionscript3.com/2007/11/03/more-properties-blendmodes-filters/
http://active.tutsplus.com/tutorials/games/introducing-blend-modes-in-flash/
Cheers,
J