m
sp
m (→Getting our hands dirty: Included another external example of tab implementation. (CT_ExpenseHistory).) |
m (sp) |
||
| Line 7: | Line 7: | ||
You probably know these from the Character or Friendsframe windows in WoW. With Tabs you have the ability to store multiple windows inside of a single one. Tabs are a very important feature in UI design, since their introduction in early [[Mac|MacOS]] they became kind of a pseudo-standard in recent graphical applications, such as Mozilla Firefox. | You probably know these from the Character or Friendsframe windows in WoW. With Tabs you have the ability to store multiple windows inside of a single one. Tabs are a very important feature in UI design, since their introduction in early [[Mac|MacOS]] they became kind of a pseudo-standard in recent graphical applications, such as Mozilla Firefox. | ||
Unfortunately the amount of code | Unfortunately the amount of code necessary to generate even a simple tabbing system in WoW is quite large. However, the guys at Blizzard implemented an easy-to-use library that makes the task of handling tabs a whole lot more comfortable. | ||
= The Theory behind it = | = The Theory behind it = | ||
| Line 259: | Line 259: | ||
You know what that means, don't you? Go ahead and fire up WoW right now (you should outcomment the myButtonHandler() call in the template to avoid errors). You will notice that your tabs are already working just fine! Beside one little thing: They don't do anything yet! | You know what that means, don't you? Go ahead and fire up WoW right now (you should outcomment the myButtonHandler() call in the template to avoid errors). You will notice that your tabs are already working just fine! Beside one little thing: They don't do anything yet! | ||
In your Lua button handler (the one I left for an exercise), you probably already know what to do: Extract the number of the selected tab from the button's name which was passed as a parameter ('''this:GetID()'''), then show the UI elements of the new tab and hide all of the other UI elements. Shouldn't be any problem now, since all of the hard work is already done by the library. So rather than boring you with the details of the implementation, | In your Lua button handler (the one I left for an exercise), you probably already know what to do: Extract the number of the selected tab from the button's name which was passed as a parameter ('''this:GetID()'''), then show the UI elements of the new tab and hide all of the other UI elements. Shouldn't be any problem now, since all of the hard work is already done by the library. So rather than boring you with the details of the implementation, I'll close with some tips on efficient techniques for writing button handlers: | ||
* Always wrap up your tabs inside of | * Always wrap up your tabs inside of separate Frame-tags. Thus you'll only have to hide that very frame once, instead of iterating through every single UI element and hiding it by hand. | ||
* Use a string table that contains the names of these frames. Thus you can iterate through the table with a single for loop, instead of writing hundreds of lines. Your code becomes a whole lot more clear, making maintenance so much easier | * Use a string table that contains the names of these frames. Thus you can iterate through the table with a single for loop, instead of writing hundreds of lines. Your code becomes a whole lot more clear, making maintenance so much easier | ||
* Notice that you can also change the background textures when switching tabs. This is done a lot in WoW and is extremely useful when you have very different UIs in the various tabs | * Notice that you can also change the background textures when switching tabs. This is done a lot in WoW and is extremely useful when you have very different UIs in the various tabs | ||