Aqua Buttons in JSFL

I’ve been making a large set of new UI components and trying to get some nice skins going for them. Although I am a PC guy, I’ve always admired the style of the Mac interface.

There are about a million tutorials out there on how to make Mac style aqua buttons in Photoshop and Fireworks, and it’s relatively easy to do, but I didn’t want to be importing bitmaps. So I took one of the Fireworks tutorials and duplicated the actions as much as I could in Flash. The result was surprisingly nice. I also realized that everything I was doing could be done in JSFL. So I sat down and made a JSFL command to do just that.

Here is is: http://www.bit-101.com/jsflstuff/aquabutton.zip.

Just unzip that into your commands directory and you’re good to go. Choose the command from the commands menu and you get a dialog where you can choose the color button, size and a unique library name. The new button is created in a movie clip and placed on stage for you.

Realize that this is more of a button skin than an actual button with different states. You’ll have to make three different buttons with slightly different colors and assemble them into a real button if that’s what you want.

Update: Just fixed it up so it appears stable on a Mac now. Thanks to Sam Robbins for letting me crash his computer multiple times while I sorted it out.

This entry was posted in Flash. Bookmark the permalink.

5 Responses to Aqua Buttons in JSFL

  1. Nice work Keith.

    Mind sharing what caused the Mac instabilities? I’d definitely be interested in that so that I can avoid crashing my own Mac multiple times. 😉

  2. Joe Martinez says:

    Impressive. Please keep up the good work. Your blog is excellent.

  3. Keith Peters says:

    Grant, yeah, it’s an issue with the fill object in JSFL. The help lists four properties: color, colorArray, posArray, and style. It doesn’t mention matrix. On a pc, if style is “radialGradient” or “linearGradient” and you don’t define every property, Flash will freeze and crash. But if you are style is “solid”, you only need to define color. (this is covered in Extending Flash MX 2004, btw.) However, as I discovered today, on a Mac, you apparently need to define all the properties even if you are just making a solid fill. That’s what was causing the crash.

  4. mike lyda says:

    This is nice. Thanks much!

  5. Lucas Swick says:

    Thanks for sharing. This is great and gets me thinking more about the implications of jsfl on workflow.

Comments are closed.