Flash EXE Builder skin consists of several important files stored at the [Application Folder]/Skin folder. You can create your own skin by creating the necessary files and put them into this folder.
For a case study, lets take a look at Slick Skin.
1. Slick.bmp
A bitmap file containing the actual skin image
2. Slick.jpg
A bitmap thumbnail file which will be used when selecting skin from library.
3. Slick_Alpha.bmp
A bitmap file (grayscale) containing the alpha information for Slick.bmp
4. Slick_Exit.bmp
A bitmap file containing image for exit button.
This bitmap consists of four image. Each image represent a button state: normal, mouse over, disabled and clicked. Please make sure that each state image has the same dimension.
5. Slick_Min.bmp
A bitmap file containing image for minimize button.
This bitmap consists of four image. Each image represent a button state: normal, mouse over, disabled and clicked. Please make sure that each state image has the same dimension.
6. Slick_Max.bmp
A bitmap file containing image for maximize button.
This bitmap consists of four image. Each image represent a button state: normal, mouse over, disabled and clicked. Please make sure that each state image has the same dimension.
7. Slick.txt
A text file containing several important information to draw the skin image and buttons. To be able to support window resizing, the skin image at Slick.bmp will be divided into 8 sections (upper left, top, upper right, left, right, lower left, bottom, lower right). The image below shows the division. The image on the left is Slick.bmp. The image on the right is the section division.
During window drawing, the upper left, upper right, lower left and lower right corner will be drawn without stretching while the top, left, right and bottom section will be drawn with stretching to accommodate the window size.
A minimize, maximize and exit buttons will be drawn on top of the window according to the information provided within the text file.
Below is the text file content for slick.txt
=======================================
Border 12 30 137 120
MinButton 88 0 105 15 2 1
MaxButton 105 0 122 15 2 1
ExitButton 122 0 139 15 2 1
View 5 21 145 139
Size 150 150
BgrColor 255 255 255
Text 8 4 85 18 1 1 1
TextColor 48 48 48
=======================================
Border X1 Y1 X2 Y2 where:
X1 is the X coordinate of the left division line
Y1 is the Y coordinate of the top division line
X2 is the X coordinate of the right division line
Y2 is the Y coordinate of the bottom division line
MinButton X1 Y1 X2 Y2 where:
X1 and Y1 is the coordinate of the minimize button upper left section
X2 and Y2 is the coordinate of the minimize button lower right section
MaxButton X1 Y1 X2 Y2 where:
X1 and Y1 is the coordinate of the maximize button upper left section
X2 and Y2 is the coordinate of the maximize button lower right section
ExitButton X1 Y1 X2 Y2 where:
X1 and Y1 is the coordinate of the exit button upper left section
X2 and Y2 is the coordinate of the exit button lower right section
View X1 Y1 X2 Y2 where:
View X1 Y1 X2 Y2 coordinates define an area within the window where the playlist window will be placed.
Size Width Height where:
Width and Height are the dimension of the bitmap slick.bmp
BgrColor Red Green Blue where:
Red, Green and Blue is the color definition for the skin background.
Text X1 Y1 X2 Y2 HAlign VAlign TextAlign where:
X1, Y1, X2, Y2 are the coordinates of an area where the windows title will be showing.
HAlign is a horizontal alignment of the text area where 1 = Left alignment, 2 = Right alignment
VAlign is a vertical alignment of the text area where 1 = Top alignment, 2 = Bottom alignment
TextAlign is a text alignment of the text content within the text area where 1 = Left alignment, 2 = Center alignment, 3 = Right alignment
TextColor Red Green Blue where:
Red, Green, Blue is the color definition for the window text title.