WoW:User interface customization guide: Difference between revisions

m
Move page script moved page User interface customization guide to WoW:User interface customization guide without leaving a redirect
m (Move page script moved page User interface customization guide to WoW:User interface customization guide without leaving a redirect)
 
(33 intermediate revisions by 26 users not shown)
Line 1: Line 1:
This is based on slouken's post on the official beta UI forums.
This '''user interface customization guide''' is based upon [[slouken]]'s post on the official Beta UI forums ''(a long time ago in a galaxy far, far away)''.


== World of Warcraft Interface Customization Guide ==
== World of Warcraft user interface customization guide ==
The interface of ''World of Warcraft'' is built from XML files, which describe the look and layout, and lua files, which contain scripting functionality. This document is a short introduction into modifying these files to customize your interface. Customizing the interface is a very technical endeavor, (although Lua is an extremely simplistic language, comparitively speaking) and you should not attempt it unless you have a good working knowledge of XML and Lua.


The interface of World of Warcraft is built from XML files which describe the look and layout, and lua files which contain scripting functionality. This document is a short introduction into modifying these files to customize your interface. Customizing the interface is a very technical endeavor, and you should not attempt it unless you have a good working knowledge of XML and Lua.  
No official support exists for modifying the WoW interface. If you break it, you get to keep both pieces. =)


