Trillian Astra Custom Skin
From TrillWiki
A Custom Window skin differs from a complete skin in that only one window type is skinned. When you load a Custom Window skin, it replaces only one window type, not the whole skin. A custom skin might be a Contact List, which would mean when you load the skin, it would replace the current contact list with the one in the Custom Window skin, however all other windows (message windows, etc) would remain as they were.
Custom Window skin types can be: [ContactList], [PrivMsg], [Channel], [Console], [FileTransfer] or [Container].
Contents |
[edit] Introducing "Custom Base"
Custom Base is the skin this tutorial will be based around. Custom Base is a custom window Contact List skin.
| Download Custom Base |
The Custom Base skin is structured the same as the complete version of this skin. I have purposely done this so that when you progress onto creating a full skin, it's all very familiar.
[edit] Same Skin, New Way
Essentially the end result of this part of the tutorial is the same as in the Simple Custom Window Skin tutorial. It differs though, in that we will break the skin into many different parts making it a lot easier to modify at a later date, and at the same time introducing you to the "big picture" - basically how the full skin is structured.
[edit] Break It Up!
So what do we want to do with the skin? Unlike the simple version of the skin, we are going to seperate the different parts into different files. This means we'll want to put the controls in one file, and the actual window structure into another file, and we might even want to break it down even further than that.
The skin we created in the first Simple Custom Window tutorial looked like this:
- simple\
- trillian.xml
- desc.ini
- simplewindow.png
- hide.png
- preview.png
The skin for this part of the tutorial will include the following files:
- Custom Base\
- desc.ini
- iconpackentities.dtd
- preview.png
- trillian.dtd
- trillian.xml
- graphics\
- A whole bunch of graphics
- xml\
- files.xml
- common\
- A bunch of xml files
- controls\
- A bunch of xml files
- layout\
- A bunch of xml files
It's a whole lot more complex now isn't it! Why make it more complex?
What might look more complex here actually simplifies things when applied to a full skin. By breaking things down to their own sections it a lot easier than searching through one large file for the one thing you want to change.
With this skin, if you wanted to change the layout of the skin, you would look for the appropriate file in the xml\layout directory.
[edit] The Differences
What you learnt in the Simple Custom Window tutorial is all the same for this tutorial as well. The method is exactly the same, it's just implemented slightly different!
Instead of having all the xml in on big file, this skin has broken all the pieces apart. For a simple Custom Window skin it might seem a little on the overkill side, but your simple Custom Windows can become quite complex, so in the end what appears to be a more complicated way of doing things will make your life a whole lot easier in the end.
The actual window layout for this skin is located in the \xml\layout directory. So if you were moving any buttons etc, you would look in this file.
If you wanted to modify the graphics for an item, you would first make sure the graphics file is listed in the \xml\files.xml file and then you would edit the file in the \xml\controls\ directory that corresponded with what you wanted to achieve. For example, things like the close button, hide button, and minimize button can all be found in the \xml\controls\globalcontrols.xml file.
[edit] The Projects
I will break down each section as much as possible to simplify things. As we're working with the contact list only, things shouldn't get too complex!
- 0. Preparing To Skin
- 1. A tour of the Custom Base skin
- 2. Moving a Button
- 3. Adding a button
- 4. Designing a new button and adding it
- 5. Adding a menu
- 6. Sidebar Magic
- 7. Adding Real Curves
- 8. A new look
- 9. Adjusting the Resize zones
- 10. Adding Search Functionality
- 11. Add an ID Panel
- 12. Alternate graphics for Docking
- 13. The List-Item control!
- 14. Working with variables
