Nevron Open Vision Documentation
Part Based Themes

NOV UI currently provides the following part based themes:

Applying them application wide is as easy as with any other theme:

Apply Windows 8 Theme
Copy Code
NApplication.ApplyTheme(new NWindows8Theme());
Image Skins

Image based themes use stretched images to style the background, borders and other visual aspects of widgets. Images that are used in image based skins are constructed by vertically concatenated state images. The following image illustrates the image used to style the button of a Windows 7 Aero theme:

figure 1. State images inside a skin image.

As you can see the image is split vertically into 5 sub images. Each of these sub images represent a given state of the button. A state image is further split into part images that are used as background and border of the widget. The splitting is done by using specified clip margins that define four offsets from the state image rims. The following image illustrates the splitting of a state image to parts images:

figure 2. State image to parts splitting.

This splitting of each state image is also known as the nine-patch. When rendering a widget with different size the nine-patch scales in accordance the following rules:

The image splitting into states and nine-patch parts is performed by the NImageSkin class. Besides the Colors and Fonts maps, defined by the base NUITheme, the NUIPartSkinsTheme also provides the following maps:

Color Skins

Instead of using images, you can also use colors to skin a given UI part. The color skin definitions are most commonly placed in the corresponding Init methods of the NUIThemeSkinMap. For example the following code creates the button skin of the Windows 8 theme:

Window 8 Theme Button Skin
Copy Code
NColorSkin skin = new NColorSkin(5);
skin.Padding = new NMargins(3);
skin.SetState(Normal, new NColorSkinState(new NColor(172, 172, 172), new NColor(240, 240, 240), new NColor(229, 229, 229)));
skin.SetState(MouseOver, new NColorSkinState(new NColor(126, 180, 234), new NColor(236, 244, 252), new NColor(220, 236, 252)));
skin.SetState(Pressed, new NColorSkinState(new NColor(86, 157, 229), new NColor(218, 236, 252), new NColor(196, 224, 252)));
skin.SetState(Disabled, new NColorSkinState(new NColor(217, 217, 217), new NColor(239, 239, 239)));
skin.SetState(Focused, new NColorSkinState(new NColor(51, 153, 255), new NColor(240, 240, 240), new NColor(229, 229, 229)));
Button = skin;
...
internal const int Normal = 0;
internal const int MouseOver = 1;
internal const int Pressed = 2;
internal const int Disabled = 3;
internal const int Focused = 4;
See Also
Send Feedback