Fireworks CS3 comes with some specifically built tools that allow you to
create the layouts for your Flex project in Fireworks and then export them into Flex
Builder. This enables you to leverage the graphics tools of Fireworks and lets you
design within an environment that you may already be familiar with.
Along with the new features of Fireworks, such as new symbols and Scale 9, there is an export feature
that lets you save a layout in Fireworks complete with the MXML that can build it in Fireworks.
Creating a Flex layout in Fireworks
In this chapter, we??™ll start by building a layout in Fireworks that combines images and Flex components.
We??™ll then export that layout as an MXML file that we??™ll bring into Flex Builder.
1. Begin by opening Fireworks and creating a new document, as shown in Figure 4-1.
Even though you??™ll later export this document to Flex Builder, you don??™t need to do anything special
at this point??”create the document as you would any other design in Fireworks.
Figure 4-1. Click the Fireworks Document (PNG) button.
72
CHAPTER 4
It is important to set the size for your project properly at this stage as the layout that Fireworks creates
is an absolute layout??”which means that the position of each element is fixed. This also means that the
overall size of the project, once it is imported into Flex Builder, will be the size of the Fireworks document
that you set when you first defined the project.
2. Set the size to 800 by 600, the canvas color to white, and the resolution to 72, as shown in
Figure 4-2.
Pages:
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70