ClassicPro Template User Manual
Contents
1. ClassicPro skin is no more than a Winamp modern skin that is built with the Single User Interface SUI concept But differently from other modern skins where the graphic part and the coding are all responsibility of the skinner in a ClassicPro skin the skinner only need to worry about the graphics part because all the coding for it is previously installed in the Winamp Skins directory if you have the ClassicPro plug in installed See how the different types of modern skins are processed by Winamp before rendering in the two diagrams below MAN 8 0 El Skin file wal renderin ES E 7 35 TUEA 192 MT En j EH EEE 3 with oo ong files gt xml files scripts Diagram 1 Rendering of a normal modern skin PLURE o ad 3 FOO FIGHTERS M Skin file DR a wal with png files colors xml skin xml cpro skin engine with rendering xml files merge with scripts Diagram 2 Rendering of a modern ClassicPro skin For this reason there is no more reason to avoid making modern skins for not Knowing the xml files or MAKI language for scripts as shown before the bulk of the coding is previously solved by the ClassicPro engine You can make modern skins as easily as it was to make classic skins with the advantage of the PNG file format Besides that PNG files are much more lighter than BMPs they all allow transparency which mea2. bold fields Put the required information inside the respective tag and you will be all done The example above is the skin xml of the skin template and you can see the result in the Skin info of the Skin Browser cerro template YVL00 by Wilian Souza Veronica Mogni classicpro skinconsortium com http wilian deviantart com http www veroka deviantart com Template for ClassicPro skins Colors xml As it is a bit complex to go over it here you should open the file itself we explained every single line of that file Through the W amp V s N Wilian 8 Vero s Notes as well as the original SkinConsortium notes also in there so that you will not get lost when you edit the colors of the Wasabi components required by all skins Remember the RGB values for the colors are input in decimal values that vary from O up to 255 24 Greetings amp credits l d like to thank Veronica Mogni Veroka for all her help to create the graphics color themes and other stuff for the skin as well as for keeping me on track about the news regarding the ClassicPro engine also don t have to forget that people who supported me to create this manual through those four months of work have to remember that in several pictures used skins made by another people then have to mention them These skins are e Fluke by Leechbite e Winamp Classic by iron2000 e Winamp Modern by bartibartman e Insomnis v2 by zrco 25 Appendix cPro 1 03
3. by skin in Alpha Blending Options gt Preferences gt Modern skins Tooltip png It s a tiny 17x17 pixel png file which skins the tooltip background If you do not include it in your skin file a default dark one is used the text color for the tooltip is set via colors xml Combobox png Another 17X17 pixel png file that skin the browsers Address dropdown menu background 17 Optional ClassicPro graphic files The files that are going to be shown below do not need to be included in your skin file in order to make it work properly but they can be useful either to give more identity to your ClassicPro skin or to make it behave in a different way mainframe_tb png mainframe_Ir png The left image is mainframe_tb png and the right is mainframe _Ir ong These files make the skin behave in a different way when you stretch or shrink the mainframe with these files instead of tiling the smaller slices present in mainframe png the cPro engine will stretch these files to render the window what can be more convenient regarding to the way you make the mainframe Remember that mainframe_tb can be any width as well as mainframe_Ir can be any height Also you do not need to include both files in your skin About png You have probably seen it before this png gives identity to your skin It s displayed in the Current skin tab Options gt Preferences gt Modern skins so it s interesting we recommend to edit
4. it in your skin file 18 Art_aolradio png art_notfound png art_shoutcast png AOL Radio omm Art_aolradio png Art_notfound png Art_shoutcast png black transparent These pictures are shown in the Album Art Only art_notfound is displayed more often so you can only skin it if you want Beat_right png It works the same way as beat _left png and if you include this file tt must be the same width and have the same number of frames than that file See beat_left png for further details Volume_ani png This file is an alternative multi frame animation for the volume bar It can have the number of frames you want but each frame must be 97X15 pixels as well as each frame must be 1 px apart from their neighbours The picture above is the animation used for cPro_Munchen by wilians 11 frames Pb_status png It s quite similar to playpaus bmp of the classic skins if you do not include it your skin will work but it won t show the playback status 19 Songinfo png Font for the numbers ee kB MB GB A It s a simple file that will skin the part of the mainframe that display all the information about the file that is currently playing If you do not include it a true type font is rendered instead The file size will not be displayed in this case but it doesn t make any difference The images below show how a skin would look with and without songinfo png The left image is a skin with that file cPro_Winamp
5. manual as is was written using MS Word the images with transparency appears in a different way if you opened the original file in a graphics program the transparent areas are represented in pure black here Though it s fantastic be careful with them if you abuse of full transparency in a small component for example a button the users of your skin may not handle with it because full transparency reduces the usable area for the component There is no problem if you are using semi transparent gradients Graphics program It s the main tool you will use to create your skins Although it can read and write PNG graphics Paint is NOT recommended because it can t work with transparency that in case of a 1 03 classicPro is essential to create the overlays If you can t afford programs like Photoshop or PaintShopPro and you have a Windows XP SP2 with NET Framework installed Paint NET is the least you can get with it you can work with layers and transparency although it will took lots of work to make something more elaborated Essential ClassicPro graphic files Mainframe A classic skin has loads of windows to skin how many actually That happens because the classic skin engine besides that many modern skins currently available was designed over a Multiple User Interface it means each Winamp interface Playlist Editor Media Library Equalizer etc has its own window The release of the original Bento skin in version 5 5 introduce
6. now This work is intended to introduce Winamp classic skinners and anyone who wants to make skins for Winamp into the new ClassicPro age showing them that is now possible to make modern skins as easy as it is to make the old classic ones with advantages like the flexibility of the PNG graphic file format We hope you enjoy it ClassicPro 1 03 During our work to create this template it started on beginnings of April 2008 new versions of the ClassicPro plugin had been being released and the latest version the 1 03 was released with features like the color themes support that is really interesting but it had brought a few changes to the ClassicPro skin format But don t panic this manual is not out of date By reading this you are able to make ClassicPro skins compatible with the version 5 5x of Winamp the cPros with color themes support require at least the version 5 54 of the program and besides that we had gone through the new features in an appendix Overview File Play Options view Help E Osis al Foo Fighters Aurora 5 51 4H Oo STEREO d 192 8 0 ME Media Library W Video V Visualization YW Foo Fighters 4 Foo Fighters Gimme Stitches 1 11 items selected 3 42 46 16 6 Foo Fighters Aurora Library Play send To Add Rem Sel Misc Manage Playlist HC 0004 11 Foo Fighters Aurora 3 31 Picture 1 Cpro template skin in its normal above and windowshade below mode A
7. skins Features New buttons png New required files and scripts were added to this type of skin in order to receive the color themes support Another important aspect of those skins is their new buttons png file where the lightning bolt has now three rollover states like most buttons in the cPro skin fill the red px with fTOO8O to disable mera normal New LB rollover states ae mousedown We couldn t forget that colors xml is also a bit different from the one used for the older ones A new property was added for all color ids which is the gammagroup that allows you to create color themes for your skin And finally the script warning maki is also different from the one for ClassicPro 1 00 skins The new file is 3 16 kB big against 2 47 kB of the older version Color themes support files The cPro 1 03 skins also have the overlays An overlay is no more than a png file where the non transparent areas demark those areas that will be affected by the color themes Those areas cannot be necessarily filled by plain colors 26 mainframe_overlay png _ OVERLAY This file is the overlay for the mainframe It must be the same size as mainframe png shade_overlay png This file is the overlay for the mainframe in its windowshade mode It must be the same size as the winshade layout Same width as shade png and 25 pixels height colorthemes png The placement of the button sets follow the same logic used to c
8. Classic by iron2000 and the right image is a skin without it coro Munchen by wilians Mono Stereo Surround indicator Fiahters Learn to Av 4 55 Do Fior SIEREO a gt Songtickerfont png ABCDEFGHIJKLMNOPORSTUVUEY 2 0123456709 1 L Z g ADA The font can be any width and any height but the characters order must follow the way it is shown in this file You also have to add some lines to colors xml in order to use this file we are going to discuss it later In this file the black background is actually a transparent background Numfont png If you choose for using a ttf please check colors xml 20 Mainframe_title png In buttons png we added a information that said if you filled the indicated pixel with the color ff0080 you could disable the menu bar in your skin so that you could use this file instead lt appears centered at the top of the mainframe in its normal layout Although it can be any height it s 25 pixels height in this case it must be 90 pixels width Pledit bmp A zt We could make this file very self explanatory and straightforward so there s no information to add here This is the only bmp file you could create for your skin it s only to fine tune the Playlist editor appearance as the pictures below will show they was taken with the help of the Windows magnifier and show the difference of the PL window appearance with and without this file Picture 2 Play
9. Wilian Souza wilians Veronica Mogni veroka ClassicPro Template User Manual File Flay Options view Help a a E ae Carlos Santana Mara carac 22 PIN Media Library W rl Top Rated Release version August 10 2008 Index o A A 4 OaS CROT O patos ira N hale adorada neuen etna teehee oceatoatel 4 AA A A tec uel ayes tec 5 o A A eee 7 ANP ACKIAG MS SIN ea E E 7 PROMOV ES a o o eo edo cuca Da dede tee 8 o E A E 8 Graphies Drogi AIM ioaren 8 Essential GlassicPro graphie Mes 9 Mantram NO dd 9 ACES ONG EA e A a 10 BUTTONS SILOS sesenta 11 Buttons Ps o de tera DL a O at ata och ad eat tt 11 O gonen A dese an aah acamaaieaiens teeeetacnaiels 12 6193 DULD 6 ere ose meee nnn A A ra ers eee 13 COI JOUR aS DNO nicas 13 O SENDING e e mn oA e e OT AE I ECAT SERaSi 13 SCIOMD SAO isso IE Unos 14 E tena 14 A A 14 o ge nem out aca ado once een deed ma eedeteatentmouaeyerss 16 Sultame ONG scada srta pic EAR 16 Other COMPONENTES susi a sees A EE 17 A A A se hace tensa 17 TOO Quentin dde leida 17 COMIDA a 17 Optional Classic Pro graphic Mes cc 18 mainframe_tb png maintramMe_lr PNO ocoocconccnccnccnocnncnccnoncnnnnnonnnanonnonnnnnonnnnnnnnnnnnns 18 A DOULON Gerrara A a e 18 Art_aolradio png art_notfound png art_shoutcast pnQ ccoccoccocconconconcnncnncnnnnnnnnns 19 Beal OMT ONG iia 19 volume adas 19 FSS US DNO rica 19 SONOINIO ONG erraren enne erpe EE EEEE 20 SONGTICKEIMONT PNivesici sa 20 NUNMIOA DA
10. able rollover states from L to R normal Seek bar Stretcheable for mouseover mousedon themselves nom ie Below the seek area The spec osc color set normal Time elapsed indicator follow the same way as for ri Semi transparent sliders the normal mainframe mousedown from T to D normal _ mouseover mousedon It s the interface for the windowshade mode At the top we have the skin layout the buttons are in the same order as in the normal mode but we also can see where the volume and seek bar are laid on Below the window layout we have all the buttons used to make the window layout The buttons that have the same color as in the layout are in the normal state the clearer ones are in the mouseover state and the darker ones are the mousedown state It was included a small arrow at the right of the layout only to notice the skin can be stretched by clicking dragging it There is also a clearer section between the left side of the layout and the vis area it s a smal section that may vary in size according to the current width of the skin it will always appear between the mentioned areas and sometimes in other areas to fill the layout when some component doesn t have enough space to be displayed The pictures above show how the winshade mode change Its appearance according to the length it is assumed r ral r m r Buttons sliders Buttons png Playback buttons Menu bar patterns and rating stars Titlebar button
11. borders around the Address and Search bar From L to R start the middle always stretched and the and and at its right the dropdown symbol for the dropdown button in the address bar the button itself as well as the other buttons inside those bars is skinned with the Wasabi button set found in buttons png so you have to take the same care as the rating stares if you re not planning to use transparency on it 13 Scrollbars png Vertical scrollbars from left to right Normal mouseover mousedown scrollbar background Horizontal scrollbars from top to bottom Normal mouseover mousedown scrollbar background This is the file that will skin the scrollbars for the Media Library and the widgets When you don t include this file all scrollbars of the Media Library will be skinned with buttons png but as commented before in this case the scrollbars don t work in the widgets therefore this file is essential to your skin work properly It s the file you need to skin the beats Actually the three images above are the different ways you can create your either beat_left ong or beat_right png If it exists it will be described in optional ClassicPro files regarding the type of animation desired e At left you see the one frame animation type It s the most simple one the image is displayed partially from right to left according to the beat level e The center image is the same file in its two frame animation type it wo
12. columns Bae Always on top off Always on top on Restore Maximize Minimize F Menu Exit Winamp Switch to winshade Row set 1 cols from L to R shuffle off repeat off repeat track on mute off Row set 2 cols from L to R shuffle on repeat pl on load file mute on Lightning bolt in mouseover state by its left the Wasabi buttons The graphics file for the buttons in the mainframe and default Wasabi objects in their three rollover states The image above is quite self explanatory therefore we are going to show you some observations here about the behavior of the components skinned with this file At first the rating stars The states for them are from left to right unrated rated and highlighted f you re not planning to use transparency on them make sure their background color matches That is pay attention to the background color of the album art background around the stars see suiframe png for more details and the what is found in the gtx of the suiframe The Wasabi buttons will skin all the buttons of the media Library and some buttons of the browser in the Search and Go bars and will also skin the Media Library and the Skin chooser window scrollbars if you don t include scrollbars png in your skin Theoretically because there s a bug in the ClassicPro skin when scrollbars png is not included the Skin Chooser scrollbar simply doesn t work it doe
13. d the Single User Interface concept where every Winamp interface can be embedded in only one window For this reason you need only two windows to skin in the ClassicPro interface the mainframe in its normal and windowshade mode Mainframe png bolt Areas for Titlebar buttons Spec analyzer osc Timer and songticker The highligths in this area will be useful if you include songinfo png and Playback buttons Mute button pb_status png in your skin Volume bar Load button Detail Seek bar Shuffle Repeat button GFX suiframe Spec osc color set backqround stretched It s the interface for the normal window There are many decals in it just to show you where each component is laid in menu bar vis etc Notice the window is sliced in this png and the smaller areas will be tiled if you resize the window when it is working If you want those areas to be stretched instead of tiled you must include in your skin file the following files e mainframe_tb png for top and bottom slices e mainframe_Ir png for left and right slices You can make the transparency for this file easily just make transparent the areas you want to be the corners for example without any need for coding Lightining dot amp yellow columns Shade png Winshade mode layout Below all Below the volume area Vis area winshade Volume level indicator Volume bar area mode buttons Semi transparent sliders Songticker Stretche
14. des psss ici oo E ia eterna 20 Mainframe MO dee 21 e o dnastee eee AE 21 FONO ONG ranas 22 Sereenshol DONG sir casi 22 PW O SEU static ino E lied Decide 23 A na mbecidon iat aamacaeaiidaedemaumaaaadradammamtenteuntendit mame daaadansetaaaeaes 24 A O aaeect hn oieedores 24 A repenra Ee E O EEEa 25 Appendix cPro 1 03 SKINS FOAlUNGS cirio iia 26 NeW DUWONS Nu e ed rc sma 26 Color themes SUDDON les te a ii 26 mantrame overlay DN isa 27 shade ov nay ON spin tia 27 COREME S DNO anr aE de 27 Ene Winamps Color Editor ai o eS 28 Creating ANEW COlOr MM as 28 Doing the hard work editing the ColOrS occoccconconconcoccocnonncanoncnncnnnnnnnnnnos 29 SWNG VOUT CING POS OOOO O UU CEE 29 FICS table TOF GPIO 1200 1064 A 30 Introduction When the ClassicPro engine was first released in the beginnings of 2008 as many other people did it figured out the potential of this skin model to be made by many people who used to create classic skins and wished they could create something that wouldn t be constrained to the limitations of that skin engine but had not courage to do coding in order to create a modern skin To reach that goal it just needed a template that could show it thoroughly so that people could make their skins without any worries or doubts Then in the mid of April called Veroka to help me with the skin template and this manual After almost 4 months of work especially due to few spare time it s being released
15. e it s reached click Apply If you want to you can enable the Auto Apply so that you can see the changes realtime e If you didn t like the final result in any time click Revert then the original color will be restored Depending on the color you want to reach you may enable Max Grayscale Avg Grayscale and Saturate Channels at the same time as well as changing the source color but its best to handle with the last one when you are more experienced on it You can copy the color reached in one color group to another color group via Copy Group Paste Group Do the steps above until all color groups are edited You can see the final result in the skin Saving your theme When you are all done you ll think you just need to click Save Themes and you are all done But THAT S NOT THE TRUTH because doing this way your color theme won t be saved in colorthemes xml of your skin so the color theme you created won t be available for other users when you publish it You neeed to export the color theme by clicking Export in the Color Editor interface and then save the file as colorthemes xml this way Save Color Themes Save ir E Desktop My Recent Documents Desktop MMi Documents de My Computer my Documents My Computer Sony Hetwork Places 9 AddedAndModifiedFiles Fluke I GPRORules asp_arquivos j index php_arguivos 5 Install letra
16. f subcomponentl1 and all subcomponents belong to a single component You shouldn t close a tag by typing a backslash before the tag identifier before adding all the subcomponents desired A comment inserted in a XML file will always follow this way lt example of a comment in a XML file gt Comments are not taken into account by the skin engine when compiling it You can use even the Notepad to see the codes but try using code editors like EditPlus Dreamweaver or Visual Studio these programs color the code so that makes it easier to check if they are consistent or not 23 Skin xml It will always follow this way lt xml version 1 0 encoding UTF 8 standalone yes gt lt WasabiXML version 1 31 gt lt 5kininf o gt lt version gt 1 00 lt version gt lt name gt cPro Template lt name gt lt comment gt Template for ClassicPro skins lt comment gt lt author gaybag wilians Veroka gt Wilian Souza Veronica Mogni lt author gt lt email gt classicpro skinconsortium com lt email gt lt homepage gt http wilian deviantart com http www veroka devian tart com lt homepage gt lt screenshot gt screenshot png lt screenshot gt lt skininfo gt lt scripts gt lt script file warning maki param f COLORTHEMESPATHE gt lt scripts gt lt inelude tile colors xmL gt lt include file COLORTHEMESPATH Plugins classicPro engine load xml gt lt WasabiXML gt You only need to edit the
17. face Suiframe png Main Dividers frame The smaller which is ones are tabbed stretched and the Playlist bigger ones section are displayed in the middle Widgets section N ran ke Toggle drawer buttons reen dots normal state Top active widgets section Yellow dots mouseover state je inactive Red dots mousedown state ottom mouseover inactive Actually the black regions in this file are transparent areas This file skins the gfx for the interface of the skin The three frames at left are divided into 9 slices and only the corner slices have their original size preserved All the others are stretched to suit the frame dimensions The tabs are divided into three slices and the mid ones are stretched and they overlap the main frame so you have to pay attention when you make them in order to suit the main frame The alternative bottom for the widgets section usually appears in the tag viewer and the skin chooser so don t forget to skin it too 16 Other components Notifier png Notifier layout 1 gt Notifier layout 2 Album art background It skins the notifier The layouts are divided into 3 slices where the mid ones are stretched and one of the layouts are displayed at a time but the second one allows you to add for example alpha blend around their borders To switch between layout 1 and 2 you have to toggle the checkbox Enable Desktop Alpha Blending when requested
18. list window appearance without pledit bmp figure out the broken side borders A Picture 3 Playlist window appearance with pledit bmp the difference is quite visible and the user can figure out these differences even with the window in its original size The pictures you ve just seen were zoomed in by 4X 21 Promo png This picture is used to display anything in your skin in the area that is normally used for the beats when playback is stopped Notice there are three different sizes for the same promo and one of them will be displayed according to the current width of the skin Screenshot png As the name says it s a screenshot of your skin that you take in its minimal size and save it as a PNG It s only shown when you are installing 2 Winamp Setup Mavigation fools Help Choose Skin Choose the look and feel For your Winamp cPro_ Bento pees cPro_ Fluke cPro_Insoamnis v2 cPro_msotfice cPro_munchen by wilians cPro_Niveum blue J cPro_nova Mame cPro_Template cPro_smartbluestudio J cPro_ template cyanian by wilians Dynamic 1 1 by sinan greentea green_ E Dinanmeer MRY O02 20 Type Modern Author wilian Souza veronica Mogni version 1 00 ma 22 XML files setup All we are going to show below is an explanation of some basics about XML standards so that you can understand the XMLs present in the classicPro skin as well as any Winamp Modern ski
19. n If you want to know more about modern skinning and how to create a normal modern skin please see the Skinning Tutorial written by Ken Chen XML stands for eXtensible Markup Language A XML code consists of storing information inside tags A tag will always follow this construction lt component gt lt propertyl1 gt value 1 lt property1 gt lt property2 gt value 2 lt property2 gt lt propertyN gt value N lt propertyN gt lt component gt Or lt component propertyl value 1 property2 value 2 propertyN value N gt Both examples above will mean the same These are the way data is described in a XML file in a Winamp Modern skin any classicPro for example the component can be a button a slider and each component has their own properties The components in a Winamp Modern skin is often organized in several hierarchy levels like this example lt component id component id gt lt subcomponentl1 id subl id property subl prop gt lt auxiliarycomp id auxcp property aux prop gt lt subcomponent1 gt lt subcomponent2 id sub2 id property sub2 prop gt lt subcomponentN id subN id property subN prop gt lt component gt Notice that the two types of tag construction are mixed in this example and this format is often used to make the Winamp XML take a quick look at colors xml You can also realize in the example above that auxiliarycomp is part o
20. ns that you can make for example buttons files that can suit dozens of skins you would like to do Getting started Unpacking the skin In this pack you received two skin template files one is a classicPro 1 00 compatible and the other is the 1 03 compatible In order to see the files we recommend to unpack the first one e First of all please check if you can see the file extensions in windows Explorer so that you can change it by renaming the file Via Control Panel gt Folder Options gt View check if the option Hide extensions for known file types or the equivalent in another language is disabled Folder Options General View File Types Offline Files Folder views ou can apply the view such as Details or Tiles that You are using for this folder to all folders Reset All Folders Advanced settings C Do not cache thumbnails 9 Hidden files and folders O Do not show hidden files and folders Show hidden files and folders Y Hide protected operating system files Recommended C Launch folder windows ina separate process 9 Managing pairs of Web pages and folders Show and manage the pair as a single file gn J Show both parte and manage them individually iT O Show both parts but manage as a single file W Remember each folder s view settings Restore Defaults OF Cancel e Rename the extension file from wal
21. reate files like comp_but png This file will skin the buttons in the new Color Themes chooser 2 The Winamp5 Color Editor COLOR EDITOR Color Themes Color Groups Test theme n Background Bottom RGB HSL _ Auto Apply This is a very handy plugin where you can create color themes for your skin It doesn t come with Winamp 5 54 you have to install it by yourself but it s available on the Winamp homepage It doesn t work only for ClassicPro skins you can use it to edit or create color themes for any modern skin since it has gammagroups defined Figure out that its interface borrow some Wasabi components skinned by you in this case it will take the buttons from buttons png and it will color the number fields and the inner lists with colors defined by colors xml Before using it you have to check if you created gammagroups for the components declared in colors xml which you desire to be affected by your color themes All we are going to show now is a quick reference so that you can handle with it in its basic stuff Creating a new color theme Click the New theme button Then you will give a name for it and say OK fi NEW THEME Theme name o cane 28 Doing the hard work editing the colors In the Color Groups list select the one desired to be changed a In Group Settings there are three sliders used to change the color Move them so that you can reach the color desired Onc
22. rks similarly to the first type but the lower part is used for the background of the animation e At right you see the same file in its multi frame animation type we did this file with 5 frames but in your skin file you can add the number of frames you want remembering that the beat level increases from top to bottom See the example below the beat_left and beat_right of cPro_munchen by wilians it was made with 13 frames Bear in mind you can create this file with the width you want but the height for each frame in any type must be 45 pixels Besides that the wider you beat vis the wider the skin will have to stretch for it to show Interface Beat_left png 14 When the beat vis isn t showed disabled or area to small promo png is displayed if it is included in your skin file 15 Eq png Equalizer interface Equalizer Preamplifier sliders in EQ band info WA frequencies their three rollover states Toggle crossfade and crossfade EQ band info ISO frequencies setup buttons in their rollover states This is the file that will skin the equalizer which is shown in the widgets area in a ClassicPro skin The EQ band info is also part of the equalizer interface it appears below the eq bars and the reason there are two slices to the same thing is that now you can choose the band frequency set between the Winamp and ISO defaults But you may worry about it only if you want to show the frequency values in the inter
23. s Pen drive 3 Template cPro J TrackDetails asp_arquivos colors xml 5kins Save Cancel EA File name colorthemes a biy Network Save as type Wasabi XML Color Themes After doing that just insert the file created into the skin file and you are all done Once in the skin file the color themes you created can t be edited by other users 29 Files table for cPro 1 00 1 03 This is a simple table that shows the required and optional files for both skin versions ClassicPro 1 00 compatible ClassicPro 1 03 mainframe png shade png buttons png seekvol png comp_but png comp_but_tabs png browser png scrollbars png beat_left png eq png suiframe png Required notifier ong files colors xml warning maki mainframe_tb png mainframe_lr png mainframe_title png about png art_aolradio png art_notfound png art_shoutcast png beat_right png volume_ani png pb_status png songinfo png songtickerfont png numfont png promo png pledit omp skin xm Other files Optional files mainframe png mainframe_overlay png shade png shade_overlay png buttons png seekvol png comp_but png comp_but_tabs png colorthemes png browser png scrollbars png beat_left png eq png sulframe png notifier png colors xml colorthemes xml tempfix103 xml warning maki tempfix103 maki sendparams maki If you disable menu bar in buttons png this file will be required skin xml and b
24. sn t even appear 11 Seekvol png Backgrounds for the seek bar up to down default background time elapsed and mouseover state of time elapsed Volume the small and seek slider sets up to down normal mouseover and mousedown state They are semi transparent to Backgrounds for the volume show what e i t happens below bar The upper image is the ion default the lower image represents whether volume level is being used The description of each section in this file is enough straightforward so there are any secret in this file but we ll give you a brief description of how the backgrounds of those bars work The second image of the volume bar the clearer one is shown partially over the first one according to the volume level that is being used The seek bar is a bit more complex They are divided into three sections form left to right the first one is the start of the bar the second one is the middle of the bar it is stretched to fit the whole bar and the last one is the end of the bar the backgrounds for the time elapsed both normal and mouseover states work this way when the song begins the first section is shown within 3 6 of the time elapsed the second section is shown and a little later the last section appears as the song is being played the last section moves to right while the second section is stretched to follow it covering the default background You must to pay attention to this beha
25. to zip so that you can extract all files in it to a folder e Create a shortcut for the Winamp skins folder in a place easy to you to find The path for it is usually C Program Files Winamp Skins e Drag the extracted files to the shortcut and the skin will be installed there as a folder Note that these steps are not necessary to install a skin in Winamp normally you would double click the wal file and say Yes to the WA skin installer but the way it was shown will be useful when making you own skin when you edit any file in there you will edit directly in the skin file so that you will only restart the skin by choosing another skin while Winamp is playing and then re choosing it to see the result Rollover states We are going to talk about it very frequently through this manual Rollover states are the different ways a picture is displayed according to the behavior of the mouse cursor over it The states are e normal when mouse cursor is away from it the default view e mouseover or hover state when mouse cursor is over it e mousedown or simply down state when you click the image while the mouse cursor iS over it Transparency The best of making classicPro skins is certainly the transparency allowed by the PNG file format With it you are free to make some components freeform and even create semitransparent components that would suit many skins you make saving time without loosing quality In this
26. uttons png as well as warning maki are different between the skin versions If you include the older ones in a 1 03 skin file it will crash You can even add scripts and other graphic elements to your skin file if you are in an advanced level XKX pledit bmp is not used by the ClassicPro 1 03 30
27. vior if you are not planning to use sliders for the seek bar in your skin avoiding bugs like the shown below ENO per a_ gt i That s what may pay attention on what was explained above fi E 4 The result in the WIP Seekvol of a WIP by wilians The black color in seeker sliders and part of the seeker backgrounds are transparent areas Comp_but png playlist editor section equalizer This file consists of dozens of button sets that will skin the buttons in Playlist editor visualizer widgets and equalizer the first row is the normal state the second one is the mouseover state the third is the mousedown state and the fourth for some buttons is the normal active state for example when your equalizer is turned on the on button in the last row is used instead of in the first one lf you don t know anything about widgets we ll describe them when we go through suiframe png Comp_but_tabs png The placement of the button sets follow the same logic used to create comp_but png This file will skin all the buttons inside the tabs Browser png The placement of the button sets follow the same logic used to create comp_but png and comp_but_tabs png although there s no active state for any button in it This file will skin all objects inside the browser which returned with the release of the original Bento skin Right below the Media Monitor button set we find the slices used to create the
Download Pdf Manuals
Related Search