[Index] [TitleIndex] [WordIndex

OSD Designer

The OSD Designer is a Glade like GUI for designer and editing OSD skins for Freevo. To start the designer:

freevo osddesigner

To start the designer with a current skin:

freevo osddesigner share/skins/osd/base.fxd


OSD Skins

Skin/Theme Information

OSD Skins like menu skins are designed for a specific geometry (width and height properties) and then scaled/stretched to meet the geometry that Freevo has been configured for . They can also, like menu skins, inherit from other skins (include property) making creating new skins easier as you only need to change the dialogs that you want to edit. In addition to geometry and inheriting from another skin, they can also specify an icon theme (icon theme property) to be used. An Icon Theme is a directory containing images which use well known names to describe them. For example a well known name that may be included in all Icon Themes might be dialog_bg.png which would be used as the background image for all dialogs.


A Dialog is the name given to the unit that is display on the screen to present the user with information. Common dialogs are:

In order for freevo to display information on a dialog, when the dialog is being rendered freevo provides a dictionary of information. What is contained in this dictionary depends on the type of dialog being displayed. For example a simple message dialog would have a string for the message and a button model (holding the buttons state) or an EPG dialog would have a string for the current channel, some time information for the current time, details on the currently program to display etc. The OSD Designer knows about the common dialogs and will generate a dictionary of appropriate information to allow you to see what you dialog might look like.

Dialog Items

Dialogs uses the following items to display information to the user:

Colors and Font

Having to remember the color or font settings for each item in a dialog or skin can be a pain, therefore skins can also contain simple templates that can be reference by a name. These can then be altered once to change all the place a color or font is used.

Widgets, Styles and States

A Widget is an item of a dialog that the user can interact with. For example a common widget will be the Button. Widgets have a current state that they are in, for a Button this would be Not Selected, Selected, Pressed.

A Style is a way to draw a widget when it is in different states, and a WidgetState is how to render a widget when it is in that state. A WidgetState can contain Image, Text and Percent items but not other widgets.

2014-02-15 05:35