The JadeSkinArea class is the abstract class that defines the way in which a rectangular area is drawn.
Before you can define a skin area, a picture file (for example, a .gif, .png, .bmp, or .jpg file) must exist for each of the images that you want to specify.
The following image illustrates the layout of a skin, which is made up of eight border segments and an inner segment.
A JadeSkinArea is drawn as follows.
Segment 1
The top-left image (imgBorderTopLeft) is drawn at actual size. The top-left of the image is positioned at the top-left of the control.
The height drawn is usually the minimum of the top-left image height and the top-center strip height.
The exception is if the top-left image height is greater than the top-center strip height and the top-left image width is less than the left-center strip width. In that case, the top-left image height is used.
The top-left image can be higher than the top-center strip if the left-center strip is at least the same width.
Segment 2
The top-right image (imgBorderTopRight) is drawn at actual size. The top-right of the image is positioned at the top-right of the control.
The height drawn is usually the minimum of the top-right image height and the top-center strip height.
The exception is if the top-right image height is greater than the top-center strip height and the top-right image width is less than the right-center strip width. In that case, the top-right image height is used.
The top-right image can be higher than the top-center strip if the right-center strip is at least the same width.
Segment 3
The top center strip (imgBorderTopStrip) is drawn at actual image height and stretched horizontally between the top-left and top-right images.
Segment 4
The bottom-left image (imgBorderBottomLeft) is drawn at actual size. The bottom-left of the image is positioned at the bottom-left of the control.
The height drawn is usually the minimum of the bottom-left image height and the bottom-center strip height.
The exception is if the bottom-left image height is greater than the bottom-center strip height and the bottom-left image width is less than the left-center strip width. In that case, the bottom-left image height is used.
This allows the bottom-left image to be higher than the bottom-center strip if the left-center strip is at least the same width.
Segment 5
The bottom-right image (imgBorderBottomRight) is drawn at actual size. The bottom-right of the image is positioned at the bottom-right of the control.
The height drawn is usually the minimum of the bottom-right image height and the bottom-center strip height.
The exception is if the bottom-right image height is greater than the bottom-center strip height and the bottom-right image width is less than the right-center strip width. In that case, the bottom-right image height is used.
This allows the bottom-right image to be higher that bottom-center strip if the right-center strip is at least the same width.
Segment 6
The bottom center strip (imgBorderBottomStrip) is drawn at actual image height and stretched horizontally between the bottom-left and bottom-right images.
Segment 7
The left-center strip (imgBorderLeftStrip) is drawn at actual image width and stretched vertically between the top-left and the bottom-left images.
Segment 8
The right-center strip (imgBorderRightStrip) is drawn at actual image width and stretched vertically between the top-right and the bottom-right images
Segment 9
The center image (imgInner) is drawn stretched from the left-center image to the right-center image and from the top-center image to the bottom-center image. If there is no center image, it is filled with the background color specified for the skin.
Segments 3 and 6 determine the respective top and bottom heights of the border. Segments 7 and 8 determine the respective left and right widths of the border.
Unexpected results may occur if an image has a size that is inappropriate or does not correspond to a specific area.
A corner segment is drawn to its full height if the width is the same as the corresponding left or right strip. For example, segment 1 can be higher that segment 3, provided that segment 1 is the same width as segment 7. You can use this to achieve rounded border effects. For details, see "JadeSkinWindow Class", later in this chapter.
The following characteristics of the JadeSkinArea class are affected by additional subclass property values.
If optional border images (that is, areas 1 through 8 in the above image) are not present, the inner area of the skin is the entire area.
You can define the optional inner image by setting the value of the imgInner property to a brush that is repeatedly drawn over the entire inner area or an image that is drawn centered in the inner area.
A backColor property value is used only if the inner image (that is, the imgInner property) is not defined or it is not a brush.
For details about the JadeSkinArea class constants and the properties defined in the JadeSkinArea class, see "JadeSkinArea Class Constants" and "JadeSkinArea Properties", in the following subsections. For details about defining and maintaining skins, see "
JadeSkinMenu, JadeSkinWindow, JadeSkinWindowStateImage
