Kodi Community Forum

Full Version: Mainmenu
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I'd like to customize each button with a colored stripe. So "Settings" should have a yellow stripe on top, "Music" should have a red stripe.
I tried this by setting up a variable that should change the value (path to images with different colors) with an hasfocus-condition. But all Buttons use the same color. If I hover over the buttons the color changes of all the buttons. That's weird.
Those for buttons should have a stripe in red,blue,yellow and green color. But my code messes up. Please help me out?

Here some screenshotsImageImageImage

code:

<variable name="MainMenu_Button_stripe">
        <value condition="Container(9000).Hasfocus(1)">special://skin/extras/stripe/red.png</value>
        <value condition="Container(9000).Hasfocus(2)">special://skin/extras/stripe/blue.png</value>
        <value condition="Container(9000).Hasfocus(3)">special://skin/extras/stripe/yellow.png</value>
        <value condition="Container(9000).Hasfocus(4)">special://skin/extras/stripe/green.png</value>
    </variable>

for the buttons that are in an itemlayout/focusedlayout:  

 <control type="image"> <!-- oberer Streifen -->
<top>24</top>
<left>7</left>
<width>190</width>
<height>4</height>
<texture>$VAR[MainMenu_Button_stripe]</texture>
<aspectratio>scale</aspectratio>
</control>
not sure if this skin uses standard menu buttion

<item>
       <label>Internet</label>
       <property name="menu_id">$NUMBER[20000]</property>
       <onclick>ActivateWindow()</onclick>
       <thumb>icons/sidemenu/internet.png</thumb>
       <property name="id">internet</property>
       <visible>!Skin.HasSetting(HomeMenuNointernetButton)</visible>
      </item>
<thumb>  may need a transparent image with stripe at the top

<value condition="Container(9000).Hasfocus(1)"> this may need to be movies
the menu is linked by
<visible>String.IsEqual(Container(9000).ListItem.Property(id),movies)</visible>
or the id number  <property name="menu_id">$NUMBER[5000]</property> <control type="group" id="5000">
I use the eminence skin and modified it.
I was also thinking about the possibility to use the thumb property. But I don't know where to change that. There is no entry in the skin files, so I guess it uses the standard-item configuration for the main menu. The main menu auf the skin uses <itemlayout> and <focusedlayout> to arrange the items: Image+Label+Icon. How could I insert the thumb? And where can I edit the information for <thumb> for each item?


<itemlayout width="206" height="266" condition="!String.IsEqual(Skin.String(home.style),$LOCALIZE[31181]) + !String.IsEqual(Skin.String(home.style),$LOCALIZE[31182])">
                    <control type="image">
                        <top>24</top>
                        <left>11</left>
                        <width>190</width>
                        <height>158</height>
                        <texture colordiffuse="HomeBarTile">common/tile3.png</texture>
                        <aspectratio>stretch</aspectratio>
                        <visible>String.IsEmpty(ListItem.Property(tilecolor)) | !Skin.HasSetting(home.tilecolor.nofocus) | !Skin.HasSetting(home.tilecolor)</visible>
                    </control>
                   <control type="image">
                        <top>16</top>
                        <left>11</left>
                        <width>190</width>
                        <height>158</height>
                        <texture>$INFO[ListItem.Icon]</texture>
                        <aspectratio scalediffuse="false">center</aspectratio>
                        <animation effect="fade" start="50" end="50" condition="true">Conditional</animation>
                    </control>
                    <control type="label">
                        <top>180</top>
                        <left>11</left>
                        <height>78</height>
                        <width>190</width>
                        <align>center</align>
                        <aligny>center</aligny>
                        <font>Font-HomeMenu</font>
                        <textcolor>HomeBarFG</textcolor>
                        <label>$INFO[ListItem.Label]</label>
                        <animation effect="fade" start="50" end="50" condition="true">Conditional</animation>
                    </control>
Well I found the entries for <thumb></thumb>. But changes to that also affected the icons of my buttons, so I finally used the property <label2> to point to my color stripe. This worked. It's a dirty solution. I also tried to introduce a new property <property name="stripe">red.png</property> and called it with ListItem.Property(stripe). But didn't work.

Image