Creating sprite images for toolbar buttons
When creating a toolbar component, one option for the display of the toolbar icon is to use a "sprite image" which allows the icon to change its appearance—say, its color—whenever the mouse pointer is over the icon. This is a good visual cue to let users know that they are in the active area for the button.
Note: In the current versions of the application, this is generally not
necessary, as the icons are inherently designed to pop up tooltips to identify the icons.
Specifications for the sprite image
The sprite image must meet these specifications:
- The dimensions of the image must be exactly 25 pixels wide by 50 pixels high.
- The image must be formatted as .png with a transparent background.
- The image must consist of
two glyphs, one for the default state and one for the hover state:
- The dimensions for each glyph cannot exceed 16 pixels by 16 pixels.
- The glyph for the default state must begin 2 pixels from the left side and 1 pixel from the top.
- The glyph for the hover state must begin 2 pixels from the left side and 26 pixels from the top.
- The file for the image must
contain "mgsprite" in the name; for example: mytbbutton_mgsprite.png
This naming convention lets the application know that it is a sprite image for the button and should be handled accordingly.
- The image file can be
handled in these ways:
- You can store it in the Mongoose file system. We recommend placing it in the same directory as the winstudio.exe file.
- You can import it into the application database using the (menu) > Images dialog box.
After creating the sprite image, you must then implement it for the toolbar button.