The skin editor

With ASkinEditor.exe you can easy visually create and edit a skin configuration file "Options.dat".

The button "Creation wizard" runs a skin creation wizard, which can help to make s skin easily. At first you need add name for your skin, at second, need to setup a general gamma of color for it. The MasterBitmap file "Master.bmp" will be generated automatically and contains a minimal collection of images for work of skin. After adding of new images in any graphic editor (like PhotoShop, GIMP etc.) and saving MasterBitmap, you need to select it in the skin editor on the corresponding page.

For a preview of edited skin may be used a special demo application "ASkinDemo.exe" (it's always included in the ASkinEditor package and may be found on this page also). If skins editor can't find the ASkinDEmo.exe then you will be asked to search it using special dialog. For enabling of automatic preview after an each change you need to set the "Changes preview..." checkbox. If it checked then editor will automatically reload your skin on it, and you will be see your changes in skin on the fly ;)

On the "General skin options/General info" tab you may define a name of the skin author, a version of compatible AlphaSkins package and other general info.

Skin sections

The "Sections" tab contains a list of all sections in the skin (see image 5). Each section is associated with type of control(like "EDIT" for TEdit, TCustomEdit and child based on it) or their elements (like "COMBOBTN", “DIVIDER”, “EXTRALINE”, “SCROLLBAR1H”).

Most properties of sections is identical ("TRANSPARENCY", "COLOR" etc.). Used SkinSection may be changed in the "SkinData.SkinSection" property of AlphaSkins components. Depending on value of this property may be forced a drawing of Panel (default is "PANEL" skinsection for it) as Buton ("BUTTON" section) or as Form("FORM" section).

Also, unlimited amount of sections maybe added by a skin developer for creating of controls with a unique drawing style. But some properties exists, which are specified only for special skin sections (like "GLYPHMASK" in "COMBOBOX" or in "SCROLLSLIDERH"). General properties of section may be found on the "Borders" tab and "Normal state" tab. Additional tabs, such as "Active", "Corner images", "Animation", "Trackbar data" will be visible only when a special section is selected. In "Options" window, may be configure what properties and in what sections will be shown ("Sections list" tab).

The "Borders" tab

The “Control borders” field on the "Borders" tab determines coordinates of borders image in the MasterBitmap and some parameters required for a control drawing. This field may be not defined. If this field is not defined then control will be drawn without borders.

When you click on the button corresponding to this field, you will see the "Image selection for property" form (see image 6). The most part of this form is occupied by zoomed MasterBitmap(the value of MasterBitmap zoom can be changed), there may be selected coordinates of image for a current skin section (selected borders for "TOOLBAR" skin section are shown on example). On this form :

Let's back to the "Control borders" page. The "Effects region" field used for defining of visibility area of visual effects which uses in a control. Currently this property is avaliable in "PROGRESSH" and "PROGRESSV" sections. This region used there for defining of a visibility area for a lighting animation effect.

The "Glow effect" field used to defining of Png image, which will be used for creation of the "Glowing" effect. This property is avaliable in sections which will be used in buttons and edit controls.

"Normal state" and "Active" tabs*

In this tabs are specified properties of background of current section. This background may be semitransparent, the "Transparency" option defines a value of background transparency.

The "Color" property defines a color of background which used only if gradient filling and texture filling are not defined.

The AlphaSkins engine has several unique solutions and one of them is the ability which allows combine together texture filling and gradient filling. For defining gradient or texture visibility (in percents) relevant trackbars should be used.

For a texture choosing the "Image selection for property" window must be called. But only one option will be available in this case (except coordinates) : "Filling type", which defines a type of texture filling.

"Text color" defines a color of text in a control.

In the "Text contour" option may be specified a color of contour at the left, top, right and bottom sides of text. This property is supported in most controls.

The "Text glowing" property allows specify a color and size for a text glowing effect. This property is supported in such control as buttons, checkboxies etc.

One of interesting abilities in AlphaSkins is a support of many colors and transitions between them in gradients (like gradients in Photoshop, see image 8). For example, the "MacMetal" skin contains many controls where texture is drawn in parallel with gradient.

*The "Active" tab does not exist in some sections("PANEL", "TOOLBAR" etc.). It is depended from count of states, which can be associated with control.

Appointment of other tabs:

The "General skin options" page:

General info

There you can set a name of the skin author, version of compatible AlphaSkins package, the file name of MasterBitmap and additional info.

Main colors

Containts settings of main skin colors (see image 9).

Title bar

This page contains settings for drawing of form title and its elements. Title system buttons have two sizes in some skins : big icons for normal forms and small icons for dialogs and MDI-Child forms.

Main icons

Besides buttons for selection of title icon some other options are available also on this page :

Title options

Settings for a title content output.

On the "Small icons" tab you can specify small icons for titlebar, if default icons doesn't fit for painting it in titlebar of the forms or MDIChild forms. It is possible to specify icons in reduced size if basic icons are not suitable for drawing them in dialogs or MDIChild forms.

Controls glyphs

Images of some controls or their parts.

Extended borders

On this tab may be configured settings for drawing of additional borders for forms and dialogs. Two modes of additional borders creating are provided :

1. "Add to existing" - extended borders will be added to existing borders. This mode is used for adding of own shadow of form. It also may be used for drawing of additional borders when picture of native borders must be saved. Example - the "Alluminium" skin.
2. "Replace existing borders" - mode is used in the case, when standard borders needs to be completely replaced. Samples in Web2, Sapphire, etc.

"Border width" - border width, distance between a client area of form and shadow of form.

"Shadow size" - distance between sides of image and border of form on this image. This is a value that must denote the border, where the figure ends with the shadow and starts the border image.

"Title height" - height of form titlebar.

"Maximized title height" - height of titlebar with maximized state of form. Its used in special cases, when "Title height" value is too big for maximized window state and this size should be smaller. In other cases this property can be 0 (default value).

"Title center offset" - offset of titlebar content along vertical ax (icon, text, buttons).

"Form align offset" - offset for form align relatively edges of screen which used with "TsSkinProvider.ScreenSnap" property.

Shadows of labels

Settings for painting of text shadow in the "LabelFX" component: Color, Offset and Blur.