Hi,
I think you draw another shape on the top of your first one and this
should be filled with a gradient as follows:
var colors:Array = [0xFFFFFF, 0xFFFFFF, 0xFFFFFF, 0xFFFFFF];
var alphas:Array = [0.75, 0.75, 0.075, 0.75];
var ratios:Array = [0, 127, 128, 255];
That should give you the white alpha overlay that is shown in the web page (he
does not really tell you all the gradient points in the tutorial, but from
doing it in the IDE, that's how it should work.
You might have to put both shapes in separate sprites so they can be
laid over one another...
Glen
Alexander Farber wrote:
Hi Glen,
On Sat, Oct 17, 2009 at 3:31 PM, Glen Pike <[email protected]> wrote:
The gradient overlay would be a layer on top of your button shape which
had a linear gradient white fill, with alphas [...@0%, 1...@50%, 0...@51%,
1...@100%]
sorry I still don't understand. Do you mean
var alphas:Array = [0, 0.5, 1, 0.1];
var ratios:Array = [0, 127, 128, 255];
? And if yes, what colors-Array should I use?
I'm attaching my code again:
Regards
Alex
package {
import flash.display.Sprite;
public class SimpleButtonExample extends Sprite {
public function SimpleButtonExample() {
var button:CustomSimpleButton = new CustomSimpleButton();
button.x = button.y = 100;
addChild(button);
}
}
}
import flash.display.*;
import flash.filters.*;
import flash.geom.*;
class CustomSimpleButton extends SimpleButton {
private var overColor:uint = 0xFFCC00;
private var downColor:uint = 0xFF6666;
private var upColor:uint = 0x00CCFF;
private var size:uint = 80;
public function CustomSimpleButton() {
downState = new ButtonDisplayState(downColor, size);
overState = new ButtonDisplayState(overColor, size);
upState = new ButtonDisplayState(upColor, size);
hitTestState = upState;
useHandCursor = true;
}
}
class ButtonDisplayState extends Shape {
private var bgColor:uint;
private var size:uint;
public static const SHADOW:GlowFilter =
new GlowFilter(0x000000, 1.0, 4, 4, 1, 1, false, false);
private static const GLOW:GlowFilter =
new GlowFilter(0xFFFFFF, 0.8, 40, 40, 1, 1, true, false);
public function ButtonDisplayState(bgColor:uint, size:uint) {
this.bgColor = bgColor;
this.size = size;
draw();
}
private static function brighten(color:uint, modifier:int):uint {
var red:int = (color >> 16) & 0xFF;
var green:int = (color >> 8) & 0xFF;
var blue:int = color & 0xFF;
red += modifier;
if (red > 0xFF)
red = 0xFF;
else if (red < 0)
red = 0;
green += modifier;
if (green > 0xFF)
green = 0xFF;
else if (green < 0)
green = 0;
blue += modifier;
if (blue > 0xFF)
blue = 0xFF;
else if (blue < 0)
blue = 0;
return (red << 16) | (green << 8) | blue;
}
private function draw():void {
var colors:Array = [brighten(bgColor, 120), bgColor, brighten(bgColor,
40)];
var alphas:Array = [1, 1, 1];
var ratios:Array = [0, 127, 255];
var matrix:Matrix = new Matrix();
matrix.createGradientBox(size * 4, size, Math.PI / 2, 0, 0);
graphics.beginGradientFill(GradientType.LINEAR, colors, alphas,
ratios, matrix);
graphics.drawRoundRect(0, 0, size * 4, size, 4);
graphics.beginFill(0x000000, 0.1);
graphics.drawRoundRect(0, size / 2, size * 4, size / 2, 4);
graphics.endFill();
filters = [ SHADOW, GLOW ];
}
}
_______________________________________________
Flashcoders mailing list
[email protected]
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
--
Glen Pike
01326 218440
www.glenpike.co.uk <http://www.glenpike.co.uk>
_______________________________________________
Flashcoders mailing list
[email protected]
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
