Skinning requests/reports for 3.1

[Steven]

the wavebar is displaying on top of ratings and (probably) the love button

[Alumni]

the wavebar is displaying on top of ratings and (probably) the love button

Oh, I thought those elements were also hidden. By the way, was there ever a possibility to display the track text above the wavebar?

Edit: A minor quibble, the wavebar is not 100% vertically aligned, my measurements show it is a few pixels closer to the bottom of the panel.

[psychoadept]

Still related to tag editor: could TagEditorPanel.Header please have a gradient?

[Alumni]

Nice surprise to see the album art thumbnail is now available, although there seems to be an issue with enabling this layout. It's as if the whole player controls panel is being centered (with padding on both sides) instead of being right aligned. At least that's what I see with my testing skin; https://app.box.com/s/2nmmxmmf85esnxgei3tgd92um0edl72f

PS: I think it would be clearer if "custom background" was renamed to "progress bar" in the panel layout context menu.

[Steven]

Nice surprise to see the album art thumbnail is now available, although there seems to be an issue with enabling this layout.

thats fixed now with the usual 3.1 link

[Alumni]

thats fixed now with the usual 3.1 link

Thanks - I can confirm its fixed.

A small bug; the checkbox to toggle album cover in preferences -> layout (1) doesn't seem to do anything.

Edit: I'm really happy with these new additions. If it's not too much trouble, it'd be great to have a fill element for the volume slider (to match the progress bar).

[Steven]

The border attribute of
<element id="HeaderBar" bg="248,250,245" fg="120,109,69" bdr="244,242,230" />
draws the line at the bottom of the header but,
the border attribute of
<element id="Panel.ChildHeader.Default" bg="42,48,47" fg="155,160,161" bdr="9,184,119" />
puts the line at the top of the header.

Could we please have a bdr2 attribute for element id="Panel.ChildHeader.Default"
to draw a line at the bottom so it matches the Header Bar

for this one, the setting only applies to sub-panels, excluding the top most sub-panel which has its header in the main header bar. So this new setting would also only apply to those sub-panels. I am pretty sure thats what you wanted but can you confirm?
It would new to be done as a new element

Code

Panel.ChildHeader.Default.Border2 fg=xxxx

which skin is this one for - it makes things much easier for me if i can just use a skin where the issue manifests itself

when using the "MainPanelMargin" elements and the player is in the top panel, a line is needed to close the top of the header bar


I suggest
<element id="PlayerTopFlat.BaseLine" bg="xxx,xxx,xxx" />
and probably
<element id="PlayerTopFlatBLMargin">1</element>
to allow it to be matched with different panel margin widths

[Steven]

*Most of the borders in the tag editor are controlled by "InputPanel.Default", but there are a few spots that use "Controls.FaintLine".  Those only exist on some tabs, and the contrast color I use for Preferences looks weird in the Tag Editor.  Oh, and the border between the background and "Toolbar.Body" is controlled by something else, I can't even figure out what right now (neither fg or bdr on Toolbar.Body has an effect).

*The fact that ALL the tab borders are controlled by "InputPanel.Default" means that you can't have, for instance, a different border on the inactive tabs.

*Likewise, both the background color and the active tab color are controlled by "InputPanel.Default", so you can't have a contrast between the background and the tab.


Does EditPanel.Default even do anything anymore?  I have it marked as "Tag Editor Window" on the wiki but I don't see any effect when I edit it.

i dont recall what EditPanel.Default did, but its definitely not used any more since 3.0

re: Controls.FaintLine, i could add a new one for the tag editor. But the FaintLine colour is used in a number of dialogs against the InputPanel.Default background. Is there a particular reason for it to be different for the tag editor?

the border between the background and "Toolbar.Body" is controlled by the "MenuBarSeparator" colours. Could you confirm you need something specific for the tag editor

*The fact that ALL the tab borders are controlled by "InputPanel.Default" means that you can't have, for instance, a different border on the inactive tabs.
i will change the behavior so the border colour from a new element "Controls.TabHeader.Inactive"

*Likewise, both the background color and the active tab color are controlled by "InputPanel.Default", so you can't have a contrast between the background and the tab.
the tab headers should be overridable using:
Controls.TabHeader.Default
Controls.TabHeader.Highlight  (for the active tab)
its just the borders that are being forced to the input panel border

*alternate Tabs Bar background when the library header bar is hidden

i am not sure exactly what you mean by "library header bar is hidden". Do you mean when the user sets all the main header bar panel headers as hidden and MB reduces the main header bar height to 10px. In that case you want the tabs bar background (assuming its not in the caption bar) to change colour?

Still related to tag editor: could TagEditorPanel.Header please have a gradient?

