1. Home
  2. Computing & Technology
  3. Animation

Deconstructing the Paint Application VI: The Gradient Rectangle Tool

By , About.com Guide

3 of 8

Setting Starting Variables for Gradients

Before we move on to the behavior that draws the gradient rectangle when the mouse button is released, first we need to define certain variables using onclipEvent (load) to set default values when the movie initially loads, and then check and update the values for those variables from the input text boxes using an onClipEvent (enterFrame):
onClipEvent(load){
_root.layer.gradientcolor1=0xFF0000;
_root.layer.gradientcolor2=0x0000FF;
_root.layer.gradientalpha1=100;
_root.layer.gradientalpha2=50;
_root.base.gc1="FF0000";
_root.base.gc2="0000FF";
_root.base.ga1="100";
_root.base.ga2="75";
}

onClipEvent(enterFrame) {
testcolor1="0x"+_root.base.gc1;
testcolor2="0x"+_root.base.gc2;
//make the color boxes display each individual gradient color
gradcol1=new Color(_root.base.gdcolor1);
gradcol1.setRGB(testcolor1);
_root.base.gdcolor1._alpha=_root.base.ga1;
gradcol2=new Color(_root.base.gdcolor2);
gradcol2.setRGB(testcolor2);
_root.base.gdcolor2._alpha=_root.base.ga2;
}

To break this down in brief: this sets the starting gradient colors using the appropriate 0xFF0000 format hexadecimal values, but also fills the input boxes for the current gradient colors with the standard FF0000 format values. It also sets the starting opacities for each gradient color at 100 and 75.

Each time the frame reloads, the value in the input text boxes is read and then concatenated with 0x to put it in 0x000000 format (represented by variables testcolor1 and testcolor2), and then setRGB is used to change the color swatch representing the current gradient colors to match.

Explore Animation
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Animation
  4. Flash Animation Tutorials
  5. Deconstructing the Paint Application VI: The Gradient Rectangle Tool

©2009 About.com, a part of The New York Times Company.

All rights reserved.