# HG changeset patch # User pontscho # Date 1001595361 0 # Node ID b190d3e9427cd720d664fa4ae4892a54a68a7f09 # Parent 83c5c8d7ddabe34093e41056c90b58bb1a0bbd15 init version diff -r 83c5c8d7ddab -r b190d3e9427c DOCS/skin.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/DOCS/skin.html Thu Sep 27 12:56:01 2001 +0000 @@ -0,0 +1,867 @@ + + + +MPlayer skin format + + + + + +

MPlayer skin format

+ +
+ +

Contents

+ + + +
+ +
+Last modified: Sep 10, 2001 +
+ +
+ +

1 Introduction

+ +The purpose of this document is to describe the MPlayer skin format. +The information contained here might be wrong, for a) it is not me +who wrote the GUI, b) the GUI is not finished, c) I might +be wrong. So do not be surprised if something does not work as described here. + +

+Thanks to Zoltán Ponekker for his help. + +

+András Mohari <mayday@freemail.hu> + + +

2 Overview

+ +It does not really have anything to do with the skin format, but you should +know that MPlayer has no builtin skin, so at least one skin +must be installed in order to be able to use the GUI. + + +

2.1 Directories

+ +The directories searched for skins are (in order): +
+    /usr/local/share/mplayer/Skin/
+    ~/.mplayer/Skin/
+
+ +

+Note that the first path may vary according to the way MPlayer was configured +(see the --datadir argument of the configure +script). + +

+Every skin is installed into its own directory under one of the directories +listed above, for example: +

+    /usr/local/share/mplayer/Skin/default/
+
+ + +

2.2 Image formats

+ +Images must be truecolor (24 or 32 bpp) and can be in +BMP, PNG and TGA format (note that TGA images must be uncompressed). +The preferred format is PNG as it compresses very well. + +

