How to insert a movie on button click - AS3 - actionscript-3

I'v been working on a strobe website for a while now http://strobepage.com/
I want to allow users to select their own colours for the strobe, This Basically means I will easily be able to cover way more colour combinations and take up less room on the site..
So far I have tried making 2 movie clips, one for each colour.. and refering to it as an instance and as a movie clip as a whole ( MovieClip(colour1) ) to change its colour.. this works, but only in that specific instance, when the user clicks "next" to progress to the next frame of the ROOT movie (which displays the interchanging movie clips) the movie clips have reverted back to their original state..
Is there possibly a way to PERMANENTLY colour a movie clip on button press... I seem to think there isnt.. This is where i thought, hey, why not make a bunch of movie clips that contain different colours, and on button press, one of these movie clips, is inserted into another movie clip that will have 2 frames that interchange between the movie clips that the user has selected... Only, I have no idea how to do this, and whether its possible or not..
I hope i have explained this in an understandable way.. theres lots of movieclips lol..
anyway, thanks in advance for anyone who can come up with a solution :D
Please give an AS3 example of what you are explaining :D

Create movie clip for each color and place on the same x, y.
Now keep them all visible=false and make particular mc to visible=true. Use colortranform to reflect the changes on other mc's.

If you want to keep it light and easy to maintain, you'll want to use code, not timeline frames to get your colors (this will also ensure faster performing strobes). This is quite easy to accomplish with ColorTransform. Below is a function I've written that encapsulates that operation; accepting the object you want to color as the first argument, and a hexidecimal value of the color as the second.
function tint(obj:Object, color:uint):void {
/* Colors the object using transform */
// Pull the individual primaries
var r:Number = (color >> 16 ) & 0xFF;
var g:Number = (color >> 8) & 0xFF;
var b:Number = color & 0xFF;
// Apply if valid
if (obj.hasOwnProperty("transform")) {
obj.transform.colorTransform = new ColorTransform(0,0,0,1,r,g,b,0);
}
}
In example, let's assume you have a DisplayObject on stage called "box", and wanted to color it a bright blue, you'd do the following:
tint(box, 0x1b8afc);
Hope that helps.

Related

AS3 Swap depths in Flash IDE without destroying movieclips

