= MythUIThemeFormat =

Just to start documenting things..  All numbers that refer to on-screen position/size are automatically adjusted for the UI size.  Boolean values can be 'yes', 'no', '1', '0', etc.

== Fonts ==

will be changing slightly..  currently is:

{{{
  <font name="normal" face="Arial">
     <size>11</size>
     <size:small>9</size:small>
     <size:big>13</size:big>
     <color>#ffffff</color>
     <shadowcolor>#000000</shadowcolor>
     <shadowoffset>2,2</shadowoffset>
     <shadowalpha>64</shadowalpha>
     <outlinecolor>#888888</outlinecolor>
     <outlinesize>2</outlinesize>
     <outlinealpha>64</outlinealpha>
     <bold>yes</bold>
     <italics>yes</italics>
     <underline>yes</underline>
  </font>

  <font name="graynormal" base="normal">
     <color>#444444</color>
  </font>
}}}

== General widget modifiers ==

Items that are valid for every subtype
{{{
     <position>x,y</position>
}}}

Position on screen, relative to parent.

== Images ==

Standard image example:
{{{
  <imagetype name="imagename">
     <filename>imagefile.png</filename>
     <staticsize>width,height</staticsize>
     <skipin>x,y</skipin>
  </imagetype>
}}}

 * filename is the filename.
 * staticsize forces scaling the image to that particular size.
 * skipin starts drawing from coords given in the source image.

Animated image example:
{{{
  <imagetype name="imagename">
     <filepattern low="0" high="30">imagefile%1.png</filepattern>
     <delay>500</delay>
  </imagetype>
}}}

 * Loads images imagefile0.png through imagefile30.png, and displays them sequentially 500 msecs apart.

An image must have either a filename or filepattern element.  Everything else is optional.

== Text Areas ==

{{{
  <textarea name="textarea">
    <area>x,y,w,h</area>
    <altarea>x,y,w,h</altarea>
    <font>normal</font>
    <value>This is a text area</value>
    <cutdown>yes</cutdown>
    <multiline>yes</multiline>
    <align>left</align>
    <colorcycle start="#000000" end="#ffffff" steps="255"/>
  </textarea>
}}}

 * area - area on screen
 * value - the text to be displayed
 * altarea - alternative area (ie., watch recordings screen, the description is larger if there is no video preview).
 * font - name of a pre-defined font
 * cutdown - if the text will be cut down ('...' replacing the end) if it's too large to fit, or just cut off
 * multiline - wrap text onto multiple lines
 * align - possible values are center, right, left, allcenter (v + h), vcenter, hcenter
 * colorcycle - oscillate between the start and end values, with X steps in between (approx 30 steps per second).

All values optional except area, font, and value.