Using the MXML and Images export feature in Fireworks CS3, you can convert a layout in Fireworks into an MXML document for use in Flex. This export takes the Flex components in Fireworks and converts them into their respective MXML tags in the resulting MXML. Though the possibilities for this are numerous, Fireworks only comes with a subset of the components available in Flex. Each of those components also only has a limited number of properties that you can edit to be carried over into the MXML. What if you need more? What if you want to make your own components?

Thankfully, the MXML and Images export feature was designed to be able to work with more than just those Flex components that come with Fireworks. With a little bit of JavaScript, you can make your own rich symbols that can represent custom components in an MXML and Images export. Read further to learn how.

Requirements

To make the most of this tutorial, you'll need the following software and files:

Fireworks CS3

• Try
• Buy

Flex Builder 2

• Try
• Buy

Sample files:

• rich_symbols_export.zip (ZIP, 652K)

Prerequisite knowledge

Before reading this article, you should have a basic understanding of working with JavaScript and know how to create a custom rich symbol in Fireworks. You should also be familiar with MXML, how it is used with Flex, and how a Fireworks document can export to MXML using the MXML and Images export feature.

Page 1 of 4

Next Page

About the author