I have two movieclips, one is on top, one is on bottom. The top one is set to the second frame. I move it to the z axis bottom on the next frame, and for the remaining frames it plays all frames like it has been reset without any code (like I didn't tell it gotoAndStop(2)).
Image example: http://i.imgur.com/mQ8f5uT.gif (hard to tell by the frame rate, but the dark green box starts playing as if I didn't set it's frame once I move it below)
I know it doesn't have that issue when I code the depth swapping with setChildIndex, but the animations are lost.
If you're wondering, it's a simplified issue of a larger moving character sprite animation that I would like to swap depths of movie clips in the animation without resetting the movie clips underneath the depth change. So I'm not really looking for a work around per se, unless there's a well design solution and not a band aid "hack."
I think I didn't understand your question fully. A MovieClip will keep playing or keep being stopped no matter what you do with it, even if it was removed from the scene. I made a simple example which shows that MovieClip state is not affected by depth change.
The working SWF is here to test: http://zdg.ru/tmp/updown.swf
And the code is:
import flash.events.MouseEvent;
var is_playing:Boolean = true;
btn_toggle.addEventListener(MouseEvent.CLICK, doToggle);
btn_updown.addEventListener(MouseEvent.CLICK, doUpdown);
function doToggle(evt:MouseEvent) {
if (is_playing) mv_test.stop(); else mv_test.play();
is_playing = !is_playing;
}
function doUpdown(evt:MouseEvent) {
var tmp:int = getChildIndex(mv_block);
setChildIndex(mv_block, getChildIndex(mv_test));
setChildIndex(mv_test, tmp);
}

flash actionscript 3.0 hide part of an image

I am working on a flash sound mixer application with multiple sound channels, and I am having trouble with the lights beside the volume knob.
Is there a way to hide just a part of an image?
On the image below, image-2 is on top of image-1 to create some kind of volume level indicator effect, and how much of image-2 is shown depends on the value of the volume.
image-url: http://s30.postimg.org/r3ow1g5bl/volume_lights_level.png
I've tried by just reducing the height of image-2, but it looks awful and distorted.
Is there something in flash that works closely the same as CSS's behavior.
example: I'll just make image-2 a background of a shape, and when I reduce the shape's height, the image-background does not get distorted or changes it's height as well.
By searching for solutions, I have come across the mask property, but I don't quite understand how it works, and most of the examples shown are images placed inside circles.
Is the mask property applicable in this situation?
I'm quite new to flash so I don't know a lot of things yet.
You can indeed use a mask.
How to programmatically create your mask
Put an occurrence of your image named myImage on the stage, and put over this occurrence a mask named myMask with the same dimensions. You can apply myMask mask to myImage using it's mask property like below:
Main Timeline
myImage.mask = myMask;
function mouseMoveHandler(e:MouseEvent):void {
myMask.height = myImage.y - e.stageY;
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
You have just to adapt this code to your animation, in the function where you click your button.
I got it working now, many THANKS #VC.One. heres how I did it.
Imported img-2 to stage, converted it into symbol(type:Movie Clip), assigned instance name: img2_mc.
I created a new layer for the mask, drawn a rectangle using rectangle tool, converted it also to symbol(type:Movie Clip), assigned instance name: mask_mc.
Then applied the mask to img2_mc.
/* the code */
img2_mc.mask = mask_mc;
function onEnterFrame(event:Event):void{
var volumeKnob_y = volSliderKnobOn.y + 12; // adjust it to the center of the knob
mask_mc.height = volumeKnob_y;
}

How to detect if there is a drawing/graphic drawn on a movie clip in AS3?

I am a newbie to AS3. I have a movie clip.I want to know if there is a drawing/graphic drawn over movie clip at all?
Simple, check the width and height of the MovieClip. Assuming you mean the MovieClip itself contains the drawing/graphic.
After seeing Fygo's comment
I did some testing and found out that the scale properties of the MovieClip will change depending on whether or not it has any graphics.
Meaning if you set the width and height to zero, the corresponding scaleX and scaleY will also be set to zero. So what you can do is check the scale AND the dimensions of the MovieClip. If both scales are 1:1 and both dimensions are 0:0, that means you didn't mess with the dimensions and it truly is graphic-less.
trace (awd.scaleX, awd.scaleY, awd.width, awd.height);
//If you get 1 1 0 0 as the output, the MovieClip is empty
Use readGraphicsData(). I assume that if it's empty it means there is nothing drawn there :)
It's not perfect though, read the reference
Maybe you just mean collision detection? To detect if two movieClips are touching...?
For that you need either:
HitTestObject - (checks if two objects touching by their box boundaries) - Link:
or HitTestPoint - (read description carefully) - Link:
A good tutorial explaining both methods is here: - Link:
example code:
if ( MC_one.hitTestObject(MC_two) )
{
trace("MovieClip One is touching/over MovieClip Two");
//add code needed to happen when touching/over. example below
//MC_two.gotoAndStop(2); //example tells touched MC_two to change frame to 2
}

cocos2d, reorder children in different batch node

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.

as3 dynamic index change for added objects on stage

I have added some backgrounds on stage and then on top of that adding another background and all these are movieclips.
At some time i have to remove the backgrounds and then it should be added but here problem am facing is the background become coming front.
so is there any function like send to back or bring to frond based on the movie clip names.
You want to experiment with :
setChildIndex(object, z-value)
This set the depth of the object on the stage.
swapChildren (object1, object2)
This exchange the position of two objects on the stage.
setChildIndex
swapChildren
swapChildrenAt
addChildAt
Use addChildAt(index);
http://www.adobe.com/livedocs/flash/9.0/ActionScriptLangRefV3/flash/display/DisplayObjectContainer.html#addChildAt()