[mikeSiLVO]

You could with an item/focused layout but not easily with a grouplist using radiobuttons.

Unless you are ok with that background image across the entire width and only when not focused using a colordiffuse on a texturenofocus image.

But what if the color chosen was FF111111? That’d cause the same issue of blending into the background… Problem with infinite choice is infinite possibilities and that is, imho, untenable. No matter what there has to be limits. For example if you chose black for everything in my skin you could do it but it would look like fried crapola on a stick. Simple things for a popular color like black makes sense but I recommend not falling down the rabbit hole of user possibilities.

[kittmaster]

That is a good point, and does beg the question, even before I started to make the change the problem exists, clearly, like the shadow color, it is set to black, and nearly unreadable. So, what do you do what the tables turn on say white, or orange or whatever.... if the selection matches X background, you always have a single case of unreadability. So what is the answer to that riddle? Even if you offset it by +222222 or -222222, it defeats the purpose of coloring the font/words. Even the box as mentioned shares the same fate, which now seems to make sense why most skinner have provided fixed values for skin colors to keep the control and prevent exactly what is happening here... so it leads back to...... what was the intent?

Totally agree about not falling down a rabbit hole, but leaving it in this state? hmmm.....what to do what to do.....

[mikeSiLVO]

That is a good point, and does beg the question, even before I started to make the change the problem exists, clearly, like the shadow color, it is set to black, and nearly unreadable. So, what do you do what the tables turn on say white, or orange or whatever.... if the selection matches X background, you always have a single case of unreadability. So what is the answer to that riddle? Even if you offset it by +222222 or -222222, it defeats the purpose of coloring the font/words. Even the box as mentioned shares the same fate, which now seems to make sense why most skinner have provided fixed values for skin colors to keep the control and prevent exactly what is happening here... so it leads back to...... what was the intent?

Totally agree about not falling down a rabbit hole, but leaving it in this state? hmmm.....what to do what to do.....

I think the intent was just to inform but as for what to do, that is your choice. Whatever you feel is the correct course of action is said course. As the adage says opinions are like a**holes and we all got one... Going with your "gut" is my suggestion. There are some script options like TMDb Helpers blur service that can help with offset colors using a 120° shift but then you are relying on yet another script. In the end, its whatever makes sense to you.

[kittmaster]

I think I have a solution to the riddle and it partially combines an answer you mentioned earlier with a twist. I noticed that the mouse / arrow cursor control /highlighter does a good job of showing the outline of the text regardless of the background.

So my thought was to use that to highlight every single "row" that is color changeable, the twist comes in that it won't be just that image, but to set its opacity value to like 10% so that is is enough to outline the text but not be "static" and visually annoying.

It would be similar to what you see highlighting "colors" on the left pane below. So when the user scrolls through the colors via clicker, or mouse, the active highlighter is still quite apparent to the selection it is making but with the 10% "on" opacity, it never gets to pure black.

That solves the entire color spectrum.

The question I have, I'm not entirely sure how to implement it, does Kodi support opacity scaling? Or do I need to find the image that the highlight marker ( I assume that is what it's called) and customize it as a new image with 10% opacity in the Alpha channel, which is easy... ?  If Kodi can do opacity scaling, then it's a matter of how do I add the texture to the row, I assume that is added to the control with the 2 VARs because it will affect them both, which I think is what is required.

What do you think? I'm going to search to see if I can find anything on Kodi and opacity scaling.

Here are the images that demonstrate the solution:

[mikeSiLVO]

Pretty sure you are talking about using a texturenofocus image previously mentioned.

xml:
<texturenofocus border="10" colordiffuse="grey">buttons/list-select-focus.png</texturenofocus>

You can use any color in the colordiffuse part, including opacity.

Here is a list of every 5% AA (alpha) part of the AARRGGBB code.

The grey colordiffuse is FF808080 so changing that to 1A808080 would be 10% of grey.

