From 1f47871dfa23df44ebdab547089d7ab1607461f2 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Olivier=20Teuli=C3=A8re?= Date: Mon, 7 Nov 2005 22:10:17 +0000 Subject: [PATCH] * doc/skins/skins2-howto: document the SubBitmap tag --- doc/skins/skins2-howto.xml | 890 +++++++++++++++++++------------------ 1 file changed, 461 insertions(+), 429 deletions(-) diff --git a/doc/skins/skins2-howto.xml b/doc/skins/skins2-howto.xml index fcd70fae83..9800bc6cef 100644 --- a/doc/skins/skins2-howto.xml +++ b/doc/skins/skins2-howto.xml @@ -86,12 +86,14 @@ difficulty to understand how VLC skins work. The bitmaps -Basically, you need one bitmap file (in PNG format) by state of control. For example, with a Image control you need 1 image, with a Button control you need 3 images (for the up, down and mouseover states). Of course, the same bitmap file can be used for many controls, provided you want to display the same image! +Basically, you need one bitmap file (in PNG format) by state of control. For example, with a Image control you need 1 image, with a Button control you need 3 images (for the up, down and mouseover states). The same bitmap file can be used for many controls, using sub-bitmaps. The PNG format allows setting a transparency mask, which will be used wherever the image needs to be displayed (only non-transparent parts will be drawn). In addition, you can also specify a transparency color in the XML file: the bitmap will be considered as transparent wherever this color appears in the bitmap file. Both the transparency mask and the transparent color will be taken into acount, so if the transparency mask is correctly set in the bitmap file you need to choose a unused color for the transparency color. +Starting from VLC 0.8.5, it is not anymore necessary to use PNG format for the bitmap files: most common formats are supported. Using PNG format is still recommended, for compatibility with older VLC versions. + @@ -164,503 +166,533 @@ difficulty to understand how VLC skins work. Bitmap - Associates a bitmap file in PNG format with an identifiant (=name) that will be used by the various controls. Obviously, you need one Bitmap tag for each bitmap file you have. - - id - This is the identifiant of the bitmap that will be used with controls. Two bitmaps cannot have the same id. - Required. - - - file - This attribute is used to indicate the path and name of the bitmap file used. This path can be absolute (but you should definitely avoid it), or relative to the path of the XML file. - Required. - - - alphacolor - This is the transparency color of the bitmap. It must be indicated with the following format: "#RRGGBB" (where RR stands for the hexadecimal value of the red component, GG for the green one, and BB for the blue one). - If your PNG file specifies a transparency mask, it will be taken into account too. - Default value: #000000 - - + Associates a bitmap file (usually in PNG format) with an identifiant (=name) that will be used by the various controls. Obviously, you need one Bitmap tag for each bitmap file you have. + + id + Identifiant of the bitmap that will be used with controls. Two bitmaps cannot have the same id. + Required. + + + file + Indicates the path and name of the bitmap file used. This path can be absolute (but you should definitely avoid it), or relative to the path of the XML file. + Required. + + + alphacolor + Transparency color of the bitmap. It must be indicated with the following format: "#RRGGBB", where RR stands for the hexadecimal value of the red component, GG for the green one, and BB for the blue one. + If your PNG file specifies a transparency mask, it will be taken into account too. + Default value: #000000 + + + + + SubBitmap + Declares a portion of bitmap, that will be used with controls in the same way as a regular Bitmap. A SubBitmap tag can only be placed inside a Bitmap tag, and references implicitly the same file. SubBitmaps are very convenient when a file contains images for several controls. (This tag was not available before VLC 0.8.5). + + id + Identifiant of the portion of bitmap that will be used with controls. It must be unique in the whole skin. + Required. + + + x + Horizontal offset of the sub-bitmap (in pixels), relative to the "parent" bitmap. + Required. + + + y + Vertical offset of the sub-bitmap (in pixels), relative to the "parent" bitmap. + Required. + + + width + Width of the sub-bitmap, in pixels. + Required. + + + height + Height of the SubBitmap, in pixels. + Required. + + Font Declares a font to be used in a Text or Playlist. - - id - Identifiant of the font that will be used with controls. - Required. - - - file - This is the file containing a TrueType font. - Required. - - - size - This is the size of the font, in points. - Default value: 12 - - + + id + Identifiant of the font that will be used with controls. + Required. + + + file + This is the file containing a TrueType font. + Required. + + + size + This is the size of the font, in points. + Default value: 12 + + BitmapFont - - id - Identifiant of the font that will be used with controls. - Required. - - - file - This is the file containing a bitmap font, à la Winamp. - Required. - - - type - Type of font, one of "digits" or "text". - Default value: digits - - + + id + Identifiant of the font that will be used with controls. + Required. + + + file + This is the file containing a bitmap font, à la Winamp. + Required. + + + type + Type of font, one of "digits" or "text". + Default value: digits + + Window A window that will appear on screen. - - id - Name of the window (it may be used for actions). Two windows cannot have the same id. - Default value: none - - - visible - Indicates whether the window should appear when VLC is started. Since VLC remembers the skin windows position and visibility, this attribute will only be used the first time the skin is started. - Default value: true - - - x - Initial left position of the window. - Default value: 0 - - - y - Initial top position of the window. - Default value: 0 - - - dragdrop - Indicates whether drag and drop of media files is allowed on this window. - Default value: true - - - playondrop - Indicates whether a dropped file is played directly (true) or only enqueued (false). This attribute has no effect if dragdrop is set to "false". - Default value: true - - + + id + Name of the window (it may be used for actions). Two windows cannot have the same id. + Default value: none + + + visible + Indicates whether the window should appear when VLC is started. Since VLC remembers the skin windows position and visibility, this attribute will only be used the first time the skin is started. + Default value: true + + + x + Initial left position of the window. + Default value: 0 + + + y + Initial top position of the window. + Default value: 0 + + + dragdrop + Indicates whether drag and drop of media files is allowed on this window. + Default value: true + + + playondrop + Indicates whether a dropped file is played directly (true) or only enqueued (false). This attribute has no effect if dragdrop is set to "false". + Default value: true + + Layout A layout is one aspect of a window, i.e. a set of controls and anchors. A window can have many layouts, but only one will be visible at any time. - - width - Width of the layout. this value is required since VLC is not (yet?) able to calculate it using the sizes and positions of the controls. - Required. - - - height - Height of the layout. this value is required since VLC is not (yet?) able to calculate it using the sizes and positions of the controls. - Required. - - - minwidth - Minimum width of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial width (as specified by the width attribute) will be used as minimum width. - Default value: -1 - - - maxwidth - Maximum width of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial width (as specified by the width attribute) will be used as maximum width. - Default value: -1 - - - minheight - Minimum height of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial height (as specified by the height attribute) will be used as minimum height. - Default value: -1 - - - maxheight - Maximum height of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial height (as specified by the height attribute) will be used as maximum height. - Default value: -1 - - + + width + Width of the layout. this value is required since VLC is not (yet?) able to calculate it using the sizes and positions of the controls. + Required. + + + height + Height of the layout. this value is required since VLC is not (yet?) able to calculate it using the sizes and positions of the controls. + Required. + + + minwidth + Minimum width of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial width (as specified by the width attribute) will be used as minimum width. + Default value: -1 + + + maxwidth + Maximum width of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial width (as specified by the width attribute) will be used as maximum width. + Default value: -1 + + + minheight + Minimum height of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial height (as specified by the height attribute) will be used as minimum height. + Default value: -1 + + + maxheight + Maximum height of the layout. This value is only used when resizing the layout. If this value is set to "-1", the initial height (as specified by the height attribute) will be used as maximum height. + Default value: -1 + + Group Adds an offset to the elements it contains. A Group is only supposed to ease the job of the skin designer, who can adjust the position of a group of controls without modifying all the coordinates, but you can ignore it if you want (only one Group is necessary, inside the Window tag). Group tags can be nested. - - x - Try and guess. - Default value: 0 - - - y - What do you think? - Default value: 0 - - + + x + Try and guess. + Default value: 0 + + + y + What do you think? + Default value: 0 + + Anchor Create a "magnetic point" (or curve) in the current window. If an anchor of another window enters in the range of action of this anchor, the 2 anchors will automatically be on the same place, and the windows are "sticked". Each anchor has a priority (priority attribute), and the anchor with the highest priority is the winner, which means that when moving its window all the other anchored windows will move too. To break the effect of 2 anchored windows, you need to move the window whose anchor has the lower priority. - - x - Is it really necessary to explain ? - Default value: 0 - - - y - ... - Default value: 0 - - - priority - Priority of anchor (see the previous description). - Required. - - - points - Points defining the Bezier curve followed by the anchor. - You don't need to change this parameter if all you want is a ponctual anchor. - Default value: (0,0) - - - range - Range of action of the anchor, in pixels. Default is "10". - Default value: 10 - - + + x + Is it really necessary to explain ? + Default value: 0 + + + y + ... + Default value: 0 + + + priority + Priority of anchor (see the previous description). + Required. + + + points + Points defining the Bezier curve followed by the anchor. + You don't need to change this parameter if all you want is a ponctual anchor. + Default value: (0,0) + + + range + Range of action of the anchor, in pixels. Default is "10". + Default value: 10 + + Attributes common to all the controls The following attributes are common to all the controls (Image, Button, Checkbox, Text, Slider, RadialSlider, Playlist, Video) - - id - Identifiant of the control. Currently unused. - Default value: none - - - visible - See Boolean expressions. - Default value: true - - - x - Horizontal offset of the control, relative to the parent tag (usually Group or Layout). - Default value: 0 - - - y - Vertical offset of the control, relative to the parent tag (usually Group or Layout). - Default value: 0 - - - lefttop - Indicate to which corner of the Layout the top-left-hand corner of this control is attached, in case of resizing. Possible values are 'lefttop', 'leftbottom', 'righttop' and 'rightbottom'. - Default value: lefttop - - - rightbottom - Indicate to which corner of the Layout the bottom-right-hand corner of this control is attached, in case of resizing. - Default value: lefttop - - - help - Help text for the current control. The variable '$H' will be expanded to this value when the mouse hovers the current control (see Text variables). - Default value: - - + + id + Identifiant of the control. Currently unused. + Default value: none + + + visible + See Boolean expressions. + Default value: true + + + x + Horizontal offset of the control, relative to the parent tag (usually Group or Layout). + Default value: 0 + + + y + Vertical offset of the control, relative to the parent tag (usually Group or Layout). + Default value: 0 + + + lefttop + Indicate to which corner of the Layout the top-left-hand corner of this control is attached, in case of resizing. Possible values are 'lefttop', 'leftbottom', 'righttop' and 'rightbottom'. + Default value: lefttop + + + rightbottom + Indicate to which corner of the Layout the bottom-right-hand corner of this control is attached, in case of resizing. + Default value: lefttop + + + help + Help text for the current control. The variable '$H' will be expanded to this value when the mouse hovers the current control (see Text variables). + Default value: + + Image Create a simple image. Particularly useful for backgrounds. See the Common attributes. - - image - Identifiant of a Bitmap. - Required. - - - resize - Since VLC 0.8.2. Specify the behaviour of the image when it is resized. Possible values are 'mosaic' (the image is repeated as many times as necessary to reach the wanted dimensions) and 'scale' (the image is actually rescaled). Beware that the 'scale' behaviour is much slower than the 'mosaic' one, so make sure to use it only when it's really needed. - Default value: mosaic. - - - action - Action triggered by a click on the control. Possible values are "move", to move the window, or "resizeSE" (SE as in South-East ; other directions will be added in the future) to resize the window in the corresponding direction. - Default value: none - - + + image + Identifiant of a Bitmap. + Required. + + + resize + Since VLC 0.8.2. Specify the behaviour of the image when it is resized. Possible values are 'mosaic' (the image is repeated as many times as necessary to reach the wanted dimensions) and 'scale' (the image is actually rescaled). Beware that the 'scale' behaviour is much slower than the 'mosaic' one, so make sure to use it only when it's really needed. + Default value: mosaic. + + + action + Action triggered by a click on the control. Possible values are "move", to move the window, or "resizeSE" (SE as in South-East ; other directions will be added in the future) to resize the window in the corresponding direction. + Default value: none + + Button Create a button. See the common attributes. - - up - Identifiant of a Bitmap, used when the button is up. - Required. - - - down - Identifiant of a Bitmap, used when the button is down. - Default value: none - - - over - Identifiant of a Bitmap, used when the mouse is over the button. - Default value: none - - - action - Action executed when the button is clicked. See Actions for a list of possible actions. - Default value: none - - + + up + Identifiant of a Bitmap, used when the button is up. + Required. + + + down + Identifiant of a Bitmap, used when the button is down. + Default value: none + + + over + Identifiant of a Bitmap, used when the mouse is over the button. + Default value: none + + + action + Action executed when the button is clicked. See Actions for a list of possible actions. + Default value: none + + Checkbox Create a checkbox, i.e. a button with 2 states (checked/unchecked). So you need 6 images for a full-featured checkbox: each state has a basic image ('up' state), an image for the control being hovered by the mouse ('over' state) and an image corresponding to a click not yet released ('down' state). If you supply only the basic images, the other ones will be identical. See the common attributes. - - up1 - Identifiant of a Bitmap, used when the checkbox is up in the first state. - Required. - - - down1 - Identifiant of a Bitmap, used when the checkbox is down in the first state. - Default value: none - - - over1 - Identifiant of a Bitmap, used when the mouse is over the checkbox in the first state. - Default value: none - - - up2 - Identifiant of a Bitmap, used when the checkbox is up in the second state. - Required. - - - down2 - Identifiant of a Bitmap, used when the checkbox is down in the second state. - Default value: none - - - over2 - Identifiant of a Bitmap, used when the mouse is over the checkbox in the second state. - Default value: none - - - state - Boolean expression specifying the state of the checkbox: if the expression resolves to 'false', the first state will be used, and if it resolves to 'true' the second state will be used. Example for a checkbox showing/hiding a window whose id is "playlist_window": state="playlist_window.isVisible" (or state="not playlist_window.isVisible", depending on the states you chose). - Required. - - - action1 - Action executed when the checkbox is clicked (state 1 to state 2). See Actions for a list of possible actions. - Default value: none - - - action2 - Action executed when the checkbox is clicked (state 2 to state 1). See Actions for a list of possible actions. - Default value: none - - - tooltiptext1 - Tooltip associated with the checkbox in state 1. See also Text variables. - Default value: - - - tooltiptext2 - Tooltip associated with the checkbox in state 2. See also Text variables. - Default value: - - + + up1 + Identifiant of a Bitmap, used when the checkbox is up in the first state. + Required. + + + down1 + Identifiant of a Bitmap, used when the checkbox is down in the first state. + Default value: none + + + over1 + Identifiant of a Bitmap, used when the mouse is over the checkbox in the first state. + Default value: none + + + up2 + Identifiant of a Bitmap, used when the checkbox is up in the second state. + Required. + + + down2 + Identifiant of a Bitmap, used when the checkbox is down in the second state. + Default value: none + + + over2 + Identifiant of a Bitmap, used when the mouse is over the checkbox in the second state. + Default value: none + + + state + Boolean expression specifying the state of the checkbox: if the expression resolves to 'false', the first state will be used, and if it resolves to 'true' the second state will be used. Example for a checkbox showing/hiding a window whose id is "playlist_window": state="playlist_window.isVisible" (or state="not playlist_window.isVisible", depending on the states you chose). + Required. + + + action1 + Action executed when the checkbox is clicked (state 1 to state 2). See Actions for a list of possible actions. + Default value: none + + + action2 + Action executed when the checkbox is clicked (state 2 to state 1). See Actions for a list of possible actions. + Default value: none + + + tooltiptext1 + Tooltip associated with the checkbox in state 1. See also Text variables. + Default value: + + + tooltiptext2 + Tooltip associated with the checkbox in state 2. See also Text variables. + Default value: + + Text Control to display some text. See the common attributes. - - font - Identifiant of a Font or BitmapFont (beware that any character not present in the BitmapFont will be printed as a space, so will be invisible). - Required. - - - text - Text to display. See Text variables. - Default value: - - - color - Color of the text, using the #RRGGBB format. - Default value: #000000 - - - width - Width of the text in pixels. If set to "0", the width is automatically calculated to fit with the current text. - Default value: 0 - - + + font + Identifiant of a Font or BitmapFont (beware that any character not present in the BitmapFont will be printed as a space, so will be invisible). + Required. + + + text + Text to display. See Text variables. + Default value: + + + color + Color of the text, using the #RRGGBB format. + Default value: #000000 + + + width + Width of the text in pixels. If set to "0", the width is automatically calculated to fit with the current text. + Default value: 0 + + Slider Create a slider. See the common attributes. - - up - Identifiant of a Bitmap, used when the slider cursor is up. - Required. - - - down - Identifiant of a Bitmap, used when the slider cursor is down. - Default value: none - - - over - Identifiant of a Bitmap, used when the mouse is over the slider cursor. - Default value: none - - - points - Points defining the Bezier curve followed by the slider cursor. - Default value: none - - - thickness - Thickness of the slider curve. This attribute is used to determine whether the mouse is over the slider (hence whether a mouse click will have an effect on the cursor position). - Default value: 10 - - - value - Variable controlled by the slider. Recognized values are "volume" and "time" (only exception: the Slider defined inside the Playlist tag does not need to set this attribute). - Default value: none - - - tooltiptext - Tooltip associated with the slider. See also Text variables. - Default value: - - + + up + Identifiant of a Bitmap, used when the slider cursor is up. + Required. + + + down + Identifiant of a Bitmap, used when the slider cursor is down. + Default value: none + + + over + Identifiant of a Bitmap, used when the mouse is over the slider cursor. + Default value: none + + + points + Points defining the Bezier curve followed by the slider cursor. + Default value: none + + + thickness + Thickness of the slider curve. This attribute is used to determine whether the mouse is over the slider (hence whether a mouse click will have an effect on the cursor position). + Default value: 10 + + + value + Variable controlled by the slider. Recognized values are "volume" and "time" (only exception: the Slider defined inside the Playlist tag does not need to set this attribute). + Default value: none + + + tooltiptext + Tooltip associated with the slider. See also Text variables. + Default value: + + RadialSlider Create a circular slider from a list of images with the different possible positions. See the common attributes. - - sequence - Identifiant of a Bitmap containing the list of images of the different positions of the slider, concatenated vertically. - Required. - - - nbimages - Number of elementary images contained in the sequence. - Required. - - - minangle - Minimum angle of the rotation, corresponging to 0%. - Default value: 0 - - - maxangle - Maximum angle of the rotation, corresponging to 100%. - Default value: 360 - - - value - Variable controlled by the slider. Recognized values are "volume" and "time". - Default value: none - - - tooltiptext - Tooltip associated with the slider. See also Text variables. - Default value: - - + + sequence + Identifiant of a Bitmap containing the list of images of the different positions of the slider, concatenated vertically. + Required. + + + nbimages + Number of elementary images contained in the sequence. + Required. + + + minangle + Minimum angle of the rotation, corresponging to 0%. + Default value: 0 + + + maxangle + Maximum angle of the rotation, corresponging to 100%. + Default value: 360 + + + value + Variable controlled by the slider. Recognized values are "volume" and "time". + Default value: none + + + tooltiptext + Tooltip associated with the slider. See also Text variables. + Default value: + + Video Control containing a video. This allows skinable video outputs! this control is still under development and its behaviour may change a lot in the future. - - width - Initial width of the control, in pixels. - Default value: 0 - - - height - Initial height of the control, in pixels. - Default value: 0 - - + + width + Initial width of the control, in pixels. + Default value: 0 + + + height + Initial height of the control, in pixels. + Default value: 0 + + Playlist Create a playlist. This tag must contain a Slider tag (to allow scrolling in the playlist). See the common attributes. - - width - Width of the playlist, in pixels. If playlist items are wider, the end of the name will be replaced with '...'. - Default value: 0 - - - height - Height of the playlist, in pixels. - Default value: 0 - - - font - Identifiant of a Font tag. - Required. - - - var - Type of playlist. Currently, only "playlist" is recognized, so don't bother with this attribute :) - Default value: playlist - - - bgimage - Identifiant of a Bitmap, used as the background image. When no bitmap is specified, the background will be filled using the bgcolor1 and bgcolor2 attributes. - Default value: none - - - fgcolor - Foreground color of the playlist items. - Default value: #000000 - - - playcolor - Foreground color of the item currently played. - Default value: #FF0000 - - - selcolor - Background color of selected items. - Default value: #0000FF - - - bgcolor1 - Background color for odd playlist items. This attribute is ignored if the bgimage one is used. - Default value: #FFFFFF - - - bgcolor2 - Background color for even playlist items. This attribute is ignored if the bgimage one is used. - Default value: #FFFFFF - + + width + Width of the playlist, in pixels. If playlist items are wider, the end of the name will be replaced with '...'. + Default value: 0 + + + height + Height of the playlist, in pixels. + Default value: 0 + + + font + Identifiant of a Font tag. + Required. + + + var + Type of playlist. Currently, only "playlist" is recognized, so don't bother with this attribute :) + Default value: playlist + + + bgimage + Identifiant of a Bitmap, used as the background image. When no bitmap is specified, the background will be filled using the bgcolor1 and bgcolor2 attributes. + Default value: none + + + fgcolor + Foreground color of the playlist items. + Default value: #000000 + + + playcolor + Foreground color of the item currently played. + Default value: #FF0000 + + + selcolor + Background color of selected items. + Default value: #0000FF + + + bgcolor1 + Background color for odd playlist items. This attribute is ignored if the bgimage one is used. + Default value: #FFFFFF + + + bgcolor2 + Background color for even playlist items. This attribute is ignored if the bgimage one is used. + Default value: #FFFFFF + -- 2.39.2