Sin bounce...compatibility problems away

[goto()]

I dont know if this have been published before... but I got a beautiful bounce effect using simple trigonometry. ;)
In the attachment, the A value controls the bounce increase in the first launch (The amplitud of sin function), The i increment defines the function period (T) the bouncing times....thats all.
Its easy and useful and itss functionally on MX and MX 2004...No problem :P
Tell me what do you think.

:::::goto()::::::

[Krilnon]

That's a really neat looking bounce! Thanks for sharing :)

[goto()]

Yeah, its neat.... I love it.. :P

[TheCanadian]

That is really cool especially since it is all done in action script. I'll have to study that code and polish up my trigonometry.

[goto()]

Thats your task Canadian ;)

[MMXII]

How would you do this using mulitple objects?

[fuekewl]

@goto() very kewl effect for such a little bit of code!

just curious why you applied the onEnterFrame handler to the entire stage and not the specific ball mc ... ?

@MMXII

put any amount of mc's in a holder mc, called "container_mc" say.


for (j in container_mc) {
container_mc[j].i = 0;
container_mc[j].A = 200;
container_mc[j].onEnterFrame = function() {
this.A *= .95;
this.i += 0.3;
this._yscale = this._xscale=Math.sin(this.i)*this.A+150;
};
}
you could possibly randomize the variables in the for loop to get a more organic/random look for the objects ...

[W84me]

You can use cos with _yscale to get a ripple like effect. :)

[denizengt]

I'm sure I've seen this done 10,000 times online - someone enlighten me as to how is this different? There's that "custom easing tool" which does the same thing?

[theflash]

looks cool, but motion does not seem fluid enough (or may be it's just me)

and yeah you should mention what is different in your experiment

[MMXII]

Any chance of any one know how to randomize the variables for this code?? I am trying to use this type of bounce onto several objects on the stage at once. I am also trying to add a bit of randomness to each of them. any help would be greatly appreciated.



@goto() very kewl effect for such a little bit of code!

just curious why you applied the onEnterFrame handler to the entire stage and not the specific ball mc ... ?

@MMXII

put any amount of mc's in a holder mc, called "container_mc" say.


for (j in container_mc) {
container_mc[j].i = 0;
container_mc[j].A = 200;
container_mc[j].onEnterFrame = function() {
this.A *= .95;
this.i += 0.3;
this._yscale = this._xscale=Math.sin(this.i)*this.A+150;
};
}
you could possibly randomize the variables in the for loop to get a more organic/random look for the objects ...

[fuekewl]

Any chance of any one know how to randomize the variables for this code?? I am trying to use this type of bounce onto several objects on the stage at once. I am also trying to add a bit of randomness to each of them. any help would be greatly appreciated.
you could just randomize the amplitude, scaling and increment ...


function randRange(min:Number, max:Number):Number {
var randomNum:Number = Math.floor(Math.random() * (max - min + 1)) + min;
return randomNum;
}

for (j in container_mc) {
container_mc[j].iDelta = randRange(80, 100) * 0.4/100;
container_mc[j].A = randRange(60, 100) * 200/100;
container_mc[j].scaling = randRange(60, 100) * 200/100;
container_mc[j].onEnterFrame = function() {
this.A *= 0.95;
this.i += this.iDelta;
this._yscale = this._xscale=Math.sin(this.i)*this.A+this.scaling;
};
}


I've used the AS2.0 randRange function that flash ships with, it gives you more control when specificying your random number range. You could use the Math.random() instead, your choice.

In the for loop, alter the A, iDelta and scaling vars randRange if you want. (I've kept the range a percentage of the value)

[MMXII]

@fuekewl

Thanks for the help. I have worked on the code with a fellow developer, I just cant figure out how to get the bounce centered, then remain in the same spot.:m2:

code in 1st frame

coolness = function(name, var_i, var_A){
name.i = var_i;
name.A = var_A
name.onEnterFrame=function(){
this.A *= .95;
this.i += .3;
this._yscale = this._xscale=(Math.sin(this.i)*this.A) + 150;
}
}

code on button

on(rollOver) {
coolness(this, 100 , 200);
}

[fuekewl]

Make sure your registration point (that small, white circle) of your button is centered and not top-left.

The registration point is the origin point of the '_xscale' and '_yscale' property.

[MMXII]

The registraion points are there, but thanks for the suggestion. I am trying to figure out how to get the button to stay on the x coordinate. I want the button to expand but not move from the x coordinate. Is there a way to counter the %150 with a certain number of pixels?

[goto()]

Hey!
I reviewed the code for a project and adjusted it to define a final position for the bounce effect. As you can see, define that position in the xf value.
ActionScript Code:

var i = 0;
xf=200;
A=xf/2;
onEnterFrame = function () {
A *= .9;
i += 0.25;
ball._x += (xf-ball._x)/2 + Math.sin(i)*A;
};




The bounce coefficient(amplitude) is calculated from xf, you can change it as you want. Just be carefull when the final position is lower than the actual 'ball' position, it wont work fine. To solve that just change this sign
ActionScript Code:

ball._x += (xf-ball._x)/2 - Math.sin(i)*A;




You can easily solve this with a condition :}

I hope can help you, the big problem of my last one was obtaining a certain final position. Here is also the file (MX2004)