Interface Skins


public interface Skins
Skins are a collection of styles, images and other settings used to manage the overall appearance of an application.

A skin is typically in a single directory and consists of:

  • load_skin.js - this is essentially the bootstrap file for a skin. It is responsible for loading the CSS for the skin, and contains global overrides for Smart GWT component properties that affect the appearance of those components.
  • skin_styles.css - this file defines the set of CSS classes and styles available for styling the visual elements of Smart GWT components
  • images/ - this sub-directory typically contains all the icons and other images needed by a skin
Skins are loaded via the skin attribute of the loadISCTag or by including the appropriate load_skin.js source file with a standard script include tag.

You can create a custom skin with your own look and feel by copying an existing skin and modifying the media, CSS class definitions and component property overrides you wish to change.

Note that the load_skin.js file contains a Page.setSkinDir() directive to set up the skin dir (used to ensure media is retrieved from the appropriate directory), and a Page.loadStyleSheet() directive to load the .css file.

See the Skinning Overview for more information.

See Also: