Spin Control: Difference between revisions

From Official Kodi Wiki
Jump to navigation Jump to search
m (formatting)
 
(11 intermediate revisions by 5 users not shown)
Line 2: Line 2:
The spin control is used for when a list of options can be chosen (such as a page up/down control). You can choose the position, size, and look of the spin control.
The spin control is used for when a list of options can be chosen (such as a page up/down control). You can choose the position, size, and look of the spin control.
=== Example ===
=== Example ===
<syntaxhighlight lang="XML" enclose="DIV">
<syntaxhighlight lang="XML" enclose="div">
<control type="spincontrol" id="14">
<control type="spincontrol" id="14">
       <description>My first spin control</description>
       <description>My first spin control</description>
       <posx>80</posx>
       <left>80</left>
       <posy>60</posy>
       <top>60</top>
       <width>250</width>
       <width>250</width>
       <height>200</height>
       <height>200</height>
Line 15: Line 15:
       <texturedown colordiffuse="FFFFAAFF">mydowntexture.png</texturedown>
       <texturedown colordiffuse="FFFFAAFF">mydowntexture.png</texturedown>
       <texturedownfocus colordiffuse="FFFFAAFF">mydownfocustexture.png</texturedownfocus>
       <texturedownfocus colordiffuse="FFFFAAFF">mydownfocustexture.png</texturedownfocus>
      <textureupdisabled colordiffuse="AAFFAAFF">mydowntexture.png</textureupdisabled>
      <texturedowndisabled colordiffuse="AAFFAAFF">mydownfocustexture.png</texturedowndisabled>
       <subtype>page</subtype>
       <subtype>page</subtype>
       <font>font12</font>
       <font>font12</font>
Line 34: Line 36:
In addition to the [[Default Control Tags]] the following tags are available. Note that each tag is '''lower case''' only. This is important, as xml tags are case-sensitive.
In addition to the [[Default Control Tags]] the following tags are available. Note that each tag is '''lower case''' only. This is important, as xml tags are case-sensitive.


{| class="wikitable"
{| class="prettytable"
! Tag !! Description
! Tag !! Description
|-  
|-  
| '''textureup'''
| '''textureup'''
|  
| Specifies the image file which should be displayed for the up arrow when it doesn't have focus. [[Texture Attributes|See here for additional information about textures.]]
Specifies the image file which should be displayed for the up arrow when it doesn't have focus. [[Texture Attributes|See here for additional information about textures.]]
|-  
|-  
| '''textureupfocus'''
| '''textureupfocus'''
| Specifies the image file which should be displayed for the up button when it has focus.
| Specifies the image file which should be displayed for the up button when it has focus.
|-  
|-  
|  '''texturedown'''
|  '''textureupdisabled'''
|  Specifies the image file which should be displayed for the down button when it is not focused.
|  Specifies the image file which should be displayed for the up arrow when the button is disabled.
|-  
|-  
| '''texturedownfocus'''
| '''texturedown'''
| Specifies the image file which should be displayed for the down button when it has focus.
| Specifies the image file which should be displayed for the down button when it is not focused.
|-  
|-  
| '''font'''
| '''texturedownfocus'''
| Font used for the button label. From fonts.xml.
| Specifies the image file which should be displayed for the down button when it has focus.
|-  
|-  
|  '''textcolor'''
|  '''texturedowndisabled'''
Color used for displaying the label. In AARRGGBB hex format, or a name from the [[Colour Themes|colour theme.]].
Specifies the image file which should be displayed for the up arrow when the button is disabled.
|-  
|-  
| '''disabledcolor'''
| '''font'''
| Color used for the label if the control is disabled. In AARRGGBB hex format, or a name from the [[Colour Themes|colour theme.]]
| Font used for the button label. From fonts.xml.
|-  
|-  
|  '''shadowcolor'''
|  '''spincolor'''
Specifies the color of the drop shadow on the text. In AARRGGBB format, or a name from the [[Colour Themes|colour theme.]]
The colour of the text used for this spin control. In AARRGGBB hex format. ''As of Helix, this doesn't actually get processed, use textcolor''
|-  
|-  
| '''subtype'''
| '''textcolor'''
| Defines what type of information the spinner holds. Can be int, float, text or page. Defaults to text. Make sure you use page for a page control.
| Color used for displaying the label. In AARRGGBB hex format, or a name from the [[Colour themes|colour theme.]].
|-  
|-  
| '''align'''
| '''disabledcolor'''
| Label horizontal alignment on the control. Defaults to right, can also be left.
| Color used for the label if the control is disabled. In AARRGGBB hex format, or a name from the [[Colour themes|colour theme.]]
|-  
|-  
| '''aligny'''
| '''shadowcolor'''
| Label vertical alignment on the control. Defaults to top, can also be center.
| Specifies the color of the drop shadow on the text. In AARRGGBB format, or a name from the [[Colour themes|colour theme.]]
|-  
|-  
| '''textoffsetx'''
| '''subtype'''
| Amount to offset the label from the left (or right) edge of the button when using left or right alignment.
| Defines what type of information the spinner holds. Can be int, float, text or page. Defaults to text.  Make sure you use page for a page control.
|-  
|-  
| '''textoffsety'''
| '''align'''
| Amount to offset the label from the top edge of the button when using top alignment.
| Label horizontal alignment on the control. Defaults to right, can also be left.
|-
| '''aligny'''
| Label vertical alignment on the control. Defaults to top, can also be center.
|-
| '''textoffsetx'''
| Amount to offset the label from the left (or right) edge of the button when using left or right alignment.
|-
| '''textoffsety'''
| Amount to offset the label from the top edge of the button when using top alignment.
|- 
| '''textwidth'''
| Will truncate any text that's too long.
|}
|}


<section end="main content" />
<section end="main content" />
== See also ==
== See also ==
'''Development:'''
'''Development:'''
Line 84: Line 98:
* [[Skinning]]
* [[Skinning]]


[[Category:Skin Development]]
[[Category:Skin development]]

Latest revision as of 00:36, 13 July 2020

The spin control is used for when a list of options can be chosen (such as a page up/down control). You can choose the position, size, and look of the spin control.

Example

<control type="spincontrol" id="14">
      <description>My first spin control</description>
      <left>80</left>
      <top>60</top>
      <width>250</width>
      <height>200</height>
      <visible>true</visible>
      <colordiffuse>FFFFFFFF</colordiffuse>
      <textureup colordiffuse="FFFFAAFF">myuptexture.png</textureup>
      <textureupfocus colordiffuse="FFFFAAFF">myupfocustexture.png</textureupfocus>
      <texturedown colordiffuse="FFFFAAFF">mydowntexture.png</texturedown>
      <texturedownfocus colordiffuse="FFFFAAFF">mydownfocustexture.png</texturedownfocus>
      <textureupdisabled colordiffuse="AAFFAAFF">mydowntexture.png</textureupdisabled>
      <texturedowndisabled colordiffuse="AAFFAAFF">mydownfocustexture.png</texturedowndisabled>
      <subtype>page</subtype>
      <font>font12</font>
      <textcolor>FFFFFFFF</textcolor>
      <disabledcolor>80FFFFFF</disabledcolor>
      <align></align>
      <aligny></aligny>
      <textoffsetx></textoffsetx>
      <textoffsety></textoffsety>
      <pulseonselect></pulseonselect>
      <onup>2</onup>
      <ondown>3</ondown>
      <onleft>1</onleft>
      <onright>1</onright>
</control>

Available tags

In addition to the Default Control Tags the following tags are available. Note that each tag is lower case only. This is important, as xml tags are case-sensitive.

Tag Description
textureup Specifies the image file which should be displayed for the up arrow when it doesn't have focus. See here for additional information about textures.
textureupfocus Specifies the image file which should be displayed for the up button when it has focus.
textureupdisabled Specifies the image file which should be displayed for the up arrow when the button is disabled.
texturedown Specifies the image file which should be displayed for the down button when it is not focused.
texturedownfocus Specifies the image file which should be displayed for the down button when it has focus.
texturedowndisabled Specifies the image file which should be displayed for the up arrow when the button is disabled.
font Font used for the button label. From fonts.xml.
spincolor The colour of the text used for this spin control. In AARRGGBB hex format. As of Helix, this doesn't actually get processed, use textcolor
textcolor Color used for displaying the label. In AARRGGBB hex format, or a name from the colour theme..
disabledcolor Color used for the label if the control is disabled. In AARRGGBB hex format, or a name from the colour theme.
shadowcolor Specifies the color of the drop shadow on the text. In AARRGGBB format, or a name from the colour theme.
subtype Defines what type of information the spinner holds. Can be int, float, text or page. Defaults to text. Make sure you use page for a page control.
align Label horizontal alignment on the control. Defaults to right, can also be left.
aligny Label vertical alignment on the control. Defaults to top, can also be center.
textoffsetx Amount to offset the label from the left (or right) edge of the button when using left or right alignment.
textoffsety Amount to offset the label from the top edge of the button when using top alignment.
textwidth Will truncate any text that's too long.


See also

Development: