• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 4. Working With Menus > Building a Menu with Objects and Layers

Building a Menu with Objects and Layers

As you've seen in the previous section, you can draw on the templates in the Library palette to create menus, and then alter the menus as needed. In addition to the process outlined in the previous section—adding items to the Library palette, then using them in a menu—you have many other options. You can select images, buttons, menus, and the like from elsewhere in your project or from any other folder on your computer or network and use them in a menu.

As you continue to design and customize your menus, you'll be using a trio of complementary tools: the Menu Editor, the Layers palette, and the Toolbox.

You'll rely on the Menu Editor to size and position the various onscreen objects that make up your menu. You'll use the Layers palette to determine how those objects stack up. The Layers palette also displays layer sets—layers within layers, organized in folders (Figure 4.47).

Figure 4.47. A quick look at the Layers palette, with a layer set opened up.


I use the terms objects and layers interchangeably here. They both refer to the images, buttons, and text that make up menus. When you are working in the Menu Editor, you see and manipulate objects on the screen. Those same objects appear as layers in the Layers palette. “Just like in Photoshop,” you're probably thinking, and you're right. You can use the Menu Editor and the Layers palette interactively as you put your menus together, and you have tools similar to those in Photoshop to enable you to position, resize, and reorder the elements in your menu.

In the small, floating Toolbox you choose from two types of selection tools (Figure 4.48):

  • The Selection tool (the black arrow) is the most commonly used tool in the palette. You use it to select entire layers and layer sets, and also to reposition and resize objects with the objects' selection handles.

  • You use the Direct Select tool (the white arrow) to select and modify individual elements within layer sets. It would be used, for instance, to “break apart” the different elements in a button layer set so you can modify certain elements independent of the others.

Figure 4.48. The Toolbox, with emphasis on the two selection tools.


Except in cases where you need to move individual elements in a layer set, it's best to use the Selection tool. There are times when menu choices will be unavailable to you if the Direct Select tool is active.

✓ Tips

  • With this method, the item will be added as a layer on top of any existing background in the menu. To replace an existing background layer, see the information on using the Library palette and the Place function earlier in this chapter.

  • As you might expect, you can also select and drag multiple items into the Menu Editor with this method.

  • You can also drag and drop timelines and menus into the Menu Editor. These two types of items automatically become buttons in the menu and are assigned a default button shape. More information about this can be found in Chapter 5.


To add an object (or layer) to a menu:

1.
Create or open a menu following the steps described earlier in the chapter.

2.
Select an image file from the Project tab and drag it onto the Menu Editor (Figure 4.49).

Figure 4.49. It's a bit hard to see, but this shot of the Golden Gate is being dropped into the Menu Editor.


Or

  • Navigate to a folder and select a one-layer image file or a Photoshop file with one or more layers. Drag and drop it onto the Menu Editor window.

    The selected item is now added to the menu, on top of any existing backgrounds or layers.

To delete an object (or layer) from a menu:

1.
Choose either the Selection tool or the Direct Select tool from the Tools palette. (See the earlier description of each to decide which tool to use.)

2.
Use your chosen tool to select an object (or objects) in the Menu Editor.

3.
Right-click and choose Clear (Figure 4.50).

Figure 4.50. If the shot doesn't work, it's easy to get rid of it.


Or

1.
Select a layer (or layers) in the Layers tab (Figure 4.51).

Figure 4.51. You can also get at an element in a menu in the Layers palette and then delete it.


2.
Choose Edit > Clear to delete the selected layer(s).

Whether you use the Menu Editor or the Layers palette to delete objects and layers, the result is the same: Any items that were below the deleted item move up in the layer hierarchy, toward the foreground.

To move and resize an object:

1.
In the Menu Editor, select the item to be modified.

Selection handles appear around the object (Figure 4.52).

Figure 4.52. Selection handles appear around selected objects in the Menu Editor.


2.
To use the selection handles, do one or more of the following:

  • Click within the edges of the object and reposition it freely within the Menu Editor.

  • Select and drag a handle to resize the object (Figure 4.53).

    Figure 4.53. Resizing and repositioning is a breeze in Encore DVD.


  • Shift-drag a handle to proportionally resize the object.

  • Alt-drag a handle to resize from the object's center point. (The center point maintains its position on the page.)

  • Shift-Alt-drag to resize proportionally from the object's center point. (The center point maintains its position on the page.)

✓ Tips

  • Use the zoom capabilities within the Menu Editor or the Zoom tool in the Tools palette to help as you make modifications (Figure 4.54).

    Figure 4.54. You can get very close to your material with the Zoom tool.

  • You can select multiple objects and move or resize them as a group in the Menu Editor.

  • If the Direct Select tool is active, you may accidentally modify individual parts of a layer rather than the entire layer. Unless you specifically need to adjust individual items inside a layer set, use the Selection tool.


To align objects:

1.
Choose Object > Align (Figure 4.55) and Select (or deselect) Relative to Safe Areas.

Figure 4.55. The Object menu enables you to rearrange the items in your menu.


With Relative to Safe Areas selected, the objects will be aligned relative to the Safe Area guides in the Menu Editor. With it deselected, the objects will be aligned relative to each other.

2.
Using the Selection tool, Shift-select multiple objects in the Menu Editor (Figure 4.56).

Figure 4.56. Here are three objects in rather haphazard positions in the Menu Editor.


3.
Choose Object > Align again.

4.
Select one of the options in the Align submenu (Figure 4.57).

  • Left aligns the left sides of the selected objects to either the left side of the Title Safe area or the leftmost object.

  • Center aligns the center of the selected objects to the center of the Title Safe area or to the center of a bounding box containing the selected objects.

  • Right aligns the right side of the selected objects to either the right side of the Title Safe area or the rightmost object.

  • Top aligns the top of the selected objects to either the top of the Title Safe area or the topmost object.

  • Middle aligns the middle of the selected objects to either the center of the Title Safe area or the center of a bounding box that encompasses all the objects.

  • Bottom aligns the bottom of the selected objects to either the bottom of the Title Safe area or the lowest object.

Figure 4.57. Some of the many alignment choices.


The objects align themselves along horizontal and vertical axes according to the option you choose in reference to the middle of the screen. In this example, the elements are aligned horizontally by their middle points (Figure 4.58).

Figure 4.58. Step one accomplished. Now they need to be redistributed onscreen.


To distribute objects evenly:

1.
Using the Selection tool, Shift-select multiple objects or buttons in the Menu Editor.

2.
Choose Object > Distribute and select one of the options from the submenu (Figure 4.59).

Figure 4.59. Redistributing can happen either up/down or side to side.


The objects are evenly spaced onscreen, either vertically or horizontally, and in accordance with the Relative to Safe Areas option. Figure 4.60 shows an example of horizontal distribution after alignment.

Figure 4.60. Now all the shots are evenly placed.


To change an object's orientation:

1.
Select one or more objects in the Menu Editor.

2.
From the Object menu, choose a flip option (Figure 4.61).

Figure 4.61. You can choose your flip options in the Object menu.


✓ Tips

  • Multiple objects must be on the same layer in the menu.

  • Any type of object on a layer can be flipped. The background layer cannot be flipped.


To create alignment guides in the Menu Editor:

1.
Do one of the following:

  • Choose View > Show Guides (Figure 4.64).

    Figure 4.64. There are two ways of showing guides in a menu. This is one…


  • Click the Show Guides button at the bottom of the Menu Editor window (Figure 4.65).

    Figure 4.65. ...and this is the other, located at the bottom of the Menu Editor.


Any existing guides will be displayed in the Menu Editor.

2.
Do one of the following:

  • Choose View > New Guide (Figure 4.66).

    Figure 4.66. One way of creating a new guide, via a menu...


  • Click the New Guide button at the bottom of the Menu Editor window (Figure 4.67).

    Figure 4.67. …and a second method, creating a guide from a button.


    The New Guide dialog appears (Figure 4.68).

    Figure 4.68. You specify a starting position for either vertical or horizontal guides in this dialog.


3.
Select Horizontal or Vertical orientation, enter a position, and click OK.

A green line appears and is set at the onscreen pixel position specified.

4.
Repeat these steps as necessary. You can have multiple guides in a menu (Figure 4.69).

Figure 4.69. The guides are a bit hard to see here, but they're very handy for lining up elements in your menu.


To move a guide:

1.
With the Menu Editor active, click either of the selection tools in the Toolbox (Figure 4.70).

Figure 4.70. The Toolbox selection tools, in close-up.


2.
Select a guide in the Menu Editor. The pointer will turn into a double-headed arrow (Figure 4.71).

Figure 4.71. Again, it's a bit hard to see in this picture, but this guide is being moved by the double-headed arrow.


3.
Drag the guide to a new position and release.

To enable the Snap to Guide function:

  • Choose View > Snap to Guides (Figure 4.72).

    Figure 4.72. Turning on the Snap to Guides function.


    With Snap to Guides enabled, the edges and center points of selected objects (and the baseline of text objects) will snap to the guides in the menu. With it disabled, objects can be positioned freely.

To lock menu guides:

  • Choose View > Lock Guides (Figure 4.73).

    Figure 4.73. Lock Guides is very handy for preventing you from bumping your guides out of position.


    With Lock Guides enabled, current guides cannot be moved or deleted. Choose View > Lock Guides again to unlock the guides.

To remove menu guides:

  • Do one of the following:

    • To remove a single guide, select it and drag it completely outside the Menu Editor window.

    • To remove all guides, choose View > Clear Guides (Figure 4.74).

      Figure 4.74. When you're done with your guides, this will get rid of them.


