Flex 2.0 SVG Support

I’m finding all sorts of little gems in the Flex 2.0 help files. Flex 2.0 supports embedding SVG files just like other images like JPEG or PNG using the [Embed] meta tag:

Flex supports a subset of the SVG 1.1 specification to let you import static, two-dimensional scalable vector graphics. This includes support for basic SVG document structure, Cascading Style Sheets (CSS) styling, transformations, paths, basic shapes, and colors, and a subset of text, painting, gradients, and fonts. Flex does not support SVG animation, scripting, or interactivity with the imported SVG image.

With that in mind, it’s now possible to visually build vector art assets for Flash using open source programs. That’s one of the big things the OSFlash movement has been missing. If you’re looking for a nice SVG program, I’d recommend Inkscape. Does anyone know of other good choices?

About Josh Tynjala

Josh Tynjala is a frontend developer, open source contributor, bowler hat enthusiast, and karaoke addict. You might be familiar with his project, Feathers UI, an open source user interface library for Starling Framework that is included in the Adobe Gaming SDK.

Discussion

  2. maumac

    I’m actually using Inkscape to draw the sprites for a flash game I’m developing on.

    I was really amazed when I found out that mxmlc could import SVG! I was hoping to see some SVG-SWF integration with Macromedia being bought by Adobe, but I’d never imagine it would come so soon (I know, the SVG embed stuff is there since the thing was released under Macromedia label, but you get the point :).

    It not only eases art production on flash OS projects, but also benefits all kinds of projects by opening up possibilities and smoothening workflows.

    Now we have many choices of different flavours to pick when making art for flash player apps, from OS Inkscape to industry-standard Illustrator. These two examples alone show how this move brought benefits for both OS and MacDobe.

    Now you can just create a graphic in , save it, mxmlc’it, and it’s done in the SWF!

    The embed stuff though is kinda weird way to manage assets IMHO, the way it’s currently implemented. But that’s another story.

  3. Josh Tynjala

    I think the embedding makes a lot of sense. If you want to make it more like a Flash-style library, I suggest building a Library class that contains all your embeds. Then you can access all your embeds from one location:

    mySprite = new Library.MyEmbeddedAsset();
this.addChild(mySprite);
  4. maumac

    I was actually using a library class approach, but was not being successfull in finding a way to implement it in a very productive manner. Your snippet clarified it, one static member of type Class for each asset. Thanks a lot!

  5. Amos

    Does anyone know of an example of using SVG fonts in Flex? Do they only work in embedded SVGs?