There is no official support for modifying the WoW interface. If you break it, you get to keep both pieces. :)
With that said, there are a number of websites devoted to user interface customization (add-ons) available, such as [http://www.wowinterface.com/ WowInterface] and [http://www.curse.com Curse]. These sites have customized interfaces and add-ons for almost every conceivable need, so it is extremely unlikely that you will need to create an add-on from scratch yourself. If you find an Add-on suitable for your needs from one of these sites, you will find using them much easier than attempting to create a new add-on yourself.


To start fresh, unpack Interface.zip in your World of Warcraft folder, so it creates a new directory called "Interface". This directory will override any built-in user interface. To remove all customized UI, just remove the Interface directory. Be sure that you never remove the Interface directory in Data\, only remove the toplevel Interface directory you created when you unpacked Interface.zip.  
To get started, download the [http://us.blizzard.com/support/article.xml?articleId=21466 World of Warcraft Interface AddOn Kit] and use that application to extract both User Interface Data & User Interface Art. This creates three new directories called:
"Blizzard Interface Data (enUS)"
"Blizzard Interface Art (enUS)"
"Blizzard Interface Tutorial".


When the game is updated, your customized files will not be modified, which means that you'll need to get an updated version of Interface.zip and apply your changes to the new files.  
The art folder contains all of the graphics used in the built-in UI. They are generally [[BLP_files|BLP files]], which are a simple container DirectX-formatted texture data. The [[BLP_files|BLP files]] page lists several tools for converting between BLP and other image formats.


Before you report a bug in the interface, move your custom interface directory out of the way, to make sure the bug occurs in the unmodified game.  
The data folder contains all of the [[Lua]] and [[XML]] files which are used to describe and program the UI.  Editing these files will not do anything - they are there to show you how the Blizzard UI works, and a reference for examples of algorithms, syntax, using the game API and much more.


== XML Layout ==
The Blizzard Interface Tutorial is where you start.  After you complete the tutorials, you should have enough knowledge to create a basic addon.  From your addon, you can make whatever changes to the Blizzard UI that you want.


The files containing the layout for the game user interface can be found in Interface\FrameXML  
== XML layout ==
The file "FrameXML.toc" contains a list of XML files to load when you enter the game. The files listed are loaded in order. Any errors that occur when loading the files are written to FrameXML.log in the toplevel directory.  
The files containing the layout and scripts for the game user interface can be found in Blizzard Interface Data\FrameXML.


Each XML file typically describes one element of UI on the screen. To get a feeling for the syntax, take a look at the files provided. The XML files strictly adhere to the XML 1.0 standard. For those lucky enough to have access to a syntax checker, the file UI.xsd contains the schema used by the WoW interface.
The FrameXML.toc file is a plain text file and contains a list of Lua and XML files to load at login. The files are loaded in the order they're listed and any load errors are written to FrameXML.log in the game's Log folder.


== Lua Scripting ==
In your own addons you will also have a .toc file which performs the same function for your own code. You will list your Lua and XML files in it and they will be loaded during login. Errors which occur while loading your addon will also be written to the FrameXML.log file.


All of the functionality in the interface is provided through Lua scripting.  
Each XML file describes a collection of UI elements and Blizzard separates their XML files into functional modules. You will find files for the GameTooltip, ActionBarFrame, ReadyCheck, and everything else in the built-in UI. The Blizzard XML and Lua files make a great reference for understanding how to develop an addon.
The manual for Lua 5.0 is available online at:
http://www.lua.org/manual/5.0/


For more concise help, topic-specific Lua tutorials can be found at:
The XML files strictly adhere to the XML standard and if your text editor supports XML syntax checking, the file UI.xsd in the FrameXML folder contains the schema used by the WoW interface.
http://lua-users.org/wiki/TutorialDirectory


Lots more details here: [[XML User Interface]].
== Lua scripting ==
All of the functionality in the interface is provided through Lua scripting. It is also possible to create any layout that is possible with the XML markup in pure Lua scripting.
The manual for Lua 5.1.4 (http://www.lua.org) is available online at http://www.lua.org/manual/5.1.
For more concise help, topic-specific Lua tutorials can be found at: http://lua-users.org/wiki/TutorialDirectory.


The best way to become familiar with the way Lua is used to script the interface is to look at the scripts in the XML files, denoted by the <script> tag, and to browse the lua files. The lua files typically contain functions which are used by the corresponding XML files.
The best way to become familiar with the way Lua is used to script the interface is to look at the scripts in the XML files, denoted by the <script> tag, and to browse the lua files. The lua files typically contain functions which are used by the corresponding XML files.


== Getting Started ==
As a reference, the [[World of Warcraft API]] page contains a (almost) complete list of available API functions in ''World of Warcraft''.  When you want to figure something out, this is the first page you should turn to.  Also the [[Widget API]] page contains an overview of the methods that are available when dealing with objects of the user interface — like action buttons or unit frames. Feel free to play around with the <tt>print()</tt> function to try out the various API functions.


A good place to start getting familiar with the interface is the file BasicControls.xml  
For example type this into the game chat:
/run print(GetLocale());
GetLocale() is an API function.  It returns the client locale  ("enUS" for English clients, "deDE" for German clients, etc).  Print() then prints that value into the default chat window. 
Your addons are loaded after the Blizzard files, so your addon can overwrite or change any Blizzard UI.  For example, you could create an addon with one line of code:
MailFrame:Show()
MailFrame is the name of a Blizzard Frame, created in Blizzard Interface Data/FrameXML/MailFrame.xml.  Anyframe:Show() will make that frame appear, even if you are nowhere near a mailbox.  Type /run MailFrame:Show() in game to accomplish the same thing.
 
 
== Getting started ==
A good place to start getting familiar with the interface is the file BasicControls.xml.


At the top of this file is a script block which contains the function _ERRORMESSAGE(), which is called whenever an error occurs in your script. This function pops up a window with the error message. Another function is defined there, message(), which just pops up the error window with the argument to the function.  
At the top of this file is a script block which contains the function _ERRORMESSAGE(), which is called whenever an error occurs in your script. This function pops up a window with the error message. Another function is defined there, message(), which just pops up the error window with the argument to the function.  
Line 40: Line 58:
Further on in the file a few textures are defined in XML. They have the "virtual" attribute, which means that they are not actually created, only stored definitions to be inherited later. After that a frame, or widget, called "DialogBoxFrame" is defined. This frame is also virtual, and contains an anchor which defines how it's positioned relative to its parent, a background, and a child button which just hides the dialog when it's clicked.  
Further on in the file a few textures are defined in XML. They have the "virtual" attribute, which means that they are not actually created, only stored definitions to be inherited later. After that a frame, or widget, called "DialogBoxFrame" is defined. This frame is also virtual, and contains an anchor which defines how it's positioned relative to its parent, a background, and a child button which just hides the dialog when it's clicked.  


Each frame consists of a number of layers, each of which can contain any number of textures and fontstrings. Each texture and fontstring must be anchored and sized so they are visible. The numbers used for anchor offsets and sizes are values in pixels.  
Each frame consists of a number of layers, each of which can contain any number of textures and font strings. Each texture and font string must be anchored and sized so they are visible. The numbers used for anchor offsets and sizes are values in pixels.  


At the end of the file we define an actual frame called "ScriptErrors" which inherits the dialog box we defined previously. This is the frame which is shown in the message function at the top of the file.
At the end of the file we define an actual frame called "ScriptErrors" which inherits the dialog box we defined previously. This is the frame which is shown in the message function at the top of the file.


== How Does It Work? ==
== How does it work? ==
 
The very first frame that is created is the WorldFrame. This frame is required, and is where the game world renders. The next frame that is created is the UIParent frame. This frame manages all the rest of the user interface, and allows it to be hidden separately from the world. This is how we get screenshots without the interface visible. :)  
The very first frame that is created is the WorldFrame. This frame is required, and is where the game world renders. The next frame that is created is the UIParent frame. This frame manages all the rest of the user interface, and allows it to be hidden separately from the world. This is how we get screenshots without the interface visible. :)  


Whenever a frame, texture or fontstring is defined in XML, its initial attributes are defined and it is added to the lua namespace as an object of the appropriate type. Each type of object has member functions that modify that object. This is how we show the error dialog frame from script.  
Whenever a frame, texture or font string is defined in XML, its initial attributes are defined and it is added to the lua name space as an object of the appropriate type. Each type of object has member functions that modify that object. This is how we show the error dialog frame from script.  


Each frame has a set of script handlers which are called under certain conditions. For example, UIParent has OnLoad, which is called immediately after the frame is loaded, OnEvent, which we'll get to later, OnUpdate, which is called every time the world is updated, and OnShow, which is called whenever the frame is shown.  
Each frame has a set of script handlers which are called under certain conditions. For example, UIParent has OnLoad, which is called immediately after the frame is loaded, OnEvent, which we will get to later, OnUpdate, which is called every time the world is updated, and OnShow, which is called whenever the frame is shown.  


The OnEvent handler is special. This is the handler that allows the game to communicate with the interface. World of Warcraft is designed so that it needs to know very little about the interface. Instead of calling directly into the interface, whenever something interesting happens, it generates an event. Each frame registers for events that it is interested in, and when those events happen, the OnEvent handler is called for that frame.  
The OnEvent handler is special. This is the handler that allows the game to communicate with the interface. ''World of Warcraft'' is designed so that it needs to know very little about the interface. Instead of calling directly into the interface, whenever something interesting happens, it generates an event. Each frame registers for events that it is interested in, and when those events happen, the OnEvent handler is called for that frame.  


Having the UI respond to events wouldn't be very useful if the interface couldn't affect the game in return. The game provides a wide array of functions to query information and change game state. Examples of using these functions are throughout the provided lua files.  
Having the UI respond to events wouldn't be very useful if the interface couldn't affect the game in return. The game provides a wide array of functions to query information and change game state. Examples of using these functions are throughout the provided lua files.  


== Tips and Tricks ==
== Tips and tricks ==
''World of Warcraft'' supports dynamically '''reloading the user interface'''. At any time, you can modify the XML and Lua files and then reload them by typing any of the following slash-commands in the chat edit box:


World of Warcraft supports dynamically reloading the user interface. At any time you can modify the XML and Lua files and then reload them by bringing down the console (pressing ~) and typing "reloadUI". If there were syntax errors in loading, you can just edit, fix, and reload.
* <code>/console reloadui</code>
* <code>/script ReloadUI()</code>
Some (developer-) addons also register their own commands to reload the ui, they are usually short and so more convenient for development. Just try them out to see if they are available.
* <code>/rl</code> (from Ace-Console)
* <code>/rld</code>
* <code>/reloadui</code>


''Note'': Nowadays, you will need to use the command /console reloadui (or /rl if you are using Cosmos).
--[[User:Sarf|Sarf]] 06:14, 13 Nov 2004 (EST)


If you're not sure what's happening in the script, use the message() function to print a message and view variables. Once the dialog is shown, your script keeps on executing, but no other message() calls will show anything until you click the button to dismiss the dialog.  
If you are not sure what is happening in a script, '''use the [[API print|print()]] function to print a message into the default chat frame'''. This function is extremely forgiving and will print any variable.


Feel free to experiment. If you break something, starting fresh is really easy. If you have questions, look on the forums to see if other people have already figured out the answers. Occasionally, Blizzard staff will be available to answer scripting questions - we value your feedback!  
Feel free to experiment. If you break something, starting fresh is really easy. If you have questions, look on the forums to see if other people have already figured out the answers. Occasionally, Blizzard staff will be available to answer scripting questions we value your feedback!


== Conclusion ==
== Conclusion ==
The interface files are provided for your enjoyment, and are not supported in any way. That said, we hope that ''World of Warcraft'' provides a robust and flexible system for custom interfaces.
== See also ==
*[[UI Questions]]
*[[Interface Customization]]


The interface files are provided for your enjoyment, and are not supported in any way. That said, we hope that World of Warcraft provides a robust and flexible system for custom interfaces.
[[Category:Interface customization]]
Anonymous user