A screenshot of that wouldn't be noticeable so the below is 50% (80808080)

[kittmaster]

It's funny, I literally just arrived at the same answer late last night and was starting to mess around with this last night after I got it to "work". 

Once I realized how it worked I started using the "black.png", "white.png" and "list-select-focus" and used GIMP to do Alpha reduction to get some results and was experimenting with what I thought would "look" ok.

The code you posted I haven't tried yet, but I have seen throughout the code, but will try that this morning to see how I like that over what I had, but here are some of the results for the sake of where my toil took me:

Code:

xml:




                        <control type="radiobutton" id="302">                          

                            <label>$LOCALIZE[736]</label>

                            <label2>[COLOR $VAR[PanelStyleColorVar]]$VAR[PanelStyleColorLabelVar][/COLOR]      </label2>

                            <onclick>RunScript(script.skin.helper.colorpicker,skinstring=PanelStyle.color,header=$LOCALIZE[736])</onclick>

                            <onclick>SetProperty(Reset.Color,FFFFFFFF)</onclick>

                            <include content="CustomColorRadioButton">

                                <param name="ColorStringVar">$VAR[PanelStyleColorVar]</param>

                            </include>

                            <include>SettingsButton</include>

                            <texturenofocus>buttons\white-10.png</texturenofocus>

                        </control>

2% ALPHA



5% ALPHA



10% ALPHA



There is one other issue that has cropped up and I can't figure out why it is a problem, but I "think" it might be something directly with the radiobutton control itself and that is if you watch this video, you will see that the font heights when switching between the panes are "different" heights. I checked the SkinSettings.xml and the font in use is the same throughout minus the headers and I even tried to inject a "bigger" font on the left pane for the colors section but it was unaffected by the size. Take a look at this video and see if you can see something that I could look. I'll continue to hunt it down, I just know what is causing it and wondering if it was something that changed after we got it all "left" aligned..... but I doubt it, hence why I think it might be something with the control type itself????

http://www.kittmaster.com/imagedump/kodi...Sizes.html

I'll give the other control a go, but I think this is close to be a fixed and move along so I can push out a release with all the fixes and updates.

Thanks again Mike... :)

Chris

[kittmaster]

.........There is one other issue that has cropped up and I can't figure out why it is a problem, but I "think" it might be something directly with the radiobutton control itself and that is if you watch this video, you will see that the font heights when switching between the panes are "different" heights. I checked the SkinSettings.xml and the font in use is the same throughout minus the headers and I even tried to inject a "bigger" font on the left pane for the colors section but it was unaffected by the size. Take a look at this video and see if you can see something that I could look. I'll continue to hunt it down, I just know what is causing it and wondering if it was something that changed after we got it all "left" aligned..... but I doubt it, hence why I think it might be something with the control type itself?

http://www.kittmaster.com/imagedump/kodi...Sizes.html

I'll give the other control a go, but I think this is close to be a fixed and move along so I can push out a release with all the fixes and updates.

Thanks again Mike...

Chris

NM, I figured out what was causing it, there was a double call to <font>Font28_Reg</Font> in Include_Themes.xml for the box generation. I commented that out and the font size issue stopped immediately.

So now the code looks like:

xml:




    <!-- PARAM -->

    <include name="CustomColorRadioButton">

        <param name="ColorStringVar" />

        <definition>

            <width>1395</width>

            <height>67</height>

            <textoffsetx>35</textoffsetx>

            <!-- <font>Font28_Reg</font> -->

            <textureradioonfocus colordiffuse="$PARAM[ColorStringVar]">colors/white.png</textureradioonfocus>

            <textureradioonnofocus colordiffuse="$PARAM[ColorStringVar]">colors/white.png</textureradioonnofocus>

            <textureradioofffocus colordiffuse="$PARAM[ColorStringVar]">colors/white.png</textureradioofffocus>

            <textureradiooffnofocus colordiffuse="$PARAM[ColorStringVar]">colors/white.png</textureradiooffnofocus>

        </definition>

    </include>  

