Exercise 5-2: Creating Invisible Buttons

In this exercise, you’ll create invisible buttons for your game.

1. Make sure you are working in the same file from the last exercise.
2. In the Main Timeline, select the hammer layer and click the Insert Layer button to create a new layer.
3. Name the new layer buttons.
4. On the buttons layer, draw a black rectangle with no stroke.
5. With the rectangle selected, type the following values in the Property Inspector: X:0, Y:0, W:790, H:305.



6. With the rectangle still selected, press F8 on your keyboard to open the Convert To Symbol dialog box. There, choose Button for the type, name the button btnInvis, choose top left for Registration, and click OK.
7. In the Library, double-click the btnInvis symbol’s Button Symbol icon to enter its Timeline.
8. Now, you’ll make this button an invisible button. Inside the btnInvis button, make sure no frames are selected by clicking in the Pasteboard (gray area away from the shape on the Stage). Then, click and drag the keyframe on frame 1 (the frame with the word “up” above the frame) to the Hit frame, as shown here.



9. At the bottom of the Timeline, click Scene 1 to return to the Main Timeline. It may be difficult to tell in the following illustration, but the button on the Stage is now a transparent cyan color, indicating it’s an invisible button. Nice!



10. With the Selection tool selected, press and hold ALT (Windows) or OPTION (Mac) on your keyboard and click and drag the button on the Stage to create a copy.
11. Make sure the copied button is selected. In the Align panel, check the To Stage button. Then click the Align Left Edge button to align the left edge of the button to the left edge of the Stage, and click the Align Bottom Edge button to align the bottom edge of the button to the bottom of the Stage.
12. Select the top button, and in the Property Inspector name the button top_btn. Select the bottom button and in the Property Inspector name the button bottom_btn.
13. Save the file, and keep it open for the next exercise.

Exercise 5-3