Author Topic: XBox Music Style  (Read 71122 times)

redwing

  • Guest
This is really beautiful!  ;D
However, I'm not able to get the lyrics to show. I checked if lyrics were available and it shows the booklet, but like KingB they don't show.

Solution:
If you change the XML file: (open with notepad), or rightmouseclick -> edit.

Then find:
 <!-- Lyrics --> subsection
right under it, you'll see that it says:
<autoHide name="#RightSidebarLyrics"

change it to:
<element name="#RightSidebarLyrics"

Restart Musicbee and it should work.

Hope it helped :)

Fantastic theaterview endeavour1934!

No, that's not a proper fix. The reason lyrics status icon is unclickable for these theater views is that the element lacks a width attribute.

To make the lyrics status icon clickable for each view,

find

onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

replace it with

width="20" onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

save and rerun.

kingB

  • Guest
This is really beautiful!  ;D
However, I'm not able to get the lyrics to show. I checked if lyrics were available and it shows the booklet, but like KingB they don't show.

Solution:
If you change the XML file: (open with notepad), or rightmouseclick -> edit.

Then find:
 <!-- Lyrics --> subsection
right under it, you'll see that it says:
<autoHide name="#RightSidebarLyrics"

change it to:
<element name="#RightSidebarLyrics"

Restart Musicbee and it should work.

Hope it helped :)

Fantastic theaterview endeavour1934!

No, that's not a proper fix. The reason lyrics status icon is unclickable for these theater views is that the element lacks a width attribute.

To make the lyrics status icon clickable for each view,

find

onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

replace it with

width="20" onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

save and rerun.
whats the exact name of the file?

redwing

  • Guest
whats the exact name of the file?

As I said, you will need to edit all files in the zip.

craigccfl

  • Guest
Nice, clean and functional. Thanks for uploading.

CraigW

endeavour1934

  • Full Member
  • ***
  • Posts: 207
Test 2.0
https://dl.dropboxusercontent.com/u/10773406/xb2.zip
Use the top right dots to change BG.

Does anyone know if it's possible to keep the selected BG while opening the lyrics/artist panel?

redwing

  • Guest
Test 2.0
https://dl.dropboxusercontent.com/u/10773406/xb2.zip
Use the top right dots to change BG.

Wonderful work! Thanks for sharing this!

Does anyone know if it's possible to keep the selected BG while opening the lyrics/artist panel?

Too bad it's not supported currently. Here is my proposal, which would need Steven's help to work out.

The reason your approach does not work is that auto-hide panels conflict with each other. Say, when Overlay2 auto-hide panel is open, lyrics auto-hide panel has to be closed. How could this be avoided? Because XML documents support tree structure, we could divide parts of codes into different segments using a sub-parent element. Let's name the new element "segment." Then you could define each BG as a segment that has two auto-hide panels (lyrics and artist info) inside it. This way the conflict between BG and auto-hide panels would be gone. To navigate between different segments, we would need a new onClick function support, namely "OpenSegment." If this is implemented, multiple theater views could be inserted into a big view, rendering each view as a segment.

Here is a test code I wrote with your Overlay 1 and Overlay 2.  

Code
<?xml version="1.0" encoding="utf-8"?>
<root>
<settings enableScaling="true" />
<settings backgroundImage="" />
<settings rotationPeriod="300" />
<screenSaver>
  <settings idlePeriod="0" />
  <settings monitor="1" otherMonitors="blackout" />
</screenSaver>

<!-- BG1 Segment-->
<segment name="BG1">

<!-- Artist Picture -->
<element type="ArtistPicture" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" aspectRatio="zoomKeep" fillColor="255,0,0,0" fade="0.0"></element>
<element name="DarkerBG" type="Block" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" bg="160,8,0,30"></element>

<!-- Overlay 1 -->
<element name="#Overlay1" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" allowPinning="true" resizePictures="false" disableHotPoint="true" >
<element name="Darker" type="Block" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" bg="160,8,0,30"></element>
<element type="Icon" image="Images\overlay0.png" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" ></element>
<element type="Icon" image="Images\overlay01.png" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" ></element>

