Crystal2 Skin Engine implements dynamic application user interface in terms of XML based skins.

Crystal2 Skin Engine includes OSD subsystem, allowing displaying any kind of informaton (textual and graphical, fixed or dynamic) over the video data. This feature could be used for interactivity, giving the user additional information, providing VAS services (highlighting of goods with hyperlink to the shop), marketing campaigns.

The screenshots of our mobile player employing Crystal2 Skin Engine for the user interface as well as OSD are presented below:

OSD including equalizer and seek bar on Nokia N80

Browser and previews on Nokia N95

Playback & browser on qVGA WindowsMobile device

Fullscreen playback and OSD on qVGA WindowsMobile device

The short list of Crystal2 Skin Engine key features:

• Multi-platform. Skin Engine is portable. Currently it supports Symbian, Windows Mobile and Windows OS.
• XML-based description. User interface controls are described in XML meta-format.
• Free-shaped principle. User interface controls structure, position and view can be changed by selecting different skins.
• Resizable. Control position description allows implementation of resizable skins.
• Typified description. Allows easy definition of several controls with similar view using style mechanism.
• Complex type definition. Control styles can be defined based on already defined styles. For example buttons states can be described either as single bitmaps and complex bodies containing gradients, text controls and etc.
• Adaptive colorization. Skin colors depend on user color scheme.
• Properties. XML-defined skin parameters are accessible from the application by using control unique identifiers - properties.
• Optimized rendering. Uses true color rendering, supports dithering for 16 bit screens and hardware acceleration for view-ports scrolling.
• Double buffering. Supports back-buffered rendering which avoids skin flashing during rendering.
• Animation. Supports visual animation - blending, resizing, moving and etc.
• OSD compatible. Skin can be rendered on On Screen Display panels above the live video stream.

Skin control types:

• Bitmap. Single bitmap image. JPEG, BMP and other formats are supported.
• Texture. Textured rectangle area.
• Animator. Supports bitmap animation - blending and resizing.
• Cube. Provides 3D-cube animation effect.
• Gradient. Rectangle area filled by gradient based on four colors.
• Text. Text area.
• Body. Abstract rectangle area which contains child controls.
• Switcher and State. Limited state machine - pager.
• Button. Four state button - normal, highlighted, pressed and disabled.
• Sealbutton. Five state button - plus sealed-pressed state.
• Slider. Abstract slider and progress bar. Supports iPhone-like scrolling.
• Translator. Sensitive rectangle area - allows extending sensitive area of buttons and sliders above visible shape.
• OSD panel. Rectangle panel which allows fast rendering on live video stream.
• Control Video. That is overlayed video window as OSD control (Picture in Picture).
• Control 3D. That is 3d-like panel which shows sub-controls in perspective.
• Focus. Keyboard-focused area which allows selecting active controls using cursor.
• Glider. Group of sliders with single mouse/stylus grabbing - i.e. equalizer.
• Frame. View-port rectangle area powered by vertical and horizontal scrollbars.
• Browser. Abstract browser list.
• Menu. Abstract popup menu.