LavishGUI:Textures

Introduction

What is a texture?

A texture is simply an image (or portion of an image).

Why use textures?

ISUI can elements use one or more textures to beautify their appearance. For example, a button that just looks like a rectangle isn't very beautiful. However, applying a texture to give it a picture or a 3D appearance makes the button more enjoyable.

Using Textures

Textures are referenced by filename and color key (used to treat a single given 32-bit color as transparent), and allow other properties. Textures MAY be templated.

Attributes

• FileName

Image filename. The image may be any of those supported by Direct3D's D3DX library: .bmp, .dds, .dib, .hdr, .jpg, .pfm, .png, .ppm, and .tga

• ColorKey

32-bit color to consider transparent

Properties

Rectangle

• Left

Leftmost pixel of the base image to use for this texture

• Right

Rightmost pixel of the base image to use for this texture

• Top

Topmost pixel of the base image to use for this texture

• Bottom

Bottom-most pixel of the base image to use for this texture

Others

• Alpha

Overall alpha level of this texture

Note on Alpha. Element alpha is given as a floating point value, with 0 being transparent and 1 being opaque. Each element will be this number times as opaque as its parent. This means that an element with 0.5 can have a child with an alpha level of 2.0, and the resulting alpha level of the child will be 1.0 (e.g. 0.5*2.0=1.0). This value is carried to all descendants during rendering, so if that same child with the value of 2.0 but calculated alpha of 1.0 had its own child with a value of 0.5, the math would be 1.0*0.5=0.5. Note that any value over 1 is going to appear the same as 1 (they do not get any more opaque). Additionally, a fade effect is available for all elements as well, with automatic fading based on mouse position

• Border

Uniform size, in pixels, of the border area of this texture. The border will be separately scaled from the non-border area to allow a single texture to be used for a control without ugly stretching effects.

• ColorMask

32-bit color (in hex) to apply to the texture

• Orientation

Rotation to apply to the texture. Valid values are 0 to 3 (0 being default). The texture will be rotated 90 degrees clockwise for each 1 (e.g. 1=90, 2=180, 3=270 degrees).

Examples

Example 1

A simple texture using "button.png" for the image, a rectangle of 0,0 (upper left) to 64,64 (lower right), with a border area of 5 pixels.

<Texture Filename='Button.png'>
	<Border>5</Border>
	<Right>64</Right>
	<Bottom>64</Bottom>
</Texture>

Example 2

A texture using the template 'button.Texture' and applying the full color blue.

<Texture Template='button.Texture'>
	<ColorMask>FF0000FF</ColorMask>
</Texture>

See Also

LavishGUI