10. The final step is to write the code for the custom UI. In a new layer,
enter the following into frame 1:
fscommand("allowscale", "false");
// Set the default property values
xch.tbase = 10;
xch.theight = 10;
xch.tcolor = 0x000000;
xch.applyTint = false;
// Initialize the base and height text fields
bs.text = 10;
ht.text = 10;
compute_fuqu(10, 10);
// Initialize the tint tile and color text fields
tsc = new Color(tintSq);
rc.text = gc.text = bc.text = "0";
setTintSq(0, 0, 0);
// Given a base and height value, compute the fuqu and set
the
// fuqu indicator based on the computed value
function compute_fuqu (b, h) {
var fuqu;
if (isNaN(b))
b = 0;
if (isNaN(h))
h = 0;
fuqu = b/h * 4.211;
if (fuqu == 4.211) {
fuquEval.gotoAndStop(1);
} else if (fuqu>= 2.211 && fuqu <= 6.211)
{
fuquEval.gotoAndStop(2);
} else {
fuquEval.gotoAndStop(3);
}
// Set the text field that shows the fuqu
fuquTF.text = Math.round(fuqu * 1000) / 1000;
}
// Given a red, green, and blue color value (0-255), create
a composite
// color value, set the tint tile, and return the composite color value.
function setTintSq(r, g, b) {
var col = r <<16 | g <<8 | b;
tsc.setRGB(col);
return col;
}
// When the base and height text fields change, recompute
the fuqu
// and set the appropriate property in xch
bs.onChanged = function () {
xch.tbase = this.text;
compute_fuqu(ParseFloat(this.text), ParseFloat(xch.theight));
}
ht.onChanged = function () {
xch.theight = this.text;
compute_fuqu(ParseFloat(xch.tbase), ParseFloat(this.text));
}
// Given an integer c, clamp it to values between 0 and
255
function boundColor (c) {
if (isNaN(c))
return 0;
if (c <0) {
c = 0;
} else if (c> 255) {
c = 255;
}
return c;
}
// When the color text fields change, change the tint color
// and set the appropriate property in xch
rc.onChanged = function () {
xch.tcolor = setTintSq(boundColor(this.text), ParseInt(gc.text),
ParseInt(bc.text));
}
gc.onChanged = function () {
xch.tcolor = setTintSq(ParseInt(rc.text), boundColor(this.text),
ParseInt(bc.text));
}
bc.onChanged = function () {
xch.tcolor = setTintSq(ParseInt(rc.text), ParseInt(bc.text),
boundColor(this.text));
}
// The check box (c) calls this function when the user checks
or unchecks
// the box. Set the applyTint property of xch appropriately.
function tintApply (c) {
xch.applyTint = c.getValue();
}
Jonathan Kaye, PhD, is the President and CTO of Amethyst Research LLC, an award-winning interactive design and engineering firm specializing in the creation of online device simulations. He and David Castillo are the authors of "Flash for Interactive Simulation: How to Construct and Use Device Simulations", to be published by Delmar Thomson Learning in November, 2002 (the accompanying web site will be www.FlashSim.com).
Tutorials Home
Tutorials » Actionscripting
How to Create a Flash MX Component
