Home > flex, video > Skinning a list in Flex 4 – Magnifier Effect

Skinning a list in Flex 4 – Magnifier Effect

Here’s a little video about how to use different Spark components to make a magnifier effect for a list. To create this effect I did the following:

  • used the Spark Component model with Skins and States
  • employed the new Spark item renderer that support Designer/Developer workflow
  • Parametrize Spark Skins with CSS

You can download the final project from here and watch the video here.


Categories: flex, video Tags:
  1. Oscar
    August 18th, 2009 at 13:10 | #1

    Great! This was something I was looking for. Something that I’m missing, is the magnefier changing back to the last-selected option when hovering out.

  2. André
    August 19th, 2009 at 20:06 | #2

    Nice tutorial, very good place to start studying new flex4 capabilities.
    Thanks

  3. September 1st, 2009 at 23:45 | #3

    Very nicely done.
    The Style tips and the setLayoutTransform() – in your video – are really nice.

    Thank you very much.

    PS Also loved the whiteboard view of the magnifier algorithm.

  4. February 16th, 2010 at 20:01 | #4

    Very cool effect, might be nice if it works in the TileLayout view, could be really cool for music application views (Album artwork) etc….

  5. marcelo
    March 23rd, 2010 at 22:53 | #5

    Magnifier Effect doesn´t work Adobe Flash Builder (Flex 4) final version!
    when we have new verison? error on tag reziseMode=”scale”

  6. Hilary Bridel
    June 4th, 2010 at 09:03 | #6

    @marcelo
    Use the fillMode instead of resizeMode.

  1. March 11th, 2010 at 19:47 | #1
  2. March 15th, 2010 at 16:12 | #2
  3. April 9th, 2010 at 07:20 | #3
  4. May 26th, 2010 at 18:32 | #4