This shows you the differences between two versions of the page.
— |
koda:en:documentation:create_menu [2014/07/10 10:48] (current) |
||
---|---|---|---|
Line 1: | Line 1: | ||
+ | ====== Creating a menu control ====== | ||
+ | |||
+ | Creating a (main) Menu, ContextMenu or TrayMenu requires a special approach, so we provide a tutorial. It assumes that you have already created the form to which you will add a Menu control. | ||
+ | |||
+ | //This tutorial begins by telling you how to create a Menu. The procedures for all three kinds of menus are the same except that a ContextMenu requires extra steps: attaching it to a control (or to the form). Near the end, this tutorial describes these extra steps.// | ||
+ | |||
+ | First, click on the Menu icon on the controls palette: | ||
+ | |||
+ | {{ create_menu_step_1.png }} | ||
+ | |||
+ | Click anywhere on the form, that is anywhere there won't be a control. You will see a copy of the Menu icon. (The Menu control is a [[substitute_control|substitute control]] in Koda terminology.) The Object Inspector shows the properties of the Menu as a whole. | ||
+ | |||
+ | {{ create_menu_step_2.png }} | ||
+ | |||
+ | Now, double-click this copy of the icon (or click to the right of Items in Object Inspector). [[proped_menu_builder]] opens. The blue rectangle is a //slot// Koda has created for the first top-level menu item. | ||
+ | |||
+ | Right-click on this rectangle. You will see that there are three choices: **Insert**, **Delete** and **Create Submenu**. (At this point, Create Submenu does nothing.) | ||
+ | |||
+ | To create the first top-level item, choose Insert (or press < | ||
+ | |||
+ | In Object Inspector, change the Caption to //File// and and the Name to // | ||
+ | |||
+ | Right-click on //File// and choose **Create Submenu**. A gray button appears. | ||
+ | |||
+ | Click on the gray button. It turns blue. (The color shows that it is selected.) | ||
+ | |||
+ | Press the < | ||
+ | |||
+ | Now that we know how to create sub-menu items, let's add a second top-level menu item, Help. | ||
+ | |||
+ | In Menu Designer, click in the dotted frame to the right of //File//. The rectangle changes to blue. | ||
+ | |||
+ | Press < | ||
+ | |||
+ | Click on //File//, then on the gray rectangle below it. | ||
+ | |||
+ | Press < | ||
+ | |||
+ | In Object Inspector, change the Caption to //Save// and the Name to // | ||
+ | |||
+ | Click on the gray rectangle below //Save//. Press < | ||
+ | |||
+ | Click on the gray rectangle. | ||
+ | |||
+ | The screen should now look like: | ||
+ | |||
+ | {{ create_menu_step_3.png }} | ||
+ | |||
+ | You may now wish to change the properties of a menu item. To do so, click on its Caption in Menu Designer. Help for each of the properties is [[control_menuitem|here]]. | ||
+ | |||
+ | To exit Menu Designer, activate the Menu Designer (if it isn't already active), then simply close it. | ||
+ | |||
+ | We suggest that you give the menu you just created a distinctive name (in case you create another menu later). To do so, click on the Menu icon on the form. Object Inspector shows // | ||
+ | |||
+ | For a **Context Menu** to be active, it must be attached either to the form or to a //real// control. In our example, we attach it to Button1 (which we assume you created earlier). | ||
+ | |||
+ | Click on the Button1 control. Object Inspector shows // | ||
+ | |||
+ | In Object Inspector, click on Context Menu and choose the name of the context menu in the drop-down box: | ||
+ | |||
+ | {{ create_menu_step_4.png }} | ||
+ | |||
+ | Try running the form: on Koda's menu, click on Tools, then on Run Form. When you right-click on Button1, your context menu appears. | ||
+ | |||
+ | <color darkgreen> | ||
+ | |||
+ | Select the existing menu item, then press the < | ||
+ | |||
+ | For example, to insert an Edit menu item between File and Help, click on Help, then press the < | ||
+ | |||
+ | <color darkgreen> | ||
+ | |||
+ | Drag and drop it. | ||