+In the main window (see below) you can use images with `transparency': +regions filled with the color #FF00FF (magenta) +are fully transparent when viewed by MPlayer. This means that you can even +have shaped windows if your X server has the XShape extension. + + +

2.3 Parts of a skin

+ +Skins are quite free-format (unlike the fixed-format skins of +Winamp/XMMS, for example), so it is up to you to create something great. + +

+Currently there are three windows to be decorated: the +main window, the subwindow and +the skin menu (which can be activated by a right +click). + +

+ +

+There is an important thing not mentioned yet: for buttons, potmeters and +menu entries to work, MPlayer must know what to do if they are clicked. +This is done by messages (events). For these items +you must define the messages to be genereated when they are clicked. + +

2.4 Files

+ +You need the following files to build a skin. + + +With the exception of the skin configuration file, you can name the other +files whatever you want (but note that font description files must have +.fnt extension). + + +

3 The skin file

+ +

+As mentioned above, this is the skin configuration file. +It is line oriented; comment lines start with a ';' character +at the beginning of the line (only spaces and tabs are allowed before the +';'). + +

+The file is made up of sections. Each section describes the skin for an +application and has the following form: +
+section = section name
+.
+.
+.
+end
+
+ +

+Currently there is only one application, so you need only one section: +its name is movieplayer. + +

+Within this section each window is described by a block in the following form: +
+window = window name
+.
+.
+.
+end
+
+where window name can be one of these strings: +

+ +

+(The sub and menu block is optional---you do not need to create a menu or +to decorate the subwindow.) + +

+Within a window block, you can define each item for the window +by a line in this form: + +

+
+item = parameter
+
+
+ +

+where item is a string that identifies the type of the GUI item, +parameter is a numeric or textual value (or a list of values +separated by commas). +

+ +

+Putting the above together, the whole file looks something like this: + +

+
+section = movieplayer
+  window = main
+  ; ... items for main window ...
+  end
+  
+  window = sub
+  ; ... items for subwindow ...
+  end
+  
+  window = menu
+  ; ... items for skin menu ...
+  end
+end
+
+ +

+Finally some words about specifying images for the various items. +
+The name of an image file must be given without leading directories--- +images are searched in the directory of the skins. You may (but you need not) +specify the file's extension. If the file doesn't exist, MPlayer tries to +load the file <filename>.<ext>, where tga, +TGA, bmp, BMP, png and PNG is tried +for <ext> (in this order). The first matching file will be used. + +

+ +
+Here is an example to make this clear. Suppose that you have an image called +main.png that you use for the main window: +
+
+    base = main, -1, -1
+
+
+ +MPlayer tries to load main, main.tga, main.TGA, +main.bmp etc, so main.png will be found. +
+If (by accident) you wrote +
+
+    base = main.bmp, -1, -1
+
+
+then main.bmp, main.bmp.tga, main.bmp.TGA, +main.bmp.bmp would be searched and MPlayer would finally give up +because there is no main.bmp in the directory, but main.png. +
+ + +

3.1 Main window

+ +Below you can see the list of items that can be used in the +'window = main' . . . 'end' block. + +
+
+base = image, x, y +
+
+Lets you specify the background image to be used for the main window. +The window will appear at the given x,y position +on the screen (0,0 is the top left corner). You can specify -1 for center +and -2 for right (x) and bottom (y). The window will be as large as the image. +

+ +Warning: transparent regions in the image (colored #FF00FF) appear +black on X servers without the XShape extension. + +

+
+ +
+
+button = image, x, y, width, height, message
+
+Place a button of width * height size at the +x,y position. The specified message is generated when +the button is clicked. +The image given by image must have three parts below each other +(according to the possible states of the button), like this: +

++------------+
+|  pressed   |
++------------+
+|  released  |
++------------+
+|  disabled  |
++------------+
+
+
+
+ +
+
+decoration = enable|disable +
+
+Enable or disable window manager decoration of the main window. Default +is disable. +
+
+ +
+
+ + +hpotmeter = butt, bw,bh, phases, numphases, default, x, y, w, h, msg + + +
+
+Place a horizontal potmeter of w * h size at the +x,y position. The image can be divided into +different parts for the different phases of the potmeter (for example, +you can have a pot for volume control that turns from green to red +while its value changes from the minimum to the maximum.) +hpotmeter can have a button that can be dragged horizontally. +The parameters are: + +The image used for the different phases must look something like this: +

++------------+
+|  phase #1  |
++------------+
+|  phase #2  |
++------------+
+     ...
++------------+
+|  phase #n  |
++------------+
+
+ +Note: there will be a vpotmeter item too, but is it not implemented +yet. + +
+
+ +
+
+potmeter = phases, numphases, default, x, y, w, h, msg +
+
+A potmeter without a button. (I guess it is ment to be turned round, +but it reacts to horizontal dragging only.) +For the description of the parameters see +hpotmeter. phases can be +NULL, but its quite useless, since you can not see where +the potmeter is set. +
+
+ +
+
+font = fontfile, fontid +
+
+Defines a font. fontfile is the name of a font description file +with .fnt extension (no need to specify the extension +here). +fontid is used to refer to the font +(see dlabel and slabel). +Up to 25 fonts can be defined. +
+
+ +
+
+dlabel = x, y, length, align, fontid, "text" +
+
+Place a dynamic label at the x,y position. The label is called +dynamic because its text is refreshed periodically. +The maximum length of the label is given by length (its height is the +height of a character). +If the text to be displayed is wider than that, then it will be +scrolled, otherwise it is aligned within the specified space by the value +of the align parameter: 0 is for right, 1 is for center, +2 is for left. +
+The text to be displayed is given by text: it must be written between +double quotes (") (but the " cannot be part of the +text). The label is displayed using the font identified by fontid. +You can use the following variables in the text. + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableMeaning
$1play time in hh:mm:ss format
$2play time in mmmm:ss format
$3play time in hh format (hours)
$4play time in mm format (minutes)
$5play time in ss format (seconds)
$6movie's length in hh:mm:ss format
$7movie's length in mmmm:ss format
$8play time in h:mm:ss format
$vvolume in xxx.xx% format
$Vvolume in xxx.x format
$bbalance in xxx.xx% format
$Bbalance in xxx.x format
$$the $ character
$aa character according to the audio type (none: n, + mono: m, stereo: t)
$ttrack number (in playlist)
$ofilename
$ffilename in lower case
$Ffilename in upper case
$Ta character according to the stream type (file: f, + video CD: v, DVD: d, URL: u) +
$pthe "p" character (if a movie is playing and the font has the "p" + character) +
$sthe "s" character (if the movie is stopped and the font has the "s" + character) +
$ethe "e" character (if playback is paused and the font has the "e" + character) +
+

+Note: The $a, $T, $p, $s +and $e variables all return characters that should be displayed +as special symbols (for example, "e" is for the pause symbol that usually +looks something like ||). You should have a font for normal +characters and a different font for symbols. +See the section about symbols for more information. +

+
+ +
+
+slabel = x, y, fontid, text +
+
+Place a static label at the x,y position. +text is displayed using the font identified by fontid. +The text is just a raw string ($x variables do not work) that must be enclosed +between double quotes (the " cannot be part of the text). +The label is displayed using the font identified by fontid. +
+
+ + +

3.2 Subwindow

+ +The following items can be used in the +'window = sub' . . . 'end' block. + +
+
+base = image, x, y, width, height +
+
+The image to be displayed in the window. +The window will appear at the given x,y position +on the screen (0,0 is the top left corner). You can specify -1 for center +and -2 for right (x) and bottom (y). The window will be as large as the image. +width and height gives the size of the window; they are +optional (if they are missing, the window is the same size as the image). +
+
+ +
+
+background = r, g, b +
+
+Lets you set the background color. It is useful if the image is smaller than +the window. +r, g and b specifies the red, green and blue +component of the color (each of them is a decimal number from 0 to 255). +
+
+ + +

3.3 Skin menu

+ +As mentioned earlier, the menu is displayed using two images. +Normal menu entries are taken from the image specified by the base +item, while the currently selected entry is taken from the image specified +by the selected item. +You must define the position and size of each menu entry by the menu +item. + +

+These are the items that can be used in the 'window = menu' +. . . 'end' block. + +

+
+base = image +
+
+The image for normal menu entries. +
+ + +
+
+selected = image +
+
+The image showing the menu with all entries selected. +
+
+ +
+
+menu = x, y, width, height, message +
+
+Defines the x,y position and the size of a menu entry in +the images. message is the message to be generated when +the mouse button is released over the entry. +
+
+ + +

4 Fonts

+ +As mentioned in the section about the parts of a skin, a font is defined +by an image and a description +file. You can place the characters anywhere in the image, but make sure that +their position and size is given in the description file exactly. + +

+The font description file (with .fnt extension) can have comment +lines starting with ';'. +The file must have a line in the form +

+
+image = image
+
+
+ +

+where image is the name of the image file to be used for +the font (you do not have to specify the extension). +The above line is followed by character definition lines of the form: + +

+
+"char" = x, y, w, h
+
+
+ +

+Here x and y specifies the position of the +char character in the image (0,0 is the upper left corner). +w and h is the width and height of the character +(in pixels, of course). + +

+Here is an example that defines the A, B, C characters using font.png. +
+; can be "font" instead of "font.png"
+image = font.png
+
+; Three characters are enough for demonstration only. :-)
+"A" =  0,0, 7,13
+"B" =  7,0, 7,13
+"C" = 14,0, 7,13
+
+ + +

4.1 Symbols

+ +Some characters have special meanings when returned by some of the variables +used in +dlabel; these characters are meant to be +displayed as symbols. (For example, in case of a DVD stream, you could display +a nice DVD logo instead of the character 'd'.) + +

+The following table lists all the characters that can be used to display +symbols (and thus require a different font). + +

+ + + + + + + + + + + + + + + + + + + + + + +
CharacterSymbol
pplay
sstop
epause
nno sound
mmono sound
tstereo sound
fstream is a file
vstream is a video CD
dstream is a DVD
ustream is a URL
+
+ +

+Note: currently only 'p', 's', 'e', 'n', 'm' and 't' is used. +

+ +

Appendix A: GUI messages

+ +These are the messages that can be generated by buttons, potmeters and +menu entries. + +

+ +Note: some of the messages might not work as expected (or not +work at all). As you know, the GUI is under development. + +

+Playback control: +

+
+
evNext +
Jump to next track in the playlist. + +
evPause +
Pause playing. + +
evPauseSwitchToPlay +
Forms a switch together with evPlaySwitchToPause. They can be +used to have a common play/pause button. Both messages should be assigned +to buttons displayed at the very same position in the window. This +message pauses playing and the image for the evPlaySwitchToPause button +is displayed (to indicate that the button can be pressed to continue playing). + +
evPlay +
Start playing. + +
evPlaySwitchToPause +
The opposite of evPauseSwitchToPlay. This message starts playing +and the image for the evPauseSwitchToPlay button is displayed (to +indicate that the button can be pressed to pause playing). + +
evPrev +
Jump to previous track in the playlist. + +
evStop +
Stop playing. +
+
+ +

+Seeking in the stream: +

+
+
evBackward10sec +
evBackward1min +
evBackward10min +
Seek backward 10 seconds / 1 minute / 10 minutes. + +
evForward10sec +
evForward1min +
evForward10min +
Seek forward 10 seconds / 1 minute / 10 minutes. + +
evSetMoviePosition +
Seek to position (can be used by a potmeter; the relative +value (0-100%) of the potmeter is used). +
+
+ +

+Video control: +

+
+
evDoubleSize +
Set the movie window to double size. + +
evFullScreen +
Switch fullscreen mode on/off. + +
evNormalSize +
Set the movie window to its normal size. +
+
+ +

+Audio control: +

+
+
evDecAudioBufDelay +
Decrease audio buffer delay. + +
evDecBalance +
Decrease balance. + +
evDecVolume +
Decrease volume. + +
evIncAudioBufDelay +
Increase audio buffer delay. + +
evIncBalance +
Increase balance. + +
evIncVolume +
Increase volume. + +
evMute +
Mute/unmute the sound. + +
evSetBalance +
Set balance (can be used by a potmeter; the relative +value (0-100%) of the potmeter is used). + +
evSetVolume +
Set volume (can be used by a potmeter; the relative +value (0-100%) of the potmeter is used). +
+
+ +

+Miscellaneous: +

+
+
evAbout +
Open the about window. + +
evEqualeaser +
Turn the equalizer on/off. + +
evExit +
Quit from the program. + +
evIconify +
Iconify the window. + +
evLoad +
Load a file (by opening a file browser window, where you can choose a +file). + +
evLoadPlay +
Does the same as evLoad, but it automatically starts +playing after the file is loaded. + +
evNone +
Empty message, it has no effect. (Except maybe in CVS versions. :-)) + +
evPlayList +
Open/close the playlist window. + +
evPreferences +
Open the preferences window. + +
evSkinBrowser +
Open the skin browser window. +
+
+ + +