Flex 3 Skin Transitions with Degrafa and AnimateColor

It is always fun when you discover new product features that you never knew existed. This happened to me last week as I was looking into Flex 3 skinning. It turns out that not only can you use a single class with states to define component skin states (like “up”, “down”, and “over” on a Button) but transitions also work with these skins! This feature has been noticed by others as well. But I figured I’d blog about it anyways – because it’s so cool!

Here is a quick demo:

I used Darron Schall’s “AnimateColor” effect to transition between colors. And I used Degrafa to draw the shapes inside the skin.

It’s super easy to add these types of transitions to your application! Right-click on the application to see the source code.

Have fun making your Flex apps even sexier!

This entry was posted in Flex. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

One Comment

  1. Posted April 15, 2008 at 1:23 pm | Permalink

    Nice ! Great example.

    I feel like a shill posting first, but it had to be said. :) On a side note we are working states directly into the Degrafa skins.

    cheers

    -jason

One Trackback

  1. [...] everyone to go grab a build and give it a whirl. I did because I wanted to see how I could take a sample I built with Flex 3, Degrafa, and AnimateColor and build the same thing with Flex Gumbo. [...]

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Subscribe without commenting

  • About James Ward



    View James Ward's profile on LinkedIn

  • First Steps in Flex by James Ward and Bruce Eckel




  • Twitter Updates


  • Tour de Flex