Fork MediaPortal on GitHub
MediaPortal Windows Media Center

Site navigation


Last Edit

Page last modified 01:14, 13 May 2012 by ajp8164
MediaPortal Wiki > MediaPortal 1 > Contribute > Skins > Skin Related Changes > 1.1.0 to 1.2.0 > Keyboard Skinning

Keyboard Skinning

Was this page helpful?
    Table of contents
    1. 1. Purpose
    2. 2. Description of change
    MPLogo120.png

    1.2.0 beta and later:

    The SMS Virtual Keyboard has been removed, therefore smsKeyboard.xml is no longer used.

    Purpose

    The MediaPortal keyboard has not previously been able to be modified (skinned).

    We now introduce a skin-able keyboard implementation. The implementation is backward compatible in look and behavior however your skin is required to include two new skin xml files named stdKeyboard.xml and smsKeyboard.xml. If these skin files are not included in your skin the keyboard will not appear and no user indication of a problem will be presented. Default files (legacy keyboard look/feel) are available for your skin; simply copy them to your skin directory and your done (unless you would like to customize the defaults). You can find these files in the Blue3 and Blue3Wide skins distributed with MediaPortal.

    Description of change

    The two keyboard xml skin files (stdKeyboard.xml and smsKeyboard.xml) must appear in the skin xml file directory. The default values in these skin xml files may be modified to the skin designers liking. The keyboard skin is defined only once for the whole skin implementation. It is not possible to have multiple keyboard designs for a single skin (although the std and sms keyboards may look different).

    The default standard keyboard control specification is shown below. The image below shows a skinned keyboard example.

    <control>
      <description>standard keyboard</description>
      <type>standardKeyboard</type>
      <id>1</id>
      <keyboardPosX>64</keyboardPosX>
      <keyboardPosY>250</keyboardPosY>
      <keyWidth>34</keyWidth>
      <keyHeight>54</keyHeight>
      <keyHSpacing>0</keyHSpacing>
      <keyVSpacing>2</keyVSpacing>
      <modeKeySpacing>4</modeKeySpacing>
      <modeKeyWidth>110</modeKeyWidth>
      <searchModeKeyWidth>130</searchModeKeyWidth>
      <label></label>
      <labelAlign>center</labelAlign>
      <labelOffX>0</labelOffX>
      <labelOffY>2</labelOffY>
      <labelFont>font10</labelFont>
      <labelColor>FFFFFFFF</labelColor>
      <labelShadowAngle>0</labelShadowAngle>
      <labelShadowDistance>0</labelShadowDistance>
      <labelShadowColor>FF000000</labelShadowColor>
      <labelBoxPosX>0</labelBoxPosX>
      <labelBoxPosY>0</labelBoxPosY>
      <labelBoxWidth>200</labelBoxWidth>
      <labelBoxHeight>30</labelBoxHeight>
      <labelBoxTexture>-</labelBoxTexture>
      <showLabelAsInitialText>no</showLabelAsInitialText>
      <inputTextBoxPosX>64</inputTextBoxPosX>
      <inputTextBoxPosY>218</inputTextBoxPosY>
      <inputTextBoxWidth>-1</inputTextBoxWidth>
      <inputTextBoxHeight>30</inputTextBoxHeight>
      <inputTextAlign>left</inputTextAlign>
      <inputTextOffX>18</inputTextOffX>
      <inputTextOffY>2</inputTextOffY>
      <inputTextFont>font10</inputTextFont>
      <inputTextBoxTexture>white.bmp</inputTextBoxTexture>
      <inputTextColor>FF000000</inputTextColor>
      <inputTextShadowAngle>0</inputTextShadowAngle>
      <inputTextShadowDistance>0</inputTextShadowDistance>
      <inputTextShadowColor>FF000000</inputTextShadowColor>
      <charKeyFont>font14</charKeyFont>
      <namedKeyFont>font10</namedKeyFont>
      <keyTextShadowAngle>0</keyTextShadowAngle>
      <keyTextShadowDistance>0</keyTextShadowDistance>
      <keyTextShadowColor>FF000000</keyTextShadowColor>
      <keyTextureFocus>keyNF.bmp</keyTextureFocus>
      <keyTextureNoFocus>keyNF.bmp</keyTextureNoFocus>
      <keyHighlightColor>FF00FF00</keyHighlightColor>
      <keyPressedColor>FF808080</keyPressedColor>
      <keyDisabledColor>FFFFFFFF</keyDisabledColor>
      <keyFontColor>FF000000</keyFontColor>
      <keySelFontColor>FF000000</keySelFontColor>
      <keyDisabledFontColor>FF808080</keyDisabledFontColor>
    </control>

    Focus_Keyboard_Entry.png

     

    In MediaPortal 1.2 RC and later, it is also possible for skinners to use input mode GUI property: #VirtualKeyboard.SMSStyleInput

    Property holds string value "true" when SMS input is active and "false" when in standard input mode.

    Below is one possibility to utilize it.

    <control>
      <type>image</type>
      <id>0</id>
      <posX>1025</posX>
      <posY>193</posY>
      <width>40</width>
      <height>40</height>
      <texture>keyboard_sms.png</texture>
      <visible>string.contains(#VirtualKeyboard.SMSStyleInput,true)</visible>
      <colordiffuse>88ffffff</colordiffuse>
    </control>
    <control>
      <type>image</type>
      <id>0</id>
      <posX>990</posX>
      <posY>195</posY>
      <width>80</width>
      <height>40</height>
      <texture>keyboard_std.png</texture>
      <visible>string.contains(#VirtualKeyboard.SMSStyleInput,false)</visible>
      <colordiffuse>88ffffff</colordiffuse>
    </control>

    STDKeyboard.png

    SMSKeyboard.png




    Running the latest version?

    V1.8.0 - released July 2014
    Releasenews | Download
    Changelog
     | Requirements
    HTPC
    Team-MediaPortal
     
    About
    Contact |  Press
    Partners