Please login or register.

Login with username, password and session length

Topic: teach me how to create Winyl Skin  (Read 6278 times)

March 28, 2013, 04:49:04 AM
  • Newbie
  • *
  • Posts: 1
    • View Profile
    • Email
teach me how to create Winyl Skin
« on: March 28, 2013, 04:49:04 AM »
hi everybody, im newbie in this forum, but i'm a fans of winyl music player, i wish i could create my own skin and share here as another member do, but poorly i dont know how to create it, anybody could teach me how to create it? i will appreciate it a lot , thanks

March 30, 2013, 03:09:40 AM
Reply #1
  • Newbie
  • *
  • Posts: 38
    • View Profile
    • Email
Re: teach me how to create Winyl Skin
« Reply #1 on: March 30, 2013, 03:09:40 AM »
Hi, my english is bad, but I will try explain to you.

Considering that you already had designed the skin in your image editor, first thing to do is download a xml editor, I use XML Copy Editor (you can use the default notepad too, but I think it's bad :P)

Now go to the skin folder, choose one skin that you like and change the extension from .wzp to .zip and extract it.

Replace the all the .png files with yours. In almost all folders theres a .xml too, you will not need edit the little ones (buttons in most) if you do, their are self-explanatory.
The main .xml files are Skin.xml, Mini.xml, Popup.xml, Library\Library.xml and Playlist\Playlist.xml.

I'll give a example of Skin.xml here, which is divided in layouts, and every layout have Elements (.xml files for buttons, playlist, texts and so forth) and Background (images or fill).
Basically you'll have to change the position of everything, modifying layouts or creating new ones.

Some basic examples:

Here I have the Library on the top left (Top="0" Left="0"):

<Layout Name="Library">
   <Position Top="0" Left="0" Width="200" />
   <Elements>
     <Library>
       <Position Left="0" Right="0" Top="0" Bottom="0" />
       <Skin File="Library\Library.xml" />
     </Library>
   </Elements>
</Layout>

Here I have the Controls on the bottom (Bottom="0"), with BackControls.png in background:

<Layout Name="Controls">
   <Position Bottom="0" Left="0" Right="0" Height="100" />
   <Elements>
     <PlayPause>
       <Position LeftRight="0" Top="23" />
       <Skin File="SwitchPlay\Play.xml" />
     </PlayPause>
   </Elements>
   <Background>
     <Image>
       <Position Bottom="0" Left="0" Right="0" />
       <Image File="Background\BackControls.png" />
     </Image>
   </Background>
</Layout>

I hope this helps, it's hard to explain everything, so I highly recommend you poke around all to learn better.
« Last Edit: March 30, 2013, 03:53:16 AM by pepo »