More Menu Features

In this section, we'll look at creating submenus and checked menus

Creating Submenus

You can create submenus inside other menus (nested menus) using the existing elements. Remember that you can put any element inside a ref_menupopupmenupopup We've looked at placing menuitems and menuseparators in menupopups. However, you can create submenus by simply placing the ref_menumenu element inside the ref_menupopupmenupopup element. This works because the ref_menumenu element is valid even when it isn't directly placed inside a menu bar.

The example below creates a simple submenu inside the File menu:

Example 5.2.1: /ex_5_2_1.xul.txt'>Source
<toolbox flex1 <menubar idsample-menubar <menu idfile-menulabelFile <menupopup idfile-popup <menu idnew-menulabelNew <menupopup idnew-popup <menuitem labelWindow/ <menuitem labelMessage/ </menupopup </menu <menuitem labelOpen/ <menuitem labelSave/ <menuseparator/ <menuitem labelExit/ </menupopup </menu </menubar </toolbox

 

Adding a Find Files Menu

Let's add a menu to the find files dialog. We'll just add a few simple commands to a File menu and an Edit menu. This is similar to the example above.

<toolbox <menubar idfindfiles-menubar <menu idfile-menulabelFileaccesskeyf <menupopup idfile-popup <menuitem labelOpen Search...accesskeyo/ <menuitem labelSave Search...accesskeys/ <menuseparator/ <menuitem labelCloseaccesskeyc/ </menupopup </menu <menu idedit-menulabelEditaccesskeye <menupopup idedit-popup <menuitem labelCutaccesskeyt/ <menuitem labelCopyaccesskeyc/ <menuitem labelPasteaccesskeypdisabledtrue/ </menupopup </menu </menubar <toolbar idfindfiles-toolbar

 

Here we have added two menus with various commands on them. Notice how the menu bar was added inside the toolbox. In the image, you can see the grippy on the menu bar that can be used to collapse the menu bar. The three dots after Open Search and Save Search are the usual way that you indicate to the user that a dialog will open when selecting the command. Access keys have been added for each menu and menu item. You will see in the image that this letter has been underlined in the menu label. Also, the Paste command has been disabled. We'll assume that there's nothing to paste.

Adding Checkmarks to Menus

Many applications have menu items that have checks on them. For example, a feature that is enabled has a check placed beside the command and a feature that is disabled has no check. When the user selects the menu, the check state is switched. You may also want to create radio buttons on menu items.

The checks are created in a similar way to the checkbox and radio elements. This involves the use of two attributes, type to indicate the type of check and name to group commands together. The example below creates a menu with a checked item.

Example 5.2.2: /ex_5_2_2.xul.txt'>Source
<toolbox <menubar idoptions-menubar <menu idoptions_menulabelOptions <menupopup <menuitem idbackupslabelMake Backupstypecheckbox/ </menupopup </menu </menubar </toolbox

The type attribute has been added which is used to make the menu item checkable. By setting its value to checkbox, the menu item can be checked on and off

Bhopal news
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 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 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100

freelance web designer india ecommerce web developer | Ecommerce web design, software developer india | Web hosting India Windows hosting | India web hosting Windows hosting India | India software developer | web designer india