Difference between revisions of "Menu-ui.xml"
From MythTV Official Wiki
Line 33: | Line 33: | ||
<alpha>200</alpha> <!-- optional, sets text opacity. Defaults to 255 --> | <alpha>200</alpha> <!-- optional, sets text opacity. Defaults to 255 --> | ||
</clock></nowiki> | </clock></nowiki> | ||
+ | |||
+ | An (optional) logo definition: | ||
+ | <pre> | ||
+ | <imagetype name="logo"> | ||
+ | <position>30,495</position> | ||
+ | <filename>ui/mythtvlogo.png</filename> | ||
+ | </imagetype></pre> | ||
Definition of menu page titles: | Definition of menu page titles: | ||
Line 77: | Line 84: | ||
</textarea> | </textarea> | ||
</state></pre> | </state></pre> | ||
+ | |||
+ | Definitions for the menu items: | ||
+ | |||
+ | <pre><buttonlist2 name="menu"> | ||
+ | <area>160,70,300,320</area> <!-- the whole menu area including buttons & arrows --> | ||
+ | <layout>vertical</layout> <!-- vertical or horizontal layouts are possible --> | ||
+ | <spacing>0</spacing> <!-- spacing between menu items --> | ||
+ | <buttonarea>0,55,300,320</buttonarea> <!-- the actual button area --> | ||
+ | <statetype name="buttonitem"> | ||
+ | <state name="active"> <!-- a visible menu entry --> | ||
+ | <area>0,0,300,50</area> <!-- the size of a menu item --> | ||
+ | <imagetype name="background" /> <!-- an empty imagetype --> | ||
+ | <textarea name="buttontext"> | ||
+ | <area>5,0,300,50</area> <!-- text positioned 5 px from the left of the buttom --> | ||
+ | <font>menufont</font> | ||
+ | <align>left,vcenter</align> <!-- align text to the left and vertically centred --> | ||
+ | <cutdown>yes></cutdown> | ||
+ | </textarea> | ||
+ | </state> | ||
+ | <state name="selected" from="active"> <!-- inherit this state from 'active' state --> | ||
+ | <imagetype name="background"> | ||
+ | <filename>ui/button_on.png</filename> | ||
+ | </imagetype> | ||
+ | </state> | ||
+ | </statetype> | ||
+ | </pre> |
Revision as of 13:27, 2 September 2008
menu-ui.xml is a new file proposed to be used to specify the organisation of mythtv's main menu screens
<myththeme>
It is comprised of: The mainmenu window.
<window name="mainmenu">
font definitions:
<font name="basefont" face="Arial"> <color>#FFFFFF</color> <size>22</size> <size:small>16</size:small> <size:big>50</size:big> </font> <font name="redfont" from="basefont"> <!-- define 'redfont' inheriting properties of 'basefont' N.B. 'from=' replaces 'base=' used before mythui --> <color>#FF0000</color> </font> <font name="greenfont" from="basefont"> <color>#00FF00</color> </font>
An (optional) clock definition:
<clock name="clock"> <area>300,200,200,40</area> <!-- clock area 200 px wide by 40 px high starting at 300,300 --> <font>basefont</font> <align>right</align> <!-- optional attribute, defaults to 'left' --> <format>%DATE% %TIME%</format> <!-- valid values are: --> <alpha>200</alpha> <!-- optional, sets text opacity. Defaults to 255 --> </clock>
An (optional) logo definition:
<imagetype name="logo"> <position>30,495</position> <filename>ui/mythtvlogo.png</filename> </imagetype>
Definition of menu page titles:
<statetype name="titles"> <position>20,20</position> <!-- position at 20 px from the left, 20px from the top of screen --> <state name="TV"> <imagetype name="TV"> <filename>title/title_tv.png</filename> </imagetype> </state> <state name="TVSETUP" from="TV" /> <!-- inherit from 'TV' state --> ... ... ... </statetype>
Note that the states do not have to contain merely images, they could just as easily be defined as follows:
<state name="TV"> <textarea name="TV"> <area>0,0,300,40</area> <font>menufont</font> <align>right</align> <alpha>127</alpha> <!-- set to half transparent --> <value>TV</value> <!-- the text to be displayed --> </textarea> </state>
Or, possibly a combination of text and images:
<state name="TV"> <imagetype name="TV"> <filename>title/title_tv.png</filename> </imagetype> <textarea name="TV2"> <!-- children of the same parent need unique names --> <area>0,0,300,40</area> <font>menufont</font> <align>right</align> <alpha>127</alpha> <!-- set to half transparent --> <value>TV</value> <!-- the text to be displayed --> </textarea> </state>
Definitions for the menu items:
<buttonlist2 name="menu"> <area>160,70,300,320</area> <!-- the whole menu area including buttons & arrows --> <layout>vertical</layout> <!-- vertical or horizontal layouts are possible --> <spacing>0</spacing> <!-- spacing between menu items --> <buttonarea>0,55,300,320</buttonarea> <!-- the actual button area --> <statetype name="buttonitem"> <state name="active"> <!-- a visible menu entry --> <area>0,0,300,50</area> <!-- the size of a menu item --> <imagetype name="background" /> <!-- an empty imagetype --> <textarea name="buttontext"> <area>5,0,300,50</area> <!-- text positioned 5 px from the left of the buttom --> <font>menufont</font> <align>left,vcenter</align> <!-- align text to the left and vertically centred --> <cutdown>yes></cutdown> </textarea> </state> <state name="selected" from="active"> <!-- inherit this state from 'active' state --> <imagetype name="background"> <filename>ui/button_on.png</filename> </imagetype> </state> </statetype>