<!-- Menu -->
<element type="Text" xAnchor="Panel.Right" x="-20" y="5" width="10" font="Segoe UI Light" style="Regular" size="10" fg="235,235,235" mouseOverFg="255,255,255" onClick="OpenSegment:BG1">&#8226;</element>
<element type="Text" xAnchor="Panel.Right" x="-20" y="15" width="10" font="Segoe UI Light" style="Regular" size="10" fg="235,235,235" mouseOverFg="255,255,255" onClick="OpenSegment:BG2">&#8226;</element>

<!-- Lyrics -->
<autoHide name="#RightSidebarLyrics" xAnchor="Panel.Right" x="-391" y="60" width="300" heightDock="Panel" height="-368" bg="0,8,0,30" fg="215,215,215" fg2="255,255,255" allowPinning="true" resizePictures="false" >
<element type="Field" id="Title" xAnchor="Panel.Right" x="-376" y="95" width="285" font="Segoe UI" style="Bold" size="12" fg="255,255,255" ></element>
<element type="Lyrics" xAnchor="Panel.Right" x="-374" y="125" width="285" heightDock="Y:#RightSidebarLyrics.Bottom" height="-40" font="Segoe UI" style="Regular" size="9" fg="255,255,255" fg2="255,140,0" ></element>
</autoHide>

<!-- Artist Info -->
<autoHide name="#RightSidebarArtist" xAnchor="Panel.Right" x="-391" y="60" width="300" heightDock="Panel" height="-368" bg="0,8,0,30" fg="215,215,215" fg2="255,255,255" allowPinning="true" resizePictures="false" >
<element type="Field" id="Artist" xAnchor="Panel.Right" x="-376" y="95" width="285" font="Segoe UI" style="Bold" size="12" fg="255,255,255" ></element>
<element type="ArtistInfo" xAnchor="Panel.Right" x="-374" y="125" width="285" heightDock="Y:#RightSidebarArtist.Bottom" height="-40" font="Segoe UI" style="Regular" size="9" fg="255,255,255" fg2="255,140,0" ></element>
</autoHide>

<!-- Next Track Info -->
<element name="#NextInfo" type="Text" xAnchor="Panel.Right" x="-233" yAnchor="Panel.Bottom" y="-101" width="90" font="Segoe UI Light" style="Regular" size="16" fg="180,180,180" onClick="OpenNowPlayingAssistant" >&gt;</element>
<element type="Field" id="Tracks[1]" xAnchor="Panel.Right" x="-213" yAnchor="Panel.Bottom" y="-90" width="125" font="Segoe UI" style="Regular" size="8" fg="250,250,250" >
    <child id="Title" ></child>
</element>
<element type="Field" id="Tracks[1]" xAnchor="Panel.Right" x="-213" yAnchor="Panel.Bottom" y="-70" width="125" font="Segoe UI" style="Bold" size="8" fg="250,250,250" >
    <child id="Artist" ></child>
</element>

<!-- Progress Bar -->
<element name="BarBg" type="Block" xAnchor="Panel.Left" yAnchor="Panel.Bottom" x="92" y="-195" widthDock="X:Panel.Right" width="-92" height="2" bg="20,255,255,255"></element>
<element type="ProgressBar" xAnchor="Panel.Left" yAnchor="Panel.Bottom" x="92" y="-195" widthDock="X:Panel.Right" width="-92" height="2" fg="245,245,245" ></element>

<!-- Player Controls -->
<element type="PlayerBar" autohide="false" xAnchor="Panel.Center" x="-150" yAnchor="Panel.Bottom" y="-92" width="300" height="52" bdr="0,0,0,0" bg="0,0,0,0" fg="245,245,245" fg2="180,180,180" ></element>
<element name="#LyricsStatus" type="Text" xAnchor="Panel.Center" x="-18" yAnchor="Panel.Bottom" y="-72" font="Wingdings" style="Regular" size="12" fg="8,0,30" fg2="245,245,245" width="20" onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

