Difference between revisions of "Skinning How To/Add custom artwork to the viewer"

From Second Life Wiki
Jump to navigation Jump to search
(New page: = Introduction = A simple file replace is not all you can do with skinning. You can also add your own artwork, with your own file names if you wish. These can take the form if icons, butt...)
 
 
(One intermediate revision by one other user not shown)
Line 7: Line 7:
The viewer supports files saved in PNG, TGA, or J2C formats. To add your own artwork to the viewer:
The viewer supports files saved in PNG, TGA, or J2C formats. To add your own artwork to the viewer:


# Save your image in one of the following formats above, for example, foo.tga.
# Save your image in one of the formats listed above. For example, foo.tga.
# Move foo.tga to the '''SecondLifeReleaseCandidate\skins\textures''' folder.
# Move foo.tga to the '''SecondLifeReleaseCandidate\skins\[SKIN]\textures''' folder, [SKIN] being the name of the viewer skin you want to add your artwork to.  
# In this folder, find and open the file '''textures.xml''' and add the following line: <code><foo.tga preload="true"/></code> anywhere between <code><textures></code> and <code></textures></code>. (Note that you can also use scale_rect values for your texture. For more information, read [[Skinning_HowTo/Basics#scaling_rectangles_.28scale_rect.29 | scale_rect]]).
# In the textures folder, find and open the file '''textures.xml''' and add the following line: <code><foo.tga preload="true"/></code> anywhere between <code><textures></code> and <code></textures></code>. (Note that you can also use scale_rect values for your texture. For more information, read [[Skinning_HowTo/Basics#scaling_rectangles_.28scale_rect.29 | scale_rect]]).


The setting <code>preload="true"/></code> ensures the texture loads on startup.  
The setting <code>preload="true"/></code> ensures the texture loads on startup.  
Line 17: Line 17:
To use your artwork, you need to reference it in another xml file. For example:
To use your artwork, you need to reference it in another xml file. For example:


<pre><icon bottom="0" left="0" scale_image="true" width="100"
<pre><icon
         follows="left|right|top|bottom" height="26" image_name="foo.tga"/></pre>
        bottom="0"
         follows="left|right|top|bottom"
        height="26"
        image_name="foo.tga"
        left="0"
        scale_image="true"
        width="100" /></pre>


<pre><button bottom="0" font="SansSerif" height="20" left="0"
or
      image_selected="foo.tga"
      image_unselected="foo2tga"
      image_disabled="foo3.tga"
      image_disabled_selected="foo4.tga"
      image_overlay="icn_foo.tga"
      label="foo" name="foo" tool_tip="Show foo" </pre>


Any combination of image_* parameters can be used for buttons, and using your texture as an icon in its own panel (as is done in panel_toolbar.xml loading panel_bg_toolbar.xml) is a way to create your own backgrounds.
<pre><button
      bottom="0"
      font="SansSerif"
      height="20"
      image_disabled="foo3.tga"
      image_disabled_selected="foo4.tga"
      image_overlay="icn_foo.tga"
      image_selected="foo.tga"
      image_unselected="foo2tga"
      label="foo"
      left="0"
      name="foo"
      tool_tip="Show foo" /> </pre>
 
Any combination of image_* parameters can be used for buttons, and using your texture as an icon in its own panel is an easy way to create your own backgrounds for UI elements.


[[Category:Skinning]]
[[Category:Skinning]]

Latest revision as of 23:16, 30 November 2023

Introduction

A simple file replace is not all you can do with skinning. You can also add your own artwork, with your own file names if you wish. These can take the form if icons, buttons, or backgrounds.

Adding artwork

The viewer supports files saved in PNG, TGA, or J2C formats. To add your own artwork to the viewer:

  1. Save your image in one of the formats listed above. For example, foo.tga.
  2. Move foo.tga to the SecondLifeReleaseCandidate\skins\[SKIN]\textures folder, [SKIN] being the name of the viewer skin you want to add your artwork to.
  3. In the textures folder, find and open the file textures.xml and add the following line: <foo.tga preload="true"/> anywhere between <textures> and </textures>. (Note that you can also use scale_rect values for your texture. For more information, read scale_rect).

The setting preload="true"/> ensures the texture loads on startup.

Using your artwork

To use your artwork, you need to reference it in another xml file. For example:

<icon
         bottom="0"
         follows="left|right|top|bottom"
         height="26"
         image_name="foo.tga" 
         left="0"
         scale_image="true"
         width="100" />

or

<button 
       bottom="0"
       font="SansSerif"
       height="20"
       image_disabled="foo3.tga"
       image_disabled_selected="foo4.tga"
       image_overlay="icn_foo.tga" 
       image_selected="foo.tga" 
       image_unselected="foo2tga" 
       label="foo"
       left="0"
       name="foo"
       tool_tip="Show foo" /> 

Any combination of image_* parameters can be used for buttons, and using your texture as an icon in its own panel is an easy way to create your own backgrounds for UI elements.