- About XP Web Buttons
- Quick-start tutorial
- Creating menu buttons
- Adjusting menu appearance
- Setting menu buttons links
- Saving menu
- User guide
- Main window
- Main menu
- Toolbar
- Work area
- Toolboxes
- Themes toolbox
- Properties toolbox
- Common properties
- Normal / Hot state properties
- Theme editor
- Creating theme tutorial
- Button states image
- Creating new theme
- Adding button to the theme
- Setting state images
- Adjusting edges width
- Button samples
|
|
To open
Theme editor click File/Theme editor in the Main
menu. Theme editor helps you create your own themes or modify
existing ones. To select a button you would like to edit, just
right-click it in the buttons for web Themes toolbox.
Add new - to add new button to the current theme. After you click the "Add new" button, the "Add button" dialog will appear.
Open image - to open button states image file (*.bmp)
Total images - to define how many button state images are in the opened file. The button states image will then be divided into this number of state images.
State … offset fields - to set the
state image for each animated web buttons states.
If you set state offset to 0 then the topmost state image will
be used for the state. If you set state offset to 1 then the second
state image will be used etc. State 1 corresponds to the Normal
state, state 2 - to the Hot state, state 3 - to the Pressed state.
For example, you can create button states image containing 7 state images. Then open it in the Theme editor and select 3 state images you like most.
Add - to add the button to the current theme.
Delete - to delete the button from the current theme.
Clone - to create a copy of the button in the current theme.
Edit Props - to edit the button state images' edge width and to set the transparent color. After you click the "Edit props" button, the "Props" toolbox will appear.
Horizontal and Vertical - to define
edge width for each state. Edges are not scaled when you change
the button size. Using edges is useful when you would like the
button to have border. Then, if the border is within the edges,
it won't be scaled.
Central area is scaled in both directions. Corners are not scaled. Vertical edges are not scaled in vertical direction. That is, when you change the button height, vertical edges will not be scaled. And vice versa, horizontal edges are not scaled in horizontal direction.
Example: Let's say, we have the following button (size: 50x50):
Let's change it's width to 150:
As you can see, in the left image (Horiz. edge width = 1) whole button image was scaled to fit its new size. In the second case (Horiz. edge width = 10) left and right edges of the button were not scaled. Same with the vertical edge width.
Transparent Color - to set the transparent color. When you add new button, transparent color is automatically set to match the color of the top-left corner of the button states image.
New theme - to create a new theme. "New theme" dialog will appear, where you should enter theme name and special notices (for example your copyright info, email, etc.).
Save theme - to save theme changes.
Close - to close Theme editor.
Invert - to invert the button's colors. Select the state(s) you want to be inverted by clicking the checkbox next to the state image.
Color exchange - to exchange web button images colors. Select the state(s) you want to be affected by clicking the checkbox next to the state image. After clicking the "Color exchange" button, the "Color exchange" dialog will appear.
In the example above colors are to be exchanged in the following way:
Result Red color value = original image Green color value
Result Green color value = original image Green color value
Result Blue color value = original image Red color value
Wight and Height fields - to set the preview button size.
|