<!-- Track Info -->
<element type="AlbumCover" x="90" yAnchor="Panel.Bottom" y="-404" width="180" height="180" min="180" max="180" brightness="1.0" ></element>
<element type="ProgressPosition" xAnchor="Panel.Right" x="-340" yAnchor="Panel.Bottom" y="-257" widthDock="X:Panel.Right" width="-82" align="right" font="Segoe UI Light" style="Regular" size="22" fg="245,245,245" ></element>
<element name="BigTitle" type="Field" id="Title" x="82" yAnchor="Panel.Bottom" y="-182" widthDock="X:#NextInfo.Left" width="0" reserveWidth="120" font="Segoe UI Light" style="Regular" size="30" fg="245,245,245"></element>
<element type="Field" id="RatingLove" xAnchor="Panel.Right" x="-226" yAnchor="Panel.Bottom" y="-163" width="140" fg="115,115,115" fg2="240,240,240" size="20" rightMargin="8" >
<child id="Rating" fg="245,245,245" fg2="25,255,255,255" size="20" />
</element>
<element type="Field" id="Artist" x="86" yAnchor="Panel.Bottom" y="-104" widthDock="X:#NextInfo.Left" width="-10" font="Segoe UI" style="Bold" size="16" fg="245,245,245" onClick="OpenAutoHidePanel(#RightSidebarArtist)" ></element>
<element type="Field" id="Album" x="87" yAnchor="Panel.Bottom" y="-74" widthDock="X:#NextInfo.Left" width="-10" font="Segoe UI Light" style="Regular" size="14" fg="245,245,245" ></element>

</segment>

<!-- BG2 Segment-->
<segment name="BG2">

<!-- Artist Picture -->
<element type="ArtistPicture" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" aspectRatio="zoomKeep" fillColor="255,0,0,0" fade="0.0"></element>
<element name="DarkerBG" type="Block" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" bg="160,8,0,30"></element>

<!-- Overlay 2 -->
<element name="#Overlay2" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" allowPinning="true" resizePictures="false" disableHotPoint="true" >
<element name="Darker" type="Block" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" bg="220,8,0,30"></element>
<element type="Icon" image="Images\overlay1.png" x="1" y="1" widthDock="Panel" width="-2" heightDock="Panel" height="-2" ></element>

<!-- Menu -->
<element type="Text" xAnchor="Panel.Right" x="-20" y="5" width="10" font="Segoe UI Light" style="Regular" size="10" fg="235,235,235" mouseOverFg="255,255,255" onClick="OpenSegment:BG1">&#8226;</element>
<element type="Text" xAnchor="Panel.Right" x="-20" y="15" width="10" font="Segoe UI Light" style="Regular" size="10" fg="235,235,235" mouseOverFg="255,255,255" onClick="OpenSegment:BG2">&#8226;</element>

<!-- Lyrics -->
<autoHide name="#RightSidebarLyrics" xAnchor="Panel.Right" x="-391" y="60" width="300" heightDock="Panel" height="-368" bg="0,8,0,30" fg="215,215,215" fg2="255,255,255" allowPinning="true" resizePictures="false" >
<element type="Field" id="Title" xAnchor="Panel.Right" x="-376" y="95" width="285" font="Segoe UI" style="Bold" size="12" fg="255,255,255" ></element>
<element type="Lyrics" xAnchor="Panel.Right" x="-374" y="125" width="285" heightDock="Y:#RightSidebarLyrics.Bottom" height="-40" font="Segoe UI" style="Regular" size="9" fg="255,255,255" fg2="255,140,0" ></element>
</autoHide>

