Howto skin? (1 Viewer)

[prozacdk]

Hi,

I would like to start skinning (at least give it a try), but I havent managed to find any information/guides/manuels on how to do it?

Can anyone help me?

Regards
Martin

 

[mikael]

1. Start with just edit the gfx in the media folder of an existing skin.
2. Try to edit the xml-files to move/resize the gfx

You can read more about the skin architecture on the wiki: http://wiki.team-mediaportal.com/SkinArchitecture

 

[Noelix]

Well I have some specific questions as I have been looking at the xml for both BlueTwo and Project Mayhem III skins. Right now I'm just looking to modify the basic home screen so that I replace the button "My Pictures" with a link to the DVD player function, since I don't use the My Pictures feature at all but use the DVD player feature all the time. Please help me understand this code here from PMIII's basic screen:

		<control>
			<description>pictures normal push button</description>
			<type>button</type>
			<id>13</id>
			<posX>91</posX>
			<posY>270</posY>
			<width>14</width>
			<height>13</height>
			<label>1</label>
			<hyperlink>2</hyperlink>
			<font>font10</font>
			<onleft>13</onleft>
			<onright>13</onright>
			<onup>2</onup>
			<ondown>3</ondown>
			<textureFocus>home-focus.gif</textureFocus>
			<textureNoFocus>button-nofocus.png</textureNoFocus>
			<textXOff>20</textXOff>
			<hover>hover_my pictures.png</hover>
			<hoverX>313</hoverX>
			<hoverY>108</hoverY>
			<hoverWidth>407</hoverWidth>
			<hoverHeight>358</hoverHeight>
		</control>

Ok I'm going to attempt to figure these out one at a time.
<control> seems to be like an object tag, easy enough.
<description> a description of the object obviously - but is it only seen in the xml or does it play a more important role (i.e. does it need a specific string to function properly)
<type> is easy enough to figure out, because the only two types I see are labels and buttons
<id> seems to be a sequential # indicating order to the program
<label> ... no idea
<hyperlink> ... lost again, the number seems totally random

Let me know if I'm on the right track to understanding this and what those last two items mean and how I define them... Thanks!

 

[jawbroken]

I would guess (no experience with basichome) that hyperlink was the number of the module to go to (an ID for the module). Have you tried changing the hyperlink on the My Pictures button to the same ID as, say, the Music button and seeing if the Pictures button goes to Music now.

The description can be anything, I believe. It is just a comment.

 

[Harley]

Hi Noelix,

the hyperlink ID is the Nr. of the xml, you will go to with the hyperlinkfunktion.

I will have a look at the xml code today and will give you the changes then.


Greetings Harley

 

[Forgotten Illustrator]

<control>
<description>pictures normal push button</description>
<type>button</type> <!--What the function off this control is e.g. button, image, fadelabel etc.-->
<id>13</id> <!--gives this control a diffent identity which is needed some times-->
<posX>91</posX>
<posY>270</posY> <!--X,Y position from top left of screen.-->
<width>14</width>
<height>13</height> <!--Sides of control -->
<label>1</label> <!-- u us this to call different string names e.g. “133” will call “Artists” text and will translate it to which ever language the user is using. -->
<hyperlink>2</hyperlink> <!--This is used to jump to the page which u wish to link the button too. -->
<font>font10</font>
<onleft>13</onleft> <!-- on left arrow jump to id 13 button-->
<onright>13</onright> <!-- on right arrow jump to id 13 button-->
<onup>2</onup> <!-- on up arrow jump to id 2 -->
<ondown>3</ondown> <!-- on down arrow jump to id 3 -->
<textureFocus>home-focus.gif</textureFocus> <!--when this button is selected call this image-->
<textureNoFocus>button-nofocus.png</textureNoFocus> <!-- when this button is NOT selected call this image -->
<textXOff>20</textXOff> <!--Position of-set of text label over image from your original X,Y in this control. -->
<hover>hover_my pictures.png</hover>
<hoverX>313</hoverX>
<hoverY>108</hoverY>
<hoverWidth>407</hoverWidth>
<hoverHeight>358</hoverHeight>
</control>

 

