Author Topic: Sample Skin  (Read 57437 times)

chrctrlmt

  • Jr. Member
  • **
  • Posts: 57
I tried copying the string mentioned:

 <element id="FormBorderTopLeft">
        iVBORw0KGgoAAAANSUhEUgAAAAUAAAAcAQMAAACTeOf1AAAAA1BMVEU+ZYvrbzAKAAAAC0lEQVR4
        XmMgEwAAADgAARjE5tUAAAAASUVORK5CYII=
  </element>

as well as experimenting with things like:

<element id="FormBorderTopLeft" fg="155,155,155" />

etc, but it seems to make the entire skin fail to load and reverts back to the default.  For darkLIME, I'm trying to color the background of the button the same shade of lime the rest of the skin uses.  Any idea what that line might look like?

Thanks for your help.

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
Are you editing the original skin xml?

Or are you trying to do this using a piggyback skin?
That will not work for this.

Could you please post skinning questions that do not directly pertain to the Sample Skin, in the general 'Skins' board?
https://getmusicbee.com/forum/index.php?board=21.0

Or see if there is a forum topic by the original skin creator and post any questions there.

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World
Hiccup,
I've decided to take my shot at skin creation and your sample skin has been really really helpful so far (so thanks a lot for that!).
There's something I need help with though...

I can't seem to find the element that corresponds with the icon colour in the tabs bar.
Favourite song at the moment:   Decode by Paramore

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
I can't seem to find the element that corresponds with the icon colour in the tabs bar.
It is "IconColourOverride.Default"
The reason why it wasn't matched is because you picked it's colour on an inactive tab instead of on an active tab.
And for inactive tabs, the icon colour is (can be) adjusted using the 'InactiveTabIconMask' element.
(to e.g. have the icon higher contrast for active tabs, and lower contrast for inactive tabs)

Thanks for bringing this to attention. I have updated the Sample Skin so this will work on inactive tabs now too.

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World
Thanks. One more thing, can you please confirm if the colour below is available in the xml file...I can't find it.
Favourite song at the moment:   Decode by Paramore

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
Thanks. One more thing, can you please confirm if the colour below is available in the xml file...I can't find it.

That's an odd duck indeed.

For as far as I can tell, it is auto-calculated somehow using values from "Content[TrackDetail].Body.Default" and "Content[TrackDetail].Body.Disabled"
Which seems a bit weird and unexpected for a panel containing artwork, and the result in the Sample Skin surely looks a bit off.

Only Steven will be able to tell how it works exactly, and if this intentional.
As long as it doesn't cause issues for normal skins it's probably not a problem.

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World
For as far as I can tell, it is auto-calculated somehow using values from "Content[TrackDetail].Body.Default" and "Content[TrackDetail].Body.Disabled"...
That turned out to be true (thanks).
Taking what you said into account, does this also mean that the text below (demarcated in green) also gets its respective colours from certain groups of elements?
Are their RGB values also auto-calculated? (Since I cannot locate their specific elements in the xml file)
Favourite song at the moment:   Decode by Paramore

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
…does this also mean that the text below (demarcated in green) also gets its respective colours from certain groups of elements?…
I'm currently not in a focussed state of mind/mood to go into much details, but…

If you colour pick a colour in the Sample Skin, and it's not defined in the xml, the only explanation is that that colour is auto-calculated by MusicBee.
If you think about what a skin xml does, this will be obvious.
( edit, not entirely true, see here: https://getmusicbee.com/forum/index.php?topic=22300.msg195851#msg195851 )

If you go years back, a lot of elements were auto-coloured using some smart algorithm.
They usually worked fine in general, but skinners were not always satisfied in how they turned out for their skins, and then asked for new and dedicated skinning elements that made it possible to define them specifically.
Pretty much all sensible requests have been fulfilled on that.
(if you check very old skin xml's you will see they have far fewer lines of 'elements' than current ones)

So if you run into an element that you can not define yourself, and are not happy about how the auto-colouring algorithm makes it look:
Create a wish for a dedicated element to define it.
Last Edit: November 19, 2021, 07:24:28 PM by hiccup

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
Taking what you said into account, does this also mean that the text below (demarcated in green) also gets its respective colours from certain groups of elements?
Are their RGB values also auto-calculated? (Since I cannot locate their specific elements in the xml file)
Not speaking about this specific screenshot, but keep in mind that at several locations in MusicBee you (and any user) can adjust the contrast for specific fields using panel configuration settings.
So if you have set the contrast of a specific text field to e.g. 40%, where my Sample Skin was using 100%, colour picking that text field will also fail.

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World
Oh I see. That makes so much sense. I've been trying to recreate your Tron Punk skin (using the sample skin as a template).
I figured that would be the easiest way for me to learn about skins...and so far this approach has worked well.

That clears up most of my confusion. I'll direct more questions/requests to their relevant threads.
The sample skin is a perfect tool for one to get started. Thanks Hiccup.

Got a long way to go...but this has helped with my general understanding of the basics.
Last Edit: November 19, 2021, 07:47:14 PM by Mayibongwe
Favourite song at the moment:   Decode by Paramore

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World
hiccup...got a couple of things to report.

- The background (bg) attribute for PlayerTopFlat.DisplayPanel is missing.
- Colours from the Now Playing pop up do not match with those of NowPlayingPopup.Body and NowPlayingPopup.Border.
Favourite song at the moment:   Decode by Paramore

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
- The background (bg) attribute for PlayerTopFlat.DisplayPanel is missing.
Thnx, now added.

Quote
- Colours from the Now Playing pop up do not match with those of NowPlayingPopup.Body and NowPlayingPopup.Border.
That's because the pop-up panel always gets some transparency applied.
Even if you have set the slider completely to 'opaque'
I added a little comment in the skin xml to explain that.

Thanks for reporting!

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
- Colours from the Now Playing pop up do not match with those of NowPlayingPopup.Body and NowPlayingPopup.Border.
Since the transparency that is applied to the pop-up panel is very minor, it was doable to add all resulting rgb variations in comment fields.

I believe that every item that is colour-picked in the pop-up panel should now get results, irrelevant of the background that is behind that panel.
Let me know if you find something still not working there?

Mayibongwe

  • Sr. Member
  • ****
  • Posts: 986
  • Heal The World

Seems to be off by a single digit.
I'm not getting a single match for the other element.
Favourite song at the moment:   Decode by Paramore

hiccup

  • Sr. Member
  • ****
  • Posts: 7760
added 0,234,133

I'm not getting a single match for the other element.
What other element do you mean?

edit,
You mean the pink line beneath it?
Hm, I'll re-check that one too.
(b.t.w. your screenshot has weird rgb values, I am guessing it's a jpg, not a png?)
Last Edit: March 05, 2022, 03:24:02 PM by hiccup