Archive for July, 2009:
Dynamically change the Frame Rate
New to ActionScript 3.0 is the ability to dynamically change the frame rate of an animation via runtime. By having this ability, can help optimize your Flash movie’s framerate so that it only uses the resources that it needs to. You can also use this to lower the frame rate for slower machines dynamically.
function changeFR(e:MouseEvent):void {
this.stage.frameRate = 5
}
btn2.addEventListener(MouseEvent.MOUSE_DOWN, changeFR2);
function changeFR2(e:MouseEvent):void {
this.stage.frameRate = 30
}
AS3 Scrollbar
Scrollbar is one of the basic requirement, there are a lot of tutorials on the net with this subject but more of them are using a class or component. This approach does not offer a lot of flexibility. In this tutorial we will use a MovieClip for Static Text and the scollbar button.
var maxY:Number;
var percentuale:uint;
var contentstarty:Number;
var bf:BlurFilter;
var obj = this
function Scrollbar():void {
reset();
bf=new BlurFilter(0,0,1);
obj.text_mc.filters=new Array(bf);
obj.text_mc.mask = obj.maskmc;
obj.text_mc.cacheAsBitmap=true;
obj.minY=background.y;
obj.maxY=background.y+background.height-ruler.height;
obj.ruler.buttonMode=true;
obj.contentstarty=text_mc.y;
obj.minY=0;
obj.maxY=obj.background.height-obj.ruler.height;
ruler.addEventListener(MouseEvent.MOUSE_DOWN, clickHandle);
stage.addEventListener(MouseEvent.MOUSE_UP, releaseHandle);
obj.addEventListener(Event.ENTER_FRAME, enterFrameHandle);
}
function clickHandle(e:MouseEvent) {
var rect:Rectangle = new Rectangle(background.x-(ruler.width/2)+1, minY, 0, maxY);
ruler.startDrag(false, rect);
}
function releaseHandle(e:MouseEvent) {
ruler.stopDrag();
}
function enterFrameHandle(e:Event) {
positionContent();
}
function positionContent():void {
var upY:Number;
var downY:Number;
var curY:Number;
percentuale = (100 / maxY) * ruler.y;
upY=0;
downY = text_mc.height - (maskmc.height / 2) + 20;
checkContentLength();
var fx:Number = contentstarty - (((downY - (maskmc.height/2)) / 100) * percentuale);
var curry:int=text_mc.y;
var finalx:Number=fx;
if (curry!=finalx) {
var diff:Number=finalx-curry;
curry+=diff/4;
var bfactor:Number=Math.abs(diff)/8;
bf.blurY=bfactor/2;
text_mc.filters=new Array(bf);
}
text_mc.y=curry;
}
function checkContentLength():void {
if (text_mc.height<maskmc.height) {
ruler.visible=false;
} else {
ruler.visible=true;
}
}
function reset():void {
text_mc.y=0;
ruler.y=0;
}
Scrollbar()
Trigonometry
Understanding a few basic formulas can really bring your ActionScript to a higher level. This is a look at trigonometry for practical use in flash actionscript. Applying some trigonometry to Actionscript, we can realise some really nice effects and give the possibility to the user to interact in an amusing and creative way within our flash application.
Resource:
http://flash-creations.com/notes/asclass_math.php
http://www.kirupa.com/developer/actionscript/trigonometry.htm
var WAVESTART:Number = 130; // start point for sine wave
var WAVESTOP:Number = 309;
var WAVEMP:Number = 65; // y=0 point (midpoint of wave height)
var WAVEAMPL:Number = 50;
// angle changes one radian each frame
var angle:Number = 0;
for (var i:Number = 0; i<180; i++) {
angle -= Math.PI/180*2;
var new_mc:dot = new dot();
new_mc.name = "dot" + i
new_mc.x = WAVESTART + i
new_mc.y = WAVEMP - Math.sin(angle)*50
addChild(new_mc)
}
addEventListener(Event.ENTER_FRAME,myFunction);
function myFunction(event:Event) {
rotator_mc.radius_mc.rotation = -angle/(Math.PI/180);
rotator_mc.sincos_mc.scaleX = Math.cos(angle);
rotator_mc.sincos_mc.scaleY = Math.sin(angle);
connector_mc.x = 110 - (WAVEAMPL - Math.cos(angle)*WAVEAMPL);
connector_mc.width = 20 + (WAVEAMPL - Math.cos(angle)*WAVEAMPL);
connector_mc.y = WAVEMP - Math.sin(angle)*50;
for (var i:Number = 0; i<180; i++) {
var target = getChildByName("dot"+i)
//(condition) ? true : false
target.x = (target.x >= WAVESTOP) ? WAVESTART : target.x + 1;
}
angle += Math.PI/180*2;
};
Volume control in AS3
This tutorial is for users to begin with a volume control in Actionscript 3. I have made it so that you can stop and play a sound and control the sound at different volume.
var myAudio:importedSound = new importedSound();
var myChannel:SoundChannel = new SoundChannel();
myChannel = myAudio.play();
mute_mc.buttonMode = true;
mute_mc.gotoAndStop(2);
//an event listener to check if the music on off button is clicked
mute_mc.addEventListener(MouseEvent.MOUSE_UP, muteSound);
function muteSound(event:MouseEvent):void {
if (mute_mc.currentFrame == 1) {
for(var n:Number = 1; n<7; n++) {
this["vol" + n].alpha = 1
}
//All sound channels
SoundMixer.soundTransform = new SoundTransform(1);
mute_mc.gotoAndStop(2);
} else {
for(n = 1; n<7; n++) {
this["vol" + n].alpha = 0.5
}
SoundMixer.soundTransform = new SoundTransform(0);
mute_mc.gotoAndStop(1);
}
}
//an event listener to check if the volume button is clicked
for(var n:Number = 1; n<7; n++) {
this["vol" + n].vol = n
this["vol" + n].addEventListener(MouseEvent.MOUSE_UP, changeVolume);
this["vol" + n].buttonMode = true
}
function changeVolume(e:Event):void {
//Without a sound channel:
var sTransform:SoundTransform = new SoundTransform();
sTransform.volume = (e.currentTarget.vol/6 * 100) * 0.01;
myChannel.soundTransform = sTransform;
for(var n:Number = 1; n<7; n++) {
if(n < e.currentTarget.vol + 1) {
this["vol" + n].alpha = 1
} else {
this["vol" + n].alpha = 0.5
}
}
}
myChannel.addEventListener(Event.SOUND_COMPLETE, myPlaybackComplete);
function myPlaybackComplete(event:Event):void {
myChannel = myAudio.play();
}
Applying filters with AS3
This tutorial will teach you how to apply, customize, and remove these filers from any object using ActionScript 3.0. The example below shows how the Blur, Glow, and Drop Shadow filters were applied to an MovieClip.
var blur:BlurFilter = new BlurFilter(5, 5, 100);
mc1.filters = [blur];
//drop shadow
var filt_shadow:DropShadowFilter = new DropShadowFilter(3,45,0x000000,0.5,4,4);
mc2.filters = [filt_shadow];
//glow effect
var filt_glow:GlowFilter = new GlowFilter(0xCCFF00,0.8,10,10);
mc3.filters = [filt_glow];
//apply all the filter
mc4.filters = [filt_glow, filt_shadow, blur];
//to remove the filter
//mc4.filters = [];
Drawing in AS3
ActionScript 3.0 graphics class allows us to have all the functionality of the flash interface while having a much smaller file size. In the example below we’ll create a simple line drawn across the stage using methods from the graphics class.
var clip:Shape = new Shape();
addChild(clip);
stage.addEventListener(MouseEvent.MOUSE_UP, drawFinish);
stage.addEventListener(MouseEvent.MOUSE_DOWN, drawLine);
stage.addEventListener(MouseEvent.MOUSE_MOVE, drawLine2);
//When the mouse is click, we use the moveTo() and lineTo() methods to draw our line.
//In our case the line will be 2px thick and have a decimal color of #000000.
function drawLine(evt:MouseEvent) {
clip.graphics.moveTo(mouseX, mouseY);
clip.graphics.lineStyle(2, 0x000000);
}
//We use the lineTo() methods to draw our line, this is where we'll will start drawing.
function drawLine2(evt:MouseEvent) {
clip.graphics.lineTo(mouseX, mouseY);
}
//on mouse release all the graphic info will be clear on the container.
function drawFinish(evt:MouseEvent) {
clip.graphics.clear();
}
Get All Objects In A Movieclip
Sometimes you want a list of everything inside a movieclip, first have to get the “number of children” (numChildren) in a DisplayObjectContainer, with the loop function you will get everything in a movieClip, even shapes you made there without a instance name.
trace ('\t|\t ' +i+'.\t name:' + target_mc.getChildAt(i).name + '\t type:' + typeof (target_mc.getChildAt(i))+ '\t' + target_mc.getChildAt(i));
}