Changing Colors Using ActionScript

programming flash
1

Hi There,
Looking at the Changing Colors Using ActionScript tut. on the website, can any one tell how to tween the changing colours

Tanks,
J…

2

well, to tween you’d need to fade through each of the RGB components of the color… something like this:


var startColor = {r:50,g:100,b:250};
var endColor = {r:250,g:0,b:120};
var t = 0;
var oColor = new Color(myMovieClip);
this.onEnterFrame = function() {
  t += 0.1; // Change this value for a faster/slower fade..
  if (t < 1) {
    fadeColor(oColor,startColor,endColor,t); // Fade to new value
  } else { // Fade is over
    fadeColor(oColor,startColor,endColor,1); // Set to end color
    delete this.onEnterFrame; // Delete frame loop
  }
}
function fadeColor(oColor,startColor,endColor,t) {
  // oColor is the color object to do the fade on
  // t is the value of the fade in the range of 0..1
  var newR = (endColor.r - startColor.r)*t + startColor.r;
  var newG = (endColor.g - startColor.g)*t + startColor.g;
  var newB = (endColor.b - startColor.b)*t + startColor.b;
  oColor.setRGB( newR << 16 | newG << 8 | newB );
}
3 
// prototype
MovieClip.prototype.fadeColor = function(cto, ease) {
	var myColor = new Color(this), cColor = myColor.getTransform();
	this.onEnterFrame = function() {
		for (var c in cColor) {
			cColor[c] += (cto[c]-cColor[c])/ease;
		}
		myColor.setTransform(cColor);
	}
}
// usage
myMovieClip.fadeColor({rb:204, gb:0, bb:0, ab:255}, 10);

parameters

cto: color transform object.
ra is the percentage for the red component (-100 to 100).
rb is the offset for the red component (-255 to 255).
ga is the percentage for the green component (-100 to 100).
gb is the offset for the green component (-255 to 255).
ba is the percentage for the blue component (-100 to 100).
bb is the offset for the blue component (-255 to 255).
aa is the percentage for alpha (-100 to 100).
ab is the offset for alpha (-255 to 255).

ease: ease (there’s no need for explanation). :stuck_out_tongue:

Make your choice. :wink:

4

Thank-you both,

I ended up using brainys code which worked straight away.

wicked !!!

5

dances around woop, my code worked straight away, and i typed it up in the quick reply box… makes you feel like you know your flash :wink:

6

good code brainy (and kax of course :beam: )

i just dont get what this does:

    oColor.setRGB( newR &lt;&lt; 16 | newG &lt;&lt; 8 | newB );
7

it combines the 3 components into one 24bit color value… it shifts the red by 16 bits to the left, and or’s it with the green shifted 8 bits to the left and or’s it with the blue. yup yup. i actually did a pretty extensive explanation on that at the bit-101 forums so you might wanna look it up there.

8

ok i looked at brainy code and i understood thats what i want to do

but where do i put everything??


well, to tween you'd need to fade through each of the RGB components of the color... something like this:

ActionScript:--------------------------------------------------------------------------------var startColor = {r:50,g:100,b:250};
var endColor = {r:250,g:0,b:120};
var t = 0;
var oColor = new Color(myMovieClip);
this.onEnterFrame = function() {
        t += 0.1; // Change this value for a faster/slower fade..
        if (t < 1) {
                fadeColor(oColor,startColor,endColor,t); // Fade to new value
        } else { // Fade is over
                fadeColor(oColor,startColor,endColor,1); // Set to end color
                delete this.onEnterFrame; // Delete frame loop
        }
}
function fadeColor(oColor,startColor,endColor,t) {
        // oColor is the color object to do the fade on
        // t is the value of the fade in the range of 0..1
        var newR = (endColor.r - startColor.r)*t + startColor.r;
        var newG = (endColor.g - startColor.g)*t + startColor.g;
        var newB = (endColor.b - startColor.b)*t + startColor.b;
        oColor.setRGB( newR << 16 | newG << 8 | newB );
}