i dont think that would easily be possible as i am using .NET control for some of the functionality

[Alumni]

I may have come across a glitch regarding the mouseover/highlight effect and the player control buttons (equaliser, shuffle, etc). With the skin I'm currently working on, whenever I highlight a button and then activate it, the image disappears until I move the mouse cursor away. It's also possible I made a mistake - here's an example of the skin.xml code;

Code

<element id="ShuffleButton" parent="Panel">
  <left relativeTo="Panel.Right" offset="-140" />
  <top relativeTo="Panel.VerticalCenter" offset="0" />
  <images category="Off"
    default="Images\ShuffleOff.png"
	highlight="Images\ShuffleHighlight.png"	
  />
  <images category="On"
    default="Images\ShuffleOn.png"
  />
  <images category="AutoDJ"
    default="Images\AutoDj.png"
  />
</element>

[Bee-liever]

I am pretty sure thats what you wanted but can you confirm?

Yep. Just on those sub-panels would be great.

which skin is this one for - it makes things much easier for me if i can just use a skin where the issue manifests itself

that's "Iconic" skin

[Steven]

http://musicbee.niblseed.com/V3_1/MusicBee31_Patched.zip

I may have come across a glitch regarding the mouseover/highlight effect and the player control buttons (equaliser, shuffle, etc). With the skin I'm currently working on, whenever I highlight a button and then activate it, the image disappears until I move the mouse cursor away. It's also possible I made a mistake - here's an example of the skin.xml code;

thats fixed

could <element id="PlayerSplitProgressYOffset">Below</element>
be added to place the values below the progress bar, when it's used as the top-most element in the player bar

thats done

an override for deleted items in the tag inspector please

an auto-generated colour is now set rather than being fixed to gray

could element id="NowPlayingList[TrackDetail].ItemSeparatorLine"
be added to the NowPlayingList[TrackDetail] overrides please.

thats done

A "fg2" attribute for
<element id="Content[Artwork].ArtworkText" bg="X,X,X" fg="X,X,X" />
to override the auto-generated "show album count" colouring (when selected)

thats done

when using the "MainPanelMargin" elements and the player is in the top panel, a line is needed to close the top of the header bar

I suggest
<element id="PlayerTopFlat.BaseLine" bg="xxx,xxx,xxx" />
and probably
<element id="PlayerTopFlatBLMargin">1</element>
to allow it to be matched with different panel margin widths

PlayerTopFlat.BaseLine is done

Could we please have a bdr2 attribute for element id="Panel.ChildHeader.Default"
to draw a line at the bottom so it matches the Header Bar

Panel.ChildHeader.Default.Border2 fg=xxxx is done

*could we have the window button highlight cover the whole height of the caption bar, like native Windows 10?

not quite this, but you can now supply 30x28px images for the close, minimimise, maximise, restore buttons
you still need to supply 28x15px images for backwards compatibility. Also make sure these new ones are after the existing 28x15px images
use FormMinimiseButton2, FormMaximiseButton2, FormRestoreButton2, FormCloseButton2, FormMinimiseHighlightButton2, FormMaximiseHighlightButton2, FormRestoreHighlightButton2, FormCloseHighlightButton2

[Alumni]

you can now supply 30x28px images for the close, minimimise, maximise, restore buttons

Thanks for adding this, looks nicer in Windows 10 (and thanks psychoadept for suggesting it).

[Steven]

When you revisit skinning could you please implement a fade effect for

"NowPlaying[AlbumAndTracks].AlbumSeparatorLine"

"Content[AlbumAndTracks].ItemSeparatorLine"

"Content[TrackDetail].ItemSeparatorLine"

thats done for the next update. Use fg and fg2
except for
NowPlaying[AlbumAndTracks].AlbumSeparatorLine which is not consistent and uses bg and bg2

[psychoadept]

*could we have the window button highlight cover the whole height of the caption bar, like native Windows 10?

not quite this, but you can now supply 30x28px images for the close, minimimise, maximise, restore buttons
you still need to supply 28x15px images for backwards compatibility. Also make sure these new ones are after the existing 28x15px images
use FormMinimiseButton2, FormMaximiseButton2, FormRestoreButton2, FormCloseButton2, FormMinimiseHighlightButton2, FormMaximiseHighlightButton2, FormRestoreHighlightButton2, FormCloseHighlightButton2

Awesome, thanks!

[Steven]

New elements for 'visualizer volume' peak and VU please. I'd like to change the background and then apply a gradient to the volume bars, so the same options as are currently available for the spectrum visualizer.

i have added "VolumeVisualiser" bg=XXXX fg=XXXX fg2=XXXXX


http://musicbee.niblseed.com/V3_1/MusicBee31_Patched.zip