6. Copy the images into your assets folder for this project. To find the assets folder, go to the
folder that was created for the project (Figure 3-4).
You can find the image component in the Controls folder in the Components panel (Figure 3-7).
7. Drag an image component onto the panel you created.
Figure 3-7. Dragging an image component
8. Enter the file name of the image in the Source
field in Properties to bring it in and set the
size of the component to match the image
(Figure 3-8).
Figure 3-8. Specifying the image name
51
WORKING WITH STATES
For the layout, you can drag and drop it into the place that you want it. Guidelines will appear to help
you align the image with other components. If you want to do more detailed movements, use the
arrow keys to move the component one pixel in any direction. If you hold down Shift as you press the
arrow keys, the component will move 5 pixels at a time.
9. Place the image where you want it to end up in the final design (Figure 3-9).
Figure 3-9. Positioning the image
10. Repeat the same process to bring in the other two images??”try to end up with something like
Figure 3-10.
Figure 3-10. All images in position
11. Next bring in the panels along the right side of the page.
52
CHAPTER 3
Each of these panels is the same component as the main panel. Bring one in and set its title to be Who
he is (or Who she is, as the case may be). This will be the profile area. Do not worry about the size of
the panel just yet??”it will be dependent on the amount of content you want to put in (Figure 3-11).
Pages:
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61