[Noelix]

First off, thanks for the responses, guys.

Forgotten... I saw this in your description:

<control>
<label>1</label> <!-- u us this to call different string names e.g. “133” will call “Artists” text and will translate it to which ever language the user is using. -->
<hyperlink>2</hyperlink> <!--This is used to jump to the page which u wish to link the button too. -->

So where are labels defined at? Are they defined by mediaportal or by the skinner? Where might I be able to define/find these labels?

And the same questions go for hyperlinks. If they were defined in the xml documents somewhere I didn't find them...

 

[surfermc]

So where are labels defined at? Are they defined by mediaportal or by the skinner? Where might I be able to define/find these labels?

The labels are defined in the language strings. Have a look at the file C:\Program Files\Team MediaPortal\MediaPortal\Language\English\strings.xml

And the same questions go for hyperlinks. If they were defined in the xml documents somewhere I didn't find them...

These are defined at the top of the start of the .xml definition files e.g MyRadio.xml has

- <window>
  <id>30</id> <------------------------****************
  <defaultcontrol>2</defaultcontrol> 
  <allowoverlay>yes</allowoverlay> 
  <define>#header.label:666</define> 
  <define>#header.image:radio_logo.png</define> 
  <define>#header.hover:hover_my radio.png</define> 
- <controls>

Where 30 is the definition of the hyperlink. The following is extracted from Basichome.xml

<control>
  <description>home BM Radio</description> 
  <type>button</type> 
  <id>2</id> 
  <posX>19</posX> 
  <posY>240</posY> 
  <width>162</width> 
  <height>225</height> 
  <textureFocus>Radio.png</textureFocus> 
  <textureNoFocus>hover_my radio.png</textureNoFocus> 
  <thumbZoom>yes</thumbZoom> 
  <hyperlink>30</hyperlink> <---------------------------*************
  <hover>-</hover> 
  <hoverX>265</hoverX> 
  <hoverY>270</hoverY> 
  <hoverWidth>204</hoverWidth> 
  <hoverHeight>230</hoverHeight> 
  <label>665</label> 
  <textcolor>00ffffff</textcolor> 
  <textcolorNoFocus>00ffffff</textcolorNoFocus> 
  <onleft>6</onleft> 
  <onright>3</onright> 
  <onup>21</onup> 
  <ondown>2</ondown> 
  </control>

Hope this helps
MC

 

[Noelix]

Alright so far I have gotten the Basic Home screen updated, but I can't figure out how to link the button properly. I see what surfermc said about the IDs in the xml and whatnot, but that only seems to work for hyperlinks that link to another xml document. In this case it's launching a dvd and not another page, so the functionality has to be different. I've looked at the only place in MP where you can run a DVD from, the MyVideos screen, and there's no hyperlink on the text:

         <control>
            <description>Play DVD</description>
            <type>button</type>
            <id>6</id>
            <label>341</label>
            <textXOff>17</textXOff>
            <alignY>center</alignY>
         </control>

And the only hyperlink referring to DVD stuff I can find takes me to the DVD settings page, which doesn't have a launch button on it either. Here is a screenshot of what I've got set up so far (apologies for the crappy colors, I took the screenshot through a remote desktop program):
http://www.pix8.net/pro/pic.php?u=102930ElU6&i=945514
And here's the file in case anyone wants it:
http://www.pix8.net/pro/pic.php?u=102930ElU6&i=945515
Aaaand here's the original picture for credentials:
http://www.flickr.com/photos/tico24/16395382

Thanks for all your help so far guys!

 

[Forgotten Illustrator]

I wound love too help you here but I don’t know the internal workings of MP. So all I’ve got to say is what are trying to do?

Link this button too play a DVD on click?

There is a lot of limitation in the skinning engine without the expiation off what MP is trying to do. Unless you download the sources code and see were they (programmers) are trying to go, you just have to play around and see what it does. Have you ever programmed before? C++, assembler, Boolean. Etc. This may help you.

From what I’ve seen is a lot of the buttons are linked to there ID number so if you changer them It will not lurch this application.