<!-- Artist Info -->
<autoHide name="#RightSidebarArtist" xAnchor="Panel.Right" x="-391" y="60" width="300" heightDock="Panel" height="-368" bg="0,8,0,30" fg="215,215,215" fg2="255,255,255" allowPinning="true" resizePictures="false" >
<element type="Field" id="Artist" xAnchor="Panel.Right" x="-376" y="95" width="285" font="Segoe UI" style="Bold" size="12" fg="255,255,255" ></element>
<element type="ArtistInfo" xAnchor="Panel.Right" x="-374" y="125" width="285" heightDock="Y:#RightSidebarArtist.Bottom" height="-40" font="Segoe UI" style="Regular" size="9" fg="255,255,255" fg2="255,140,0" ></element>
</autoHide>

<!-- Next Track Info -->
<element name="#NextInfo" type="Text" xAnchor="Panel.Right" x="-233" yAnchor="Panel.Bottom" y="-101" width="90" font="Segoe UI Light" style="Regular" size="16" fg="180,180,180" onClick="OpenNowPlayingAssistant" >&gt;</element>
<element type="Field" id="Tracks[1]" xAnchor="Panel.Right" x="-213" yAnchor="Panel.Bottom" y="-90" width="125" font="Segoe UI" style="Regular" size="8" fg="250,250,250" >
    <child id="Title" ></child>
</element>
<element type="Field" id="Tracks[1]" xAnchor="Panel.Right" x="-213" yAnchor="Panel.Bottom" y="-70" width="125" font="Segoe UI" style="Bold" size="8" fg="250,250,250" >
    <child id="Artist" ></child>
</element>

<!-- Progress Bar -->
<element name="BarBg" type="Block" xAnchor="Panel.Left" yAnchor="Panel.Bottom" x="92" y="-195" widthDock="X:Panel.Right" width="-92" height="2" bg="20,255,255,255"></element>
<element type="ProgressBar" xAnchor="Panel.Left" yAnchor="Panel.Bottom" x="92" y="-195" widthDock="X:Panel.Right" width="-92" height="2" fg="245,245,245" ></element>

<!-- Player Controls -->
<element type="PlayerBar" autohide="false" xAnchor="Panel.Center" x="-150" yAnchor="Panel.Bottom" y="-92" width="300" height="52" bdr="0,0,0,0" bg="0,0,0,0" fg="245,245,245" fg2="180,180,180" ></element>
<element name="#LyricsStatus" type="Text" xAnchor="Panel.Center" x="-18" yAnchor="Panel.Bottom" y="-72" font="Wingdings" style="Regular" size="12" fg="8,0,30" fg2="245,245,245" width="20" onClick="OpenAutoHidePanel(#RightSidebarLyrics)">&amp;</element>

<!-- Track Info -->
<element type="AlbumCover" x="90" yAnchor="Panel.Bottom" y="-404" width="180" height="180" min="180" max="180" brightness="1.0" ></element>
<element type="ProgressPosition" xAnchor="Panel.Right" x="-340" yAnchor="Panel.Bottom" y="-257" widthDock="X:Panel.Right" width="-82" align="right" font="Segoe UI Light" style="Regular" size="22" fg="245,245,245" ></element>
<element name="BigTitle" type="Field" id="Title" x="82" yAnchor="Panel.Bottom" y="-182" widthDock="X:#NextInfo.Left" width="0" reserveWidth="120" font="Segoe UI Light" style="Regular" size="30" fg="245,245,245"></element>
<element type="Field" id="RatingLove" xAnchor="Panel.Right" x="-226" yAnchor="Panel.Bottom" y="-163" width="140" fg="115,115,115" fg2="240,240,240" size="20" rightMargin="8" >
<child id="Rating" fg="245,245,245" fg2="25,255,255,255" size="20" />
</element>
<element type="Field" id="Artist" x="86" yAnchor="Panel.Bottom" y="-104" widthDock="X:#NextInfo.Left" width="-10" font="Segoe UI" style="Bold" size="16" fg="245,245,245" onClick="OpenAutoHidePanel(#RightSidebarArtist)" ></element>
<element type="Field" id="Album" x="87" yAnchor="Panel.Bottom" y="-74" widthDock="X:#NextInfo.Left" width="-10" font="Segoe UI Light" style="Regular" size="14" fg="245,245,245" ></element>

