OK, it’s trendy to the extreme, but I was checking out that “Web 2.0″ style you see all over the place now – you know, the slick, glossy, rounded corner, slight dropshadowed look. Come on, you know you love it. Anyway, I started analyzing how it some of it was done and started looking at coding it into AS3. The result, so far, is my GradientBar class, which you can invoke like so:
[as]var bar:GradientBar = new GradientBar(barColor, barWidth, barHeight, cornerRadius=5);[/as]
It extends Sprite, so you can use it as a display object, like so:
[as]var bar:GradientBar = new GradientBar(barColor, stage.stageWidth – 20, 34, 10);
bar.x = 10;
bar.y = 10;
bar.shadowType = “none”;
addChild(bar);[/as]
And here’s an example in use:
You can get the source here:
http://www.bit-101.com/as3/gradientbar/srcview/
(Note that the internal shapes are draw in into Shape objects!)
This usage example is a visual example only, not really the way I would code an interactive button bar, but still looks pretty cool. And the GradientBar class itself needs a lot of work itself. I’m just throwing it out there as an experiment more than anything else.
Goodness! What can I say! Hey you use the same code formatting as I do! … No, wait! There’s an equal sign without spaces around it in the constructor arguments! Hmmmmmm….
I’m writing a lightweight component framework for use in games! This will be of help! Thanks! Didn’t knew that it’s called Web2.0 look though!
Hi Keith,
i tried to make your class work as a skin but had some problems.
You can check out the result here: http://www.richapps.de/?p=45.
Anyway great work I like that style!
Hi,
I tried your code with the Flex 2 SDK on Linux and works great!!!
[...] I’ve become hooked on Twitter over the last couple of days. And then I found out they have feeds. There’s even AS2 and AS3 libraries available. But I just threw an app together using straight AS3 and E4X. I even used my GradientBar class from back in November. As a matter of fact, I looked it up on my own blog and downloaded my own code. How weird is that? [...]
[...] En la primera parte del tutorial vimos como configurar la tarea ANT para la compilación de nuestro swf. En ésta parte vamos a probar que dicha configuración funciona. Para ésto elegà un ejemplo de ActionScript 3 desarrollado por bit-101 (un blog que leo a menudo) a ver si lo hacemos funcionar en linux. Podemos descargarnos los ficheros si no queremos teclearlos en http://www.bit-101.com/as3/gradientbar/srcview/ [...]