ArtAssetID's - Detailed List & Info
This is the "Start" of a Detailed List of all the available ArtAssetID's that can be reskinned in the UI. The list is set inside code for easy copy & pasting, as well as categories being described in detail for a better understand of what they are and where they go.
Bottom Bar (1024 x 85)
This is the Main Bar "Skin", which is pretty much the largest "constant" graphic in the UI.
Auto Attack Button/Icon
This is the Large Circular "Indicator" for Attack or Combat On/Off, which is reskinnable to better adapt to the Bottom Bar. There are multiple "versions" which handle Mouseover, Highlighting, Pressed, and Normal versions...which behaves much like a common interface button.
System Buttons & Bag Buttons
System Buttons are the buttons on the "left" side of the Bottom Bar, and control multiple game options (all are set to hotkeys), and the Bag Buttons are on the "right" side of the Bottom Bar. All buttons have elements for Normal, Mouseover, and Pressed version to behave like common interface buttons.
The Bags are in this order on your screen:
Bag4 -> Bag3 -> Bag2 -> Bag1 -> BagInv
So they number right to left instead of left to right. Also, you will notice at the "bottom" of the listing for Bags are 5 seperate "Bag" ArtAssets...which are associated with the Bag Images you see on the actual Inventory Windows when you open them. Numbers are the same for the Buttons if you're wondering which bags are which.
Note: On the System Buttons, the "Highlight" version of the crafting button is the same as the "Rollover" (or mouseover) version for all the others. I do not know why it is not tagged the same...Frosty, maybe something that can be fixed for consistancy?
Main Box Outline & Main Box Title Bar
These Elements handle pretty much every "Common" window skin you'll find in your interface. It is, essentially, the Border that wraps the window, as well as the Title Bar that is centered at the top of each window.
Note: The "noadorn" version of the corner pieces are the attributes for corner "decoration", which is optional. Only some windows show the decoration, so if you're new to skinning, it's not going to hurt to skip it. Just use your common corner piece as a substitute. If you leave it blank, it will default to the default corner piece, which will not match your skin.
Main Box Close Button
This is literally that little "X" close button at the top right of every window. Design to match your Main Box Outline skin.
Instant Message Button
This element is the button on your IM window. Multiple elements for Ghost & Normal versions, as well as Mouseover, Normal, and Pressed versions of each. Behaves like a common interface button.
Universal UI Tabs (Normal and Small)
These elements are the common Tabs you see in multiple UI windows (ie. Character Window, Crafting Window, etc.). Normal are the Upper Tabs that are a little larger (ie. Vendor Top Tabs such as Buy, Sell, etc.), and Small are the Lower Tabs that are slightly smaller (ie. Passive Skills Tab, War Tab, etc.) They have behavior version for Front & Back (Active and Unactive essentially) and Normal/Mouseover/Pressed variations which behave like common interface buttons.
Main UI Button
This Element is the actual Menu Buttons common on almost every window. Ghost & Normal version, with Normal/Mouseover/Pressed behavior tags. These are seen everywhere, from your Options Menu, to your Main Menu, and more.
As expected from the title, this is the border you see around the Tooltip, pieces and locations indicated well from the ID tags.
Chat Elements include "almost" everything needed to modify the Chat Window. You can modify the Tabs (which behave like UI Tabs explained above), the background of the Text Entry section (Chat Back and Chat Entry Focused...Focused meaning active with cursor). The "Unread Overlay" is the little * you see when a window gets a message and it isn't currently in "front".
Mail "Item" Backgrounds
When you get mail, the actual "background" of the Mail Item is skinnable (why...I can't figure out...lol). I was basically tinkering around and wondered what these tags were. Careful with these, you cannot modify the text in these windows, so your skin has to coincide with Turbines Text colors for legibility. I wouldn't even really consider these important or even necessary to skin. They behave like common interface buttons.
Auction Money Panel
This is the Panel that your Currency Amount shows on the Auction House window. You can skin this (although like the mail, I don't know why). However, you -cannot- skin the Currency Panel in your Character Window.
These are miscellaneous elements I've managed to locate.
Inanimate Panel: This is the square targeted Unit Frame for things like Doors, Resources, and World Elements that are not PC's or NPC's.
Panel Border: This is the "Thin" interior border seen inside Windows such as the Character Window and Options Window.
Options Panel Divider: This is the Header for each "Section" of the Options window. Each specific portion has a large Text Header, which actually has a Skin Element that you can match to your Main Box Outline.
Note For Tabs: The "E", "N", and "W" elements to the Tabs are East, North, and West respectively. They are actually:
East = Right / North = Middle / West = Left
Each Image is different, for instance the base UI has rounded edges on E and W, and a solid portion for N, which creates the tab-look. These can be anything you want, so be creative!
This is nice! Good work!
Thank you very much for this Taffu. I've moved it over to this forum and stuck a pin in it. Nice work. :)
Thanks for moving it to the appropriate forum, Cairenn. Added the Tooltip Border today, and I'm working on figuring out a few of the others and exactly how they work...should be able to add them by this weekend ;)
Hi Taffu, very very helpful post of the .xml.
Turbine's article on this also included a .jpg of the .xml, and I note that there are some entries in that .jpg that weren't included in the article's text table/description of the elements (the ArtAssetID Dictionary section of the article) and/or weren't in your top post.
I went ahead and compared the .jpg and article text and came up with these as missing, so if they don't actually 'break' anything, feel free to merge these in your top post.
Dug up Cairenn's repost of the original closed beta UI skinning instructions, and I see there is mention of another element LetterBoxBottom. If that's still a valid element (edit: nvm, the only confusion I have now is about proper dimensions for this element. I see two or three different values for x posted), then:
The use of /> instead of ></Mapping> is proper syntax in an XML formate. It is just a short hand version. If you use all /> instead the file will be a little small.. but that would not really make any difference to uploading the UI on log in.
Great post. This should help me out a bit on making my first skin.
I'm working on a skin and I've been referencing some of the pre-existing skins on this site to teach myself how.
I've found that every skin I've looked at is missing an image to highlight a selection when at the stablemaster. The normal image (example), which I believe is the "blue_selection_vendor_item_repair_normal" 366 x 64 image, appears in every skin . But I'm unable to find an ArtAssetID that will enable me to change the highlight and highlight active for selections at the stables (example).
I've spent the better part of the last 4 hours searching this site and these forums trying to find if anyone else has found an ArtAssetID for this. I'm not having any luck. Is there any chance someone could point me in the right direction?
that is one of the "missing" artassets we are patiently awaiting frosty to get us.
|All times are GMT -5. The time now is 12:33 PM.|
vBulletin® - Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.