✓ Tips

  • Guides are visible only in the Menu Editor window. You do not see them when previewing or in the final DVD.

  • The guides you create are saved in the menu. They travel with the menu if you use the Edit in Photoshop feature, and any changes you make in either program are saved with the menu.

  • When placing guides, the pixel location you type in is relative to the Menu Editor screen, with the zero point being the top-left corner.

  • The pixel locations you specify when creating guides are relative to the menu, and will be calculated differently for different pixel aspect ratios. If you create guides in a square-pixel menu, their positions will not line up with guides created in a nonsquare pixel menu.


To arrange the layer order of objects:

1.
Do one of the following:

  • Using the Selection tool, select one or more objects in the Menu Editor.

  • Select a layer in the Layers tab (Figure 4.75).

    Figure 4.75. This layer needs to be lower in the list.


2.
Choose Object > Arrange and select one of the options in the submenu (Figure 4.76).

Figure 4.76. You can send a layer in several different directions from the Object menu.


The selected object moves toward the foreground or background, according to the option you choose. Figures 4.77 and 4.78 illustrate moving an object backward.

Figure 4.77. This is the “before” example. The shape is obscuring the picture on the right.


Figure 4.78. This is the “after” example. The shape has been moved backward one layer, behind the picture.


✓ Tip

  • You can also cut/copy/paste to rearrange layers in the Layers palette.


To lock or unlock a layer:

1.
In the Layers tab, click the Lock/Unlock column for any layer (Figure 4.79).

Figure 4.79. Locking a layer prevents deleting or changing it.


A lock icon appears. The layer is now locked and cannot be altered or deleted.

2.
To unlock a layer, click on the lock icon.

✓ Tips

  • Each layer must be locked or unlocked individually.

  • With layer sets, you can lock either the entire folder or the individual layer(s) inside the set (Figure 4.80).

    Figure 4.80. This is an example of locking layers inside a layer set.


To hide or show a layer:

1.
In the Layers tab, click on the “eye” icon in the Hide/Show column for any layer.

The eye icon disappears, and the layer is hidden (Figure 4.81).

Figure 4.81. Another “before-and-after” example. This is with the title layer hidden…


2.
To toggle a layer back to its show state, click in its Hide/Show column again.

The eye icon is displayed, and the layer is shown (Figure 4.82).

Figure 4.82. …and this is the same menu, with the title layer returned to its “show” state.


To rename a layer:

1.
Do one of the following:

  • Right-click on a layer (a.k.a. an object) in the Menu Editor and choose Rename from the contextual menu (Figure 4.83).

    Figure 4.83. Renaming a layer from the Menu Editor.


  • Select a layer in the Layers palette and choose Edit > Rename.

  • Double-click on a layer in the Layers palette.

    The Rename Layer dialog appears (Figure 4.84).

    Figure 4.84. The Rename Layer dialog.


2.
Type in a new name and click OK.

The new name appears in the Layers palette.

✓ Tip

  • Renaming does not affect any prefixes on a layer (prefixes are important to determine button status and subpicture settings).


To add a drop shadow to an object:

1.
Using the Selection tool, select one or more objects in the Menu Editor.

2.
Choose Object > Drop Shadow (Figure 4.85).

Figure 4.85. Selecting the Drop Shadow option.


The Drop Shadow dialog appears.

3.
To pick a color for the drop shadow, click the Color swatch (Figure 4.86).

Figure 4.86. Step one in choosing a color for the drop shadow.


The Color Picker appears (Figure 4.87).

Figure 4.87. Creating a drop shadow color in the Color Picker. Note the NTSC Colors Only check box.


4.
Use the controls to modify the color and click OK to accept the changes.

5.
Use the other controls in the Drop Shadow dialog to modify parameters of the drop shadow (Figure 4.88).

Figure 4.88. The other controls in the Drop Shadow dialog.


The drop shadow is applied to the object (Figure 4.89).

Figure 4.89. Here's a close-up of the final result.


✓ Tips

  • Drop shadows can be applied to any object, including text and layer sets.

  • You can also apply a drop shadow (and many other edge and surface treatments) with the Styles palette. However, treatments applied via the Styles palette cannot be modified within Encore DVD. Their parameters are only adjustable in Photoshop.


To change the color of a shape object:

1.
In the Layers palette, locate the layer that has the shape you want to modify (Figure 4.90).

Figure 4.90. The rectangle shape on the left (behind the tower) is selected...


2.
Double-click on the color chip in the layer.

The Color Picker appears.

3.
Select a new color in the Color Picker and click OK (Figure 4.91).

Figure 4.91. …and a new color for the shape is chosen in the Color Picker.


The shape color will be updated with your color selection (Figure 4.92).

Figure 4.92. Here's the result of the color change.


  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint