Skinning.controlTips

From Shareaza Wiki
Revision as of 07:18, 18 August 2009 by Ocexyz (talk | contribs) (small correction)
Jump to navigation Jump to search
  Languages:

[[::Skinning.controlTips|English]] • [[::Skinning.controlTips/de|Deutsch]] • [[::Skinning.controlTips/es|Español]] • [[::Skinning.controlTips/fr|Français]] • [[::Skinning.controlTips/he|עברית]] • [[::Skinning.controlTips/it|Italiano]] • [[::Skinning.controlTips/nl|Nederlands]] • [[::Skinning.controlTips/pl|Polski]] • [[::Skinning.controlTips/pt|Português]] • [[::Skinning.controlTips/ru|Русский]] • [[::Skinning.controlTips/zh-hant|‪中文(繁體)]]

e
  Recovered

This is during recovery The following content has been recovered from the old wiki and pantheraproject*net. Competent verification is needed.

e



start content<controlTips>

The <controlTips> element can be used to display tooltips for almost all dialog controls when mouse is moved over them.

The element is useful while translating settings pages, when detailed explanation is needed or when translation text is very long and doesn't fit in the dialog. The translators can shorten the text and put the full text in tooltips. Each element consists of a message that is displayed in the tooltip. The id is taken from the tipMap.

Here is an example from MyControlTipSkin.xml:

<controlTips>

 <tip id="IDC_THROTTLE_MODE" message="In the maximum mode the bandwidth won't 
    exceed the specified value. In the average mode it will fluctuate around the 
    value to both sides."/>

</controlTips>

To create a translation skin, copy the existing control tip database from default-en.xml in your skins folder and start translating each entry.

Retrieved from now untrusted pantheraproject*net

This page was last modified on March 27, 2008, at 20:08.
  • Content is available under [/wiki/index.php%3Ftitle=Shareaza_Wiki:Copyrights GNU Free Documentation License 1.3].

Copyright © 2002-2009 Shareaza Development Team.




<form name="languageselector-form-1" id="languageselector-form-1" method="get" action="/wiki/index.php" style="display:inline;"><input name="title" type="hidden" value="Skinning.Tutorial" /><select name="setlang" id="languageselector-select-1" style=""><option value="en" selected="selected">English</option><option value="es">Español</option><option value="de">Deutsch</option><option value="fr">Français</option><option value="he">עברית</option><option value="it">Italiano</option><option value="nl">Nederlands</option><option value="pl">Polski</option><option value="ru">Русский</option><option value="pt">Português</option><option value="tw">Twi</option></select><input type="submit" value="set" id="languageselector-commit-1" style="" /></form>

Contents

  • <a href="#Skinning_Tutorial">1 Skinning Tutorial</a>
  • <a href="#Getting_Started">2 Getting Started</a>
  • <a href="#The_Manifest_Element">3 The Manifest Element</a>
  • <a href="#Visual_Guide">4 Visual Guide</a>
  • <a href="#Skin_Elements">5 Skin Elements</a>
  • <a href="#Adding_RTL_.28Right-to-Left.29_Compatibility">6 Adding RTL (Right-to-Left) Compatibility</a>
  • <a href="#Shareaza_Remote_Skinning">7 Shareaza Remote Skinning</a>
  • <a href="#Distributing_Your_Skins">8 Distributing Your Skins</a>
  • <a href="#Getting_Help">9 Getting Help</a>

<script type="text/javascript"> if (window.showTocToggle) { var tocShowText = "show"; var tocHideText = "hide"; showTocToggle(); } </script> <a name="Skinning_Tutorial" id="Skinning_Tutorial"></a>

Skinning Tutorial

Creating skins for Shareaza is easy. You can make skins as simple or as complex as you want. These pages provide a simple tutorial and a detailed reference for Shareaza skinning capabilities. With this tutorial you'll be able to make:

  • Visual skins - Changes visual theme and or customizes buttons/layout of program.
  • Language skins - Translates text into a different language.

<a name="Getting_Started" id="Getting_Started"></a>

Getting Started

This tutorial goes in parts. A great way to learn is to go through element-by-element and build your own skin!

Skins are stored in the C:\Program Files\Shareaza\Skins folder.

Each skin has its own folder, such as C:\Program Files\Shareaza\Skins\MySkin. Each folder contains the main skin file and support files, such as images or icons. Every skin has a skin definition file, which is in XML format. XML is an easy to read text format not unlike HTML, but for more general purpose use. It is recommended, but not required, that a text editor with XML syntax highlighting be used. Examples are <a href="http://notepad-plus.sourceforge.net/" class="external text" title="http://notepad-plus.sourceforge.net/">Notepad++</a> or <a href="http://www.emeditor.com/" class="external text" title="http://www.emeditor.com/">EmEditor</a>. The skin definition file tells Shareaza about the skin -- things like who created it, which parts of the interface to change, and how to change them.

Here is a very simple skin file, called MySimpleSkin.xml:

 <span class="re1"><?xml</span> <span class="re0">version</span>=<span class="st0">"1.0"</span> <span class="re0">encoding</span>=<span class="st0">"UTF-8"</span><span class="re2">?></span>
 <span class="re1"><skin</span> <span class="re0">xmlns</span>=<span class="st0">"http://www.shareaza.com/schemas/Skin.xsd"</span> <span class="re0">version</span>=<span class="st0">"1.0"</span><span class="re2">></span>
 <span class="re1"><manifest</span> <span class="re0">name</span>=<span class="st0">"My Simple Skin"</span> <span class="re0">author</span>=<span class="st0">"Me"</span> <span class="re0">type</span>=<span class="st0">"Skin"</span><span class="re2">/></span>
 <span class="re1"><watermarks<span class="re2">></span></span>
  <span class="re1"><watermark</span> <span class="re0">target</span>=<span class="st0">"CCoolMenuBar"</span> <span class="re0">path</span>=<span class="st0">"MyWatermark.bmp"</span><span class="re2">/></span>
 <span class="re1"></watermarks<span class="re2">></span></span>
 <span class="re1"></skin<span class="re2">></span></span>

This skin specifies its name and author, and adds a watermark image to the main menu bar. Easy! Skins are just like this: you can change as much or as little as you want.

Note: The first two lines of this example should always be used without modification. The xmlns and version tags are important, and should not be edited at all. This is the version of the skinning core, not the version of your skin.

Tip: If you need to quickly reload the skin you are working on, press Ctrl-Shift-Z.

<a name="The_Manifest_Element" id="The_Manifest_Element"></a>

The Manifest Element

The example above included a <manifest> element, which specified the name of the skin. It's important to include some good meta-information about your skin so that others can identify it and search for it. Here is a complete reference for the <manifest> element:

 <span class="re1"><manifest</span>
 <span class="re0">name</span>=<span class="st0">"The name of the skin"</span>
 <span class="re0">author</span>=<span class="st0">"The person or organisation who created it"</span>
 <span class="re0">updatedBy</span>=<span class="st0">"The person who updated it"</span>
 <span class="re0">description</span>=<span class="st0">"A longer description of the skin, if desired"</span>
 <span class="re0">link</span>=<span class="st0">"http://a.url.for.the.skin.com/if/applicable/"</span>
 <span class="re0">email</span>=<span class="st0">"an@email.address.example.com"</span>
 <span class="re0">version</span>=<span class="st0">"1.5"</span>
 <span class="re0">type</span>=<span class="st0">"Skin"</span>
 <span class="re0">dir</span>=<span class="st0">"ltr"</span>
 <span class="re2">/></span>

All of the attributes except for name are optional:

  • name - The name of the skin.
  • author - The person who created the skin.
  • updatedBy - The person who updated/improved the skin.
  • description - A longer description of the skin.
  • link - An optional web URL to visit for more information.
  • email - An optional email address to contact for more information.
  • version - The revision number of the skin.
  • type - Most skins should set this to "skin". The exception is language translation skins, which would set this to "language".
  • language - Only include if the type is set to "language" above. It specifies the language code which the translation provides, for example "en".
  • dir - Most skins can omit this. The values can be: "ltr" for left-to-right languages and "rtl" for right-to-left languages.


<a name="Visual_Guide" id="Visual_Guide"></a>

Visual Guide

The visual guide is a collection of screenshots and other visuals demonstrating what parts of the default skin correspond to which IDs.

<a href="http://shareaza.sourceforge.net/?id=skindocs/xml-default" class="external text" title="http://shareaza.sourceforge.net/?id=skindocs/xml-default">Default.xml</a> and <a href="http://shareaza.sourceforge.net/?id=skindocs/xml-definitions" class="external text" title="http://shareaza.sourceforge.net/?id=skindocs/xml-definitions">Definitions.xml</a> show a list of Shareaza's default icons and their corresponding IDs to help in figuring out how to modify a certain icon. The documentation on <a href="/wiki/index.php?title=Skinning.commandImages" title="Skinning.commandImages">commandImages</a> should be consulted for the exact syntax for replacing icons.

<a name="Skin_Elements" id="Skin_Elements"></a>

Skin Elements

This section lists all of the different elements you can include in a skin file, with links to more detailed descriptions.

Element Description Used For
<a href="/wiki/index.php?title=Skinning.colourScheme" title="Skinning.colourScheme"><colourScheme></a> Specifies the user interface colour scheme used throughout the program. Skinning
<a href="/wiki/index.php?title=Skinning.watermarks" title="Skinning.watermarks"><watermarks></a> Adds watermark images to parts of the interface. Skinning
<a href="/wiki/index.php?title=Skinning.windowSkins" title="Skinning.windowSkins"><windowSkins></a> Drastically changes the appearance of windows. Skinning
<a href="/wiki/index.php?title=Skinning.commandImages" title="Skinning.commandImages"><commandImages></a> Changes images displayed on toolbars, menus and windows. Skinning
<a href="/wiki/index.php?title=Skinning.menus" title="Skinning.menus"><menus></a> Defines the menus in the program. Skinning
<a href="/wiki/index.php?title=Skinning.toolbars" title="Skinning.toolbars"><toolbars></a> Defines the toolbars in the program. Skinning
<a href="/wiki/index.php?title=Skinning.fonts" title="Skinning.fonts"><fonts></a> Changes the fonts used in the interface. Skinning
<a href="/wiki/index.php?title=Skinning.documents" title="Skinning.documents"><documents></a> Provides the RichDoc displayed on the Home tab. Skinning
<a href="/wiki/index.php?title=Skinning.tipMap" title="Skinning.tipMap"><tipMap></a> Controls the Tip map. Translation
<a href="/wiki/index.php?title=Skinning.controlTips" title="Skinning.controlTips"><controlTips></a> Changes the text displayed in tooltips for various dialogs. Translation
<a href="/wiki/index.php?title=Skinning.dialogs" title="Skinning.dialogs"><dialogs></a> Changes the text displayed in dialogs. Translation
<a href="/wiki/index.php?title=Skinning.commandTips" title="Skinning.commandTips"><commandTips></a> Changes the text displayed in tooltips and command help messages. Translation
<a href="/wiki/index.php?title=Skinning.strings" title="Skinning.strings"><strings></a> Changes the text used in all other messages. Translation
<a href="/wiki/index.php?title=Skinning.listColumns" title="Skinning.listColumns"><listColumns></a> Changes the text displayed in list views. Translation

<a name="Adding_RTL_.28Right-to-Left.29_Compatibility" id="Adding_RTL_.28Right-to-Left.29_Compatibility"></a>

Adding RTL (Right-to-Left) Compatibility

So that people all around the world can enjoy your skin you should make sure it is RTL (Right-to-Left) compatible. This is for languages that start on the right and read to the left like Hebrew and Arabic.

<a name="Shareaza_Remote_Skinning" id="Shareaza_Remote_Skinning"></a>

Shareaza Remote Skinning

Once you've learned the elements of Shareaza skinning, give <a href="/wiki/index.php?title=Skinning.remote" title="Skinning.remote">skinning the remote</a> a try!

<a name="Distributing_Your_Skins" id="Distributing_Your_Skins"></a>

Distributing Your Skins

Once you've created a cool skin, there isn't much point in keeping it all to yourself, right? Distributing Shareaza skins is easy, but there are a few tips which are worth mentioning.

  • Make sure the skin is ready for prime-time.
Test that it works without any strange results. If possible test it on a different computer.


  • Make sure everything is as neat & small as possible.
If you've created image files, convert them to 8-bit, 256 colour bitmaps.


  • Check your manifest element.
This should provide an accurate name for the skin, the type of skin, and any other information you think is relevant.

The best way to package and distribute a Shareaza skin is to ZIP up all the files, and take advantage of the automatic skin installer that comes with Shareaza.

To do this:

ZIP the skins folder. Rename your .ZIP file to a .SKS file. Shareaza skin (.sks) files are automatically unzipped and installed into the correct location when they are opened by end-users.

Finally, be sure to submit your skin to the <a href="http://www.shareazasecurity.be/forum/viewforum.php?f=18" class="external text" title="http://www.shareazasecurity.be/forum/viewforum.php?f=18">Shareaza skin library</a>, and share it on Shareaza! Sharing skins on Shareaza is very important, as it will allow everyone to download them faster. After all, that's what we're about!

<a name="Getting_Help" id="Getting_Help"></a>

Getting Help

Need help with skinning? Want to talk to others about it, or make an announcement about your new skin? If so, visit the <a href="http://www.shareazasecurity.be/forum/viewforum.php?f=18" class="external text" title="http://www.shareazasecurity.be/forum/viewforum.php?f=18">Skinning Forum</a>.


  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/es">Español</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/de">Deutsch</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/fr">Français</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/he">עברית</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/it">Italiano</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/nl">Nederlands</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/pl">Polski</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/ru">Русский</a>
  • <a href="http://www.pantheraproject.net/wiki/index.php?title=Skinning.Tutorial/pt">PortuguĂŞs</a>
  • This page was last modified on December 23, 2008, at 15:59.
  • Proud to be Open Source