DHTML Menu Studio FAQ

Question ID:
Q3031
Question:
How can I create my own bitmap scheme or modify an existing bitmap scheme?
 
Note: You can now easily create bitmap schemes without the need to perform the steps explained in this FAQ using Scheme Designer. This software will let you create a graphical scheme based on an existing image with just a few clicks.p> In order to be recognized by DHTML Menu Studio, a bitmap scheme must be copied to the Schemes sub-directory of DHTML Menu Studio's main directory (usually c:\Program Files\DhtmlMenuStudio\schemes) and have the .sbs extension. Please note, the bitmaps used in a bitmap scheme must be GIF images and must be copied to the Graphics sub-directory of program's main directory (usually c:\Program Files\DhtmlMenuStudio\graphics). A bitmap scheme file has the format of a standard INI file. It is divided into two sections: BitmapSchemeFileSettings and BitmapPaths. Below is a sample file (hor_metallic.sbs)
[BitmapSchemeFileSettings]
TopLevelOpenWidth=6
TopLevelCloseWidth=6
TopLevelItemHeight=33
TopLevelSepWidth=11
PopupItemWidth=150
PopupOpenHeight=10
PopupLeftPadding=5
Orientation=Horizontal
[BitmapPaths]
TopLevelOpen=hor_metallic_open.gif
TopLevelItem=hor_metallic_item.gif
TopLevelSeparator=hor_metallic_sep.gif
TopLevelClose=hor_metallic_close.gif
PopupOpen=hor_metallic_popup_open.gif
PopupItem=hor_metallic_popup_item.gif
PopupClose=hor_metallic_popup_close.gif
The BitmapPaths section
The [BitmapPaths] section stores relative paths to bitmaps in the GIF format. The following bitmaps must be supplied:

Bitmap scheme sections
TopLevelOpen (1) is the left-most element of the top level menu if it's oriented horizontally or it's the top-most element if it's oriented vertically.
TopLevelItem (2) is the bitmap that makes us the background of the top-level menu. For a horizontal menu this image can have any width (even a single pixel will work fine -- this is the case with the sample presented above). For a vertical menu, this image must be of the same width as the images 1, 3, and 4 but can have any height.
TopLevelSeparator (3) separates top level items
TopLevelClose (4) is the right-most element of the top menu (for horizontal orientation) of the bottom-most element (for vertical orientation).
PopupOpen (5) is the top-most element of the popup menu. You don't need to specify this image if you're not using images for popups.
PopupItem (6) is the bitmap that makes up the background of the popup menu. You don't need to specify this image if you're not using images for popups.
PopupClose (7) is the bottom-most element of the popup menu. You don't need to specify this image if you're not using images for popups.
The following options are not obligatory and are ignored if the HoverType setting (in the BitmapSchemeFileSettings section) is not specified or set to None.
TopLevelItemHover is a highlighted version of TopLevelItem.
TopLevelSeparatorLeftHover is a highlighted version of TopLevelSeparator (when the item to the left of the separator is highlighted). This setting is not obligatory and should be used only when creating advanced bitmap schemes (when HoverType=Advanced).
TopLevelSeparatorRightHover is a highlighted version of TopLevelSeparator (when the item to the right of the separator is highlighted). This setting is not obligatory and should be used only when creating advanced bitmap schemes (when HoverType=Advanced).
TopLevelOpenHover is a highlighted version of TopLevelOpen (when the first item of the bar is highlighted). This setting is not obligatory and should be used only when creating advanced bitmap schemes (when HoverType=Advanced).
TopLevelCloseHover is a highlighted version of TopLevelClose (when the last item of the bar is highlighted). This setting is not obligatory and should be used only when creating advanced bitmap schemes (when HoverType=Advanced).
The BitmapSchemeFileSettings section
The [BitmapSchemeFileSettings] section stores menu information:
Orientation determines the top-level menu orientation. The value of this setting can either Horizontal or Vertical.
TopLevelOpenWidth is the width (in pixels) of the TopLevelOpen (1) image.
TopLevelCloseWidth is the width (in pixels) of the TopLevelClose (4) image.
TopLevelItemHeight is the height (in pixels) of the TopLevelItem (2) image. This value should be supplied when horizontal orientation is chosen. It is optional with vertical orientation (and should be specified when using fixed-height backgrounds).
TopLevelItemWidth is the width (in pixels) of the TopLevelItem (2) image. This value should be supplied when vertical orientation is chosen. It is optional with horizontal orientation (and should be specified when using fixed-width backgrounds).
TopLevelSepWidth is the width (in pixels) of the TopLevelSeparator (3) image. This value should be supplied when horizontal orientation is chosen.
TopLevelMinHorizontalMarginLeft (vertical menu only) is the minimum left margin between top-level menu edge and the text.
TopLevelMinHorizontalMarginRight (vertical menu only) is the minimum right margin between top-level menu edge and the text.
TopLevelVAlign specifies vertical alignment of text in the top-level menu. This can be Top, Bottom or Middle (which is the default if nothing is specified).
PopupItemWidth is the width (in pixels) of the popup menus.
PopupOpenHeight is the height (in pixels) of the PopupOpen (5) image.
PopupBitmaps determines whether bitmaps are also used for popup menus. This can be either True or False.
PopupLeftPadding determines additional left padding (in pixels) of popup items.
PopupRightPadding determines additional right padding (in pixels) of popup items.
HoverType determines the highlight method being used. Setting it to none (default) will not use any of the xxxHover settings in the BitmapPaths section. Setting it to Simple will only use the TopLevelItemHover setting and will ignore the other xxxHover settings. Setting it to Advanced will use all hover versions of bitmaps. The simple hover type will simply highlight menu bar items. The advanced hover type will also modify the opening/closing/separator images when necessary to create an advanced hovering effect (this is often used if separators are not vertical but placed at an angle as with the hor_friendly scheme from the Grey Elegant gallery).
The following options are not obligatory and are ignored if the Top level generation method option in the program's UI is set to HTML Code in Options / Graphical Appearance / Bitmap Scheme.
TopLevelMenuTrueColor determines whether the generated image will use True Color (24bpp) palette (when set to True) or 256-color palette (when set to False).
TopLevelMenuTransparency determines whether the generated image will be transparent (True) or not (False).
Please note that if you create a bitmap scheme (.sbs file), it will not be visible in the gallery. In order to make it visible, you will need to create a scheme (.sxs) file. To do this, in options / bitmap scheme, select that you want to use bitmap schemes, then in 'bitmap scheme name' select the newly created .sbs bitmap scheme. You can now set all other visual options (e.g. fonts, menu behavior) and click the 'save' button in options in order to save the settings as a new scheme (.sxs file). Only after creating an .sxs file and refreshing the gallery, the scheme will be visible in the gallery.
See Q3040 of the FAQ if you don't need to create a bitmap scheme but only want the top-level menu to be transparent so the navigation bar underneath (with background image) is visible.