In which, I'll remove the commented out font call permentenly during the code cleanup. I'll post a video shortly.

[kittmaster]

So I've settled on the answer to the riddle and it splits the difference on logic control color offsetting vs. doing nothing at all. I am happy with the end results over all because even though you may not see black jump off the screen, you will be aware of its presence if selected and I've tried almost all the color tones to ensure there are no conflicts based on the image selected for overlay and the color diffusion with alpha strength. I think this marries all the elements with realistic trade offs to cover the gamut and brings in the new features that Mike help me implement that I really wanted......i.e. the color box to display the font selection values.

Hopefully you will like the improved color selection mechanism.

Again, special thanks to Mike for all his input and guidance, lots to learn but I think it is coming along nicely.

Here is a demonstration of it in operation:

http://www.kittmaster.com/imagedump/kodi...plete.html

[mikeSiLVO]

I've been messing about with the skin and updated the favourites window with a couple more things.

I also made a branch with an example for adding menu groupings, I only made the common item section. It is HERE if you want to start adding that instead of using the prepopulated selection provided by Skin Shortcuts.

[kittmaster]

I've been messing about with the skin and updated the favourites window with a couple more things.

I also made a branch with an example for adding menu groupings, I only made the common item section. It is HERE if you want to start adding that instead of using the prepopulated selection provided by Skin Shortcuts.

OMG, this is a riot.... I was on the same road. Here is what I came up with (still WIP):

xml:




<?xml version="1.0" encoding="utf-8"?>

<window>

    <defaultcontrol always="true">50</defaultcontrol>

    <!-- <views>50,51,53,54,55,56,57,58,500,501,502,503,504,505,506,507,508,509,510,511,512,520,521,522,523,531,541</views> -->

    <views>50,51,53,54,55,56,57,58,500,501,502,503,504,505,506,507,508,509,510,511,512,520,521,522,523,530,531,532,533,540,541,542,543</views>

    <menucontrol>9050</menucontrol>

    <controls>

        <!-- Background -->

        <include content="BackgroundDefault">

            <param name="imagepath">$VAR[AddonBackgroundVar]</param>

            <param name="animatedfanart">Skin.HasSetting(AddonAnimatedFanart)</param>

        </include>

        <!-- Views -->

        <!-- List -->

        <include>View50CoverList</include>

        <include>View51SimpleList</include>

        <include condition="!Skin.HasSetting(DisableViewInfo1)">View53InfoList1</include>

        <include condition="!Skin.HasSetting(DisableViewInfo2)">View54InfoList2</include>

        <include condition="!Skin.HasSetting(DisableViewLow)">View55LowList</include>

        <include condition="!Skin.HasSetting(DisableView3PanelSquare)">View573PanelSquare</include>

        <!-- Cover flow -->

        <include condition="!Skin.HasSetting(DisableViewSquare)">View501Square</include>

        <include condition="!Skin.HasSetting(DisableViewFocusSquare)">View505FocusSquare</include>

        <include condition="!Skin.HasSetting(DisableViewCascadeSquare)">View507CascadeSquare</include>

        <include condition="!Skin.HasSetting(DisableViewShowCaseSquare)">View509ShowcaseSquare</include>

        <include condition="!Skin.HasSetting(DisableViewKodiflixSquare)">View511KodiFlixSquare</include>

        <!-- Icon -->

        <include condition="!Skin.HasSetting(DisableViewSquareIcon)">View521SquareIcon</include>

        <!-- Icon info-->

        <include condition="!Skin.HasSetting(DisableViewSquareIconInfo)">View531SquareIconInfo</include>

        <!-- Wall -->

        <include condition="!Skin.HasSetting(DisableViewSquareWall)">View541SquareWall</include>

        <!-- Topbar -->

        <include content="TopBar">

            <param name="visible">!Skin.HasSetting(AddonsHideTopBar)</param>

            <param name="icon">star.png</param>

            <param name="label">$LOCALIZE[1036]</param>

        </include>

        <!-- Jump to Letter -->

        <include>JumptoLetter</include>

        <!-- Media Menu -->

        <include content="MediaMenu">

            <param name="contentvisible">true</param>

            <param name="commontopvisible">true</param>

            <!-- <param name="content">MediaMenuAddonBrowser</param> -->

            <param name="navigationid">50</param>

        </include>

    </controls>

</window>

But the views wouldn't show up in the left slide blade, I found that is all controlled in Custom_1116_ViewMode.xml and I started adding Container.Content(favourites) |:

xml:


                <control type="button" id="1512">

                    <visible>Container.Content(favourites) | (movies) | Container.Content(sets) | Container.Content(tvshows) | Container.Content(seasons) | Container.Content(episodes) | Container.Content(artists)</visible>

                    <visible>!Window.IsVisible(MyPlaylist.xml) + !Skin.HasSetting(DisableViewKodiflixLandscape)</visible>

                    <label>$LOCALIZE[31265]</label>

                    <onclick>Container.SetViewMode(512)</onclick>

                    <include>MediaMenuButtonViewType</include>

                </control>

To each of the lines and they start to show up in the left slide blade, but what surprised me is that, when they were enabled, and they show up in the blade, they all don't properly render, like Info1, Info2, Wall portrait????

I'm not sure what the missing link is yet, but I made it that far.

It would be nice to have a bunch of options, because the 2 "square" ones, in my opinion, suck for video because it is cutting off the poster tops/bottoms because the aspect is not kept.

Glad to see I'm on the right track.... ;)

[kittmaster]

Modded favorites background to match the defaults:

Created variable in Includes_Background.xml

xml:




    <variable name="FavoritesBackgroundVar">

        <value condition="Skin.HasSetting(AddonDisableFanart) + !String.IsEmpty(Skin.String(favourites))">$INFO[Skin.String(favourites)]</value>

        <value condition="Skin.HasSetting(AddonDisableFanart)">special://skin/extras/backgrounds/favourites.jpg</value>

        <value condition="!String.IsEmpty(ListItem.Art(fanart))">$INFO[ListItem.Art(fanart)]</value>

        <value condition="!String.IsEmpty(Skin.String(favourites))">$INFO[Skin.String(favourites)]</value>

        <value>special://skin/extras/backgrounds/favourites.jpg</value>

    </variable>

Adding to your code for ease:

xml:




<?xml version="1.0" encoding="utf-8"?>

<window>

    <defaultcontrol always="true">50</defaultcontrol>

    <views>50,51,521,541</views>

    <menucontrol>9050</menucontrol>

    <controls>

        <!-- Background -->

        <include content="BackgroundDefault">

            <param name="imagepath">$VAR[FavoritesBackgroundVar]</param>

            <param name="animatedfanart">Skin.HasSetting(AddonAnimatedFanart)</param>

        </include>      

        <control type="group">

            <include>AnimationVisibleFade</include>

            <!-- List -->

            <include>View50CoverList</include>

            <include>View51SimpleList</include>

            <!-- Icon -->

            <include condition="!Skin.HasSetting(DisableViewSquareIcon)">View521SquareIcon</include>

            <!-- Wall -->

            <include condition="!Skin.HasSetting(DisableViewSquareWall)">View541SquareWall</include>

            <!-- Topbar -->

            <include content="TopBar">

                <param name="icon">star.png</param>

                <param name="label">$LOCALIZE[1036]</param>

            </include>

        </control>

        <!-- Media Menu -->

        <include content="MediaMenu">

            <param name="contentvisible">true</param>

            <param name="commontopvisible">true</param>

            <param name="navigationid">50</param>

        </include>

    </controls>

</window>

Results: