Skip navigation

Button Grow Fuse Example

Here is an example using Fuse Kit and the Zigo tweening engine to make a grow effect on a button.

[kml_flashembed movie=”/wp-content/uploads/fuse/Button-Grow-Tween.swf” width=”700″ height=”300″ /]

And here is the code:

[as]
/*****************************************************************************
=============================================================================
EXAMPLE FILE:
Create a button that grows when you mouse over it.
=============================================================================
EXAMPLE CREDIT:
Ryan Potter
www.ThoughtWillRise.com
License: Same as Fuse.
=============================================================================
FUSE CREDIT:
Fuse Kit 2
Copyright (c) 2006 Moses Gunesch, MosesSupposes.com
Distributed under MIT Open Source License, see Fuse-Kit-License.html (in fuse package directory)
Easing Equations (c) 2003 Robert Penner used by permission, see PennerEasing
Visit http://www.mosessupposes.com/Fuse
=============================================================================
EXPLANATION:
Load in the Fuse classes.
Register Penner’s easing equations.
Draw a box on the stage.
Draw some text on the stage.
Place the start position of the x and y into separate vars so that when you mouse off
the box you can move it back to where it was.
Create roll handlers that call a tween to make the box get bigger and move over a bit
to make it center.
=============================================================================
*****************************************************************************/
// IMPORT THE CLASSES
import com.mosesSupposes.fuse.*;
init(); // Start things going

function init(){
ZigoEngine.register(PennerEasing);
this.drawBox();
this.drawLabel(this, “Mouse over the box to see the tween”, 20, 20);
this.drawTween();
}

function drawTween(){
this.box.startx = this.box._x;
this.box.starty = this.box._y;
this.box.onRollOver = function (){
ZigoEngine.removeTween(this);
ZigoEngine.doTween(this, ‘_width,_height,_x,_y’, [110,110,this.startx-5,this.starty-5], 1, Expo.easeOut);
}
this.box.onRollOut = function (){
ZigoEngine.removeTween(this);
ZigoEngine.doTween(this, ‘_width,_height,_x,_y’, [100,100,this.startx,this.starty], 1, Expo.easeOut);
}
}
function drawBox(){
this.box = this.drawClip(this, “box”, this.getNextHighestDepth(), 100, 100, 0xFFCC00);
this.box._x = 250;
this.box._y = 100;
}

function drawClip(target, clip, depth, w, h, color){
var c = target.createEmptyMovieClip(clip+depth, depth);
c.beginFill(color, 100);
c.moveTo(0,0);
c.lineTo(w,0);
c.lineTo(w,h);
c.lineTo(0,h);
c.lineTo(0,0);
c.endFill();
return c;
}

function drawLabel(target, text, x, y){
target.createTextField(”tf”, target.getNextHighestDepth(), x, y, 10, 10 );
target.tf.autoSize = true;
target.tf.multiline = false;
target.tf.wordWrap = false;
target.tf.text = text;
var my_fmt:TextFormat = new TextFormat();
my_fmt.bold = true;
my_fmt.color = 0xffffff;
my_fmt.font = “_sans”;
target.tf.setTextFormat(my_fmt);
}

[/as]

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*