</segment>

</root>


Samanthaaaa

  • Jr. Member
  • **
  • Posts: 25
Hello,

 Since updating to Version 2.1.4924, I've noticed that the ratings have disappeared from all the styles. I tried playing around with some of the XML myself (although I am certainly not very well versed in the code), so I was wondering if anyone else might know how I could get the ratings and the Last.FM 'Love' icon back.

Thank you.

redwing

  • Guest
Hello,

 Since updating to Version 2.1.4924, I've noticed that the ratings have disappeared from all the styles. I tried playing around with some of the XML myself (although I am certainly not very well versed in the code), so I was wondering if anyone else might know how I could get the ratings and the Last.FM 'Love' icon back.

Thank you.

Probably it's these skins' own coding error.

For each xml file, find "PlayerBar.Left" and replace it with "Panel.Right".

Save and rerun it.
Last Edit: August 19, 2013, 08:55:58 AM by redwing

redwing

  • Guest
For XBox Music Style 2 skin,

Find the following two lines:

Code
fg="115,115,115" fg2="240,240,240" size="20" rightMargin="8" >
  <child id="Rating" fg="245,245,245" fg2="25,255,255,255" size="20" />

and replace them with the following:

Code
visible="MusicBeeSetting" fg="115,115,115" fg2="240,240,240" size="20" rightMargin="8" >
  <child id="Rating" visible="MusicBeeSetting" fg="245,245,245" fg2="25,255,255,255" size="20" ></child>

Save and rerun it.

Samanthaaaa

  • Jr. Member
  • **
  • Posts: 25
Hello,

 Since updating to Version 2.1.4924, I've noticed that the ratings have disappeared from all the styles. I tried playing around with some of the XML myself (although I am certainly not very well versed in the code), so I was wondering if anyone else might know how I could get the ratings and the Last.FM 'Love' icon back.

Thank you.

Probably it's these skins' own coding error.

Thanks, this worked perfectly. :)
For each xml file, find "PlayerBar.Left" and replace it with "Panel.Right".

Save and rerun it.

endeavour1934

  • Full Member
  • ***
  • Posts: 207
Thanks Redwing... I couldn't figure up what was wrong! :D

All links fixed.

redwing

  • Guest
Thanks Redwing

You're welcome. Your work is a gem. Hope to see more works from you.

delpinsky

  • Newbie
  • *
  • Posts: 10
Hi endeavour1934  ;)

First of all my compliments for this great work!
Your Xbox Music Style skin and this great software are the definitive solution I needed for my CD collection.

I got a question as first-timer of this software:

I'd love to add a layer with a CD case over the Album Art picture.
I posted the same question on the developers forum, since I found an old request via the search function, which was buried there with no reply.

Can you tell me if it's possible to add a tag element as layer, a CD case picture in PNG for example, with transparent inside to show the Album Art?

Thanks in advance!

motorpsyched

  • Guest
I'm trying to remove the "up next" info in the right bottom corner, but end up removing artist and album info from the left side as well.
Any pointers to what to remove?

delpinsky

  • Newbie
  • *
  • Posts: 10
I reply to myself, since I solved my problem :)

Look:


I managed to add a new image element over the album cover picture.
I created a .png image of a CD Case with a transparent square inside, which will be perfectly fitting for the album art picture.

I've added this line to your theme at the bottom of the xml file:
<!-- icon element -->
<element type="Icon" image="Images\cdcase1.png" x="93" yAnchor="Panel.Bottom" y="-597" width="444" height="393" min="180" max="393" onClick="PlayPause"></element>

I also changed the AlbumCover element size and position to fit the CD Case image:
<element type="AlbumCover" x="133" yAnchor="Panel.Bottom" y="-592" width="400" height="380" min="180" max="400" brightness="1.0" ></element>

I'm very satisfied!

p.s.
if you need the CD Case .png files, here they go: