I thought I'd take a break from my typical rants and raves about raiding etiquette and strategy to toot my own horn for a bit.
If you recall far enough back in my blogging career you may remember a post entitled Hello World: Your First AddOn. I decided not to follow up on that particular topic because, well, programming is not or everyone and isn't near as widely useful as much of the raiding topics that I tend to post on this blog. For me personally, I do enjoy the occasional visitation to the land of computer logic!
I am by no means an expert programmer, but I do know my way around basic computer logic and I've found many ways to apply that knowledge to AddOn authoring in WoW. My mods tend to be very lightweight and simplistic... but they do the job and do it well. And they do it without all the overhead added by all the bells and whistles of many more popular mods that perform the same task.
ChannelManager
ChannelManager is my most recent AddOn, being published for the first time the same day as this blog entry... and takes care of a very simple yet, in my opinion, highly valuable task. I tend to write mods that automate certain things that slip by under the radar and this mod is a perfect example of such.
What it does, simply put, is ensure that you are always in the channels you designate you want to be in. I don't know how many times my channels have mysteriously disappeared silently and I've only found out halfway through a raid when I've already missed some important discussion in a healing or tanking channel. The aim of this mod is to make sure this situation never happens again by automatically rejoining any channels you've lost.
LDB_AnkhTimer
Formerly known as StatBlock_AnkhTimer, this is an LDB plugin that displays your Ankh count (if you aren't glyphed to remove the reagent cost) and the time left until Reincarnation finishes it's cooldown.
BlueButtons
Truth be told, BlueButtons is not even really an AddOn.
In point of fact BlueButtons is a skin for the default interface. Meaning instead of code being run in game the files in BlueButtons overwrite the files used by the default interface to change the appearance of the red interface buttons to a Wrath of the Lich King themed blue.
Readiness
Readiness was born in a time when the ready check sound was a very quiet drum sound effect. What it does is provide an interface for you to choose a custom sound file to play for ready checks.
The mod comes loaded with a host of custom sounds, more of which can be added by modifying the config section in the mods lua file.
WoWGate
WoWGate has no configuration and works right out of the box. What it does is play a sound effect when a mage in your group or raid opens a portal. The sound effect also plays when a Death Gate opens if you are a Death Knight.
OobieUI
Last, but certainly not least is my complete UI, ready for download by any interested party!
I can't claim each and every mod in this compilation is mind - not by a long shot - but many of them have been modified to work slightly differently than they do out of the box in keeping with how I've set my UI up to work.
Many of the mods come ready to use as much of my interface's configuration is done in the actual lua files, but most mods that aren't have a profile names Oobiedoo - Ysera that can be enabled to import my settings.
Showing posts with label AddOn authoring. Show all posts
Showing posts with label AddOn authoring. Show all posts
Saturday, June 12, 2010
Oobie's AddOn Roundup
Labels:
AddOn,
AddOn authoring,
interface,
UI
Monday, January 4, 2010
Blue Buttons: Making Your Interface look "Cool"
I recently posted a new "mod" that some folks on wowinterface.com are thoroughly enjoying. I hesitate to call it a mod, however, because there's no code, no AddOn to enable or disable, and the amount it interacts with the rest of the interface is minimal.
What is it? Blue Buttons.
Less of a mod and more of a skin, Blue Buttons simply provides a host of textures that skin the blizzard interface buttons to be a different color. I've long detested the "angsty red", as OarisJM posted, and liked the idea of changing the skin to be something different. I'd sifted through a handful of UI compilations at one point in search of a skin for the entire interface, but what I found were either incomplete panel skins or button skins that looked out of place against the rest of the UI textures.
So I set out with a simple goal: skin the in game interface buttons to be blue, like those found on the login screen. The solution is rather simple, and can be accomplished easily with just a few free tools. My version of the blue buttons is posted at the link above, ready for download, but what if you want the buttons to be green? or orange for cataclysm?
The following tutorial will show you how.
First, you'll need to download a few Programs:
Once you have all those things go to your WoW directory and you should find an interface art folder that the Custom UI Toolkit left for you.
Inside that folder open the BUTTONS folder and copy the file named UI-Panel-Button-Up.blp to the folder with the BLPConverter in it.
Next, right click a blank space in the same folder and create a new text file named whatever you like (for this one I use the file name 'topng' since this batch file will convert textures from the blp format to the editable png format). Open the text file and type in the following:
BLPCONVERTER -m UI-Panel-Button-Up.blp
Then save the file as a batch file. To do so, go to File -> Save As. In the save dialog box change the file type to all files and put the extension .bat at the end of the file name.
Once you've got the batch file in your BLP Converter folder double click it and it will briefly flash a command line window as it performs the conversion. Once the command line window disappears you should see a new file in your BLP Converter folder. This is the file we can now edit in Paint Shop Pro.
Next, open the new PNG file in Paint Shop Pro and use the scroll wheel to zoom in on it. Choose the color changer tool from the toolbox (if you can't find a color changer tool it shares a button with the bucket flood fill tool; mousover the bucket icon and click the arrow beside it to get a drop down and select the color changer tool).
Now, with the color changer tool selected you can click on the red background to change the color of the button. Make sure to set your foreground color on the upper right corner of the screen. The RGB values I use for the Blue Buttons are: red 38, green 66, blue 143. If you accidentally color the wrong section the key combination ctrl+z is a quick way to undo your last change. As a side note when editing the remaining textures later on, I came across a texture or two that didn't cooperate with the color changer tool as well. For these textures you may have to experiment with coloring different regions of the image to get the desired effect.
Feel free to play around with different colors but keep in mind that any text placed over the button will come up yellow, so if you use the wrong color you may not be able to see what the button actually says! Once you're satisfied with how your new button looks save the file.
The next step is to make another batch file just like the one above with one exception: change the .blp extension to .png so your new batch file should look like this:
BLPCONVERTER -m UI-Panel-Button-Up.png
I name this one 'toblp'. Regardless of what you name your batch file, make sure to get the old blp file out of the folder before you convert (to prevent corruption of the file) by either deleting it or, preferably, moving it to another folder for backup purposes.
That's it!
Now that you've successfully skinned the button you can add it to your interface. To do so, copy it it your WoW directory under Interface\Buttons. If the folder is not there go ahead and create it. What happens in game is that WoW loads and extracts all these textures from it's MPQ files to a hidden directory in Interface\Buttons. You can't see these directories, but while the game is loaded they are effectively there. By creating a skinned button with the same name and placing it in the same directory our skinned button takes precedence over the default textures. This works for any texture you can find in the interface art folder created by the Custom UI Toolkit.
OK, so I lied. That's not completely 'it'. There are actually a ton of files you would need to skin like above to get the desired effect on all the UI buttons. Conveniently enough, all of the buttons that you'd need to skin are located in the same Buttons folder in interface art:
CancelButton-Down.blp
CancelButton-Highlight.blp
CancelButton-Up.blp
UI-DialogBox-Button-Down.blp
UI-DialogBox-Button-Highlight.blp
UI-DialogBox-Button-Up.blp
UI-MinusButton-Down.blp
UI-MinusButton-Up.blp
UI-Panel-BiggerButton-Down.blp
UI-Panel-BiggerButton-Up.blp
UI-Panel-Button-Down.blp
UI-Panel-Button-Highlight.blp
UI-Panel-Button-Up.blp
UI-Panel-CollapseButton-Down.blp
UI-Panel-CollapseButton-Up.blp
UI-Panel-ExpandButton-Down.blp
UI-Panel-ExpandButton-Up.blp
UI-Panel-HideButton-Down.blp
UI-Panel-HideButton-Up.blp
UI-Panel-MinimizeButton-Down.blp
UI-Panel-MinimizeButton-Highlight.blp
UI-Panel-MinimizeButton-Up.blp
UI-Panel-QuestHideButton.blp
UI-Panel-SmallerButton-Down.blp
UI-Panel-SmallerButton-Up.blp
UI-PlusButton-Down.blp
UI-PlusButton-Hilight.blp
UI-PlusButton-Up.blp
UI-ScrollBar-ScrollDownButton-Highlight.blp
UI-ScrollBar-ScrollUpButton-Highlight.blp
Additionally, you'll need to edit your batch files (right click the batch file icon -> Edit) in order to convert the entirety of the files for skinning. You can add as many files as you want for skinning with the same batch file, simply tack another name on to the end of the line with a space in between each file name. For ease of conversion I'm including the full batch files i use below for your copy and pasting pleasure. Happy skinning!
toblp.bat
BLPCONVERTER -m CancelButton-Down.png CancelButton-Highlight.png CancelButton-Up.png UI-DialogBox-Button-Down.png UI-DialogBox-Button-Highlight.png UI-DialogBox-Button-Up.png UI-MinusButton-Down.png UI-MinusButton-Up.png UI-Panel-BiggerButton-Down.png UI-Panel-BiggerButton-Up.png UI-Panel-Button-Down.png UI-Panel-Button-Highlight.png UI-Panel-Button-Up.png UI-Panel-CollapseButton-Down.png UI-Panel-CollapseButton-Up.png UI-Panel-ExpandButton-Down.png UI-Panel-ExpandButton-Up.png UI-Panel-HideButton-Down.png UI-Panel-HideButton-Up.png UI-Panel-MinimizeButton-Down.png UI-Panel-MinimizeButton-Highlight.png UI-Panel-MinimizeButton-Up.png UI-Panel-QuestHideButton.png UI-Panel-SmallerButton-Down.png UI-Panel-SmallerButton-Up.png UI-PlusButton-Down.png UI-PlusButton-Hilight.png UI-PlusButton-Up.png UI-ScrollBar-ScrollDownButton-Highlight.png UI-ScrollBar-ScrollUpButton-Highlight.png
topng.bat
BLPCONVERTER -m CancelButton-Down.blp CancelButton-Highlight.blp CancelButton-Up.blp UI-DialogBox-Button-Down.blp UI-DialogBox-Button-Highlight.blp UI-DialogBox-Button-Up.blp UI-MinusButton-Down.blp UI-MinusButton-Up.blp UI-Panel-BiggerButton-Down.blp UI-Panel-BiggerButton-Up.blp UI-Panel-Button-Down.blp UI-Panel-Button-Highlight.blp UI-Panel-Button-Up.blp UI-Panel-CollapseButton-Down.blp UI-Panel-CollapseButton-Up.blp UI-Panel-ExpandButton-Down.blp UI-Panel-ExpandButton-Up.blp UI-Panel-HideButton-Down.blp UI-Panel-HideButton-Up.blp UI-Panel-MinimizeButton-Down.blp UI-Panel-MinimizeButton-Highlight.blp UI-Panel-MinimizeButton-Up.blp UI-Panel-QuestHideButton.blp UI-Panel-SmallerButton-Down.blp UI-Panel-SmallerButton-Up.blp UI-PlusButton-Down.blp UI-PlusButton-Hilight.blp UI-PlusButton-Up.blp UI-ScrollBar-ScrollDownButton-Highlight.blp UI-ScrollBar-ScrollUpButton-Highlight.blp
What is it? Blue Buttons.
Less of a mod and more of a skin, Blue Buttons simply provides a host of textures that skin the blizzard interface buttons to be a different color. I've long detested the "angsty red", as OarisJM posted, and liked the idea of changing the skin to be something different. I'd sifted through a handful of UI compilations at one point in search of a skin for the entire interface, but what I found were either incomplete panel skins or button skins that looked out of place against the rest of the UI textures.
So I set out with a simple goal: skin the in game interface buttons to be blue, like those found on the login screen. The solution is rather simple, and can be accomplished easily with just a few free tools. My version of the blue buttons is posted at the link above, ready for download, but what if you want the buttons to be green? or orange for cataclysm?
The following tutorial will show you how.
First, you'll need to download a few Programs:
- Custom UI ToolKit: This is Blizzard's own custom UI toolkit, although it's not so much a toolkit as a set of resource files. Once you download it, run the installer and tell it to install the interface art. You can have it install the interface data as well if you like, but those files are not necessary for this tutorial.
- BLP2PNG: Blizzard uses the file extension blp for it's textures, but this isn't an easily edited format, so to convert the files into something we'll be able to edit we need this command line software. It come in a zip file and doesn't need to be installed. Simply extract the folder to some place you can get to easily like your desktop. NOTE: If you are working on a system whose desktop does not reside on the hard drive(for instance if you are on a computer that is part of a domain and uses roaming profiles) you'll want to place this in a location on the hard drive like the root of your C: or system drive.
- Paint Shop Pro free trial: This is the software we'll use to change the color of the buttons. It is a paid program but offers a free 30 day trial. I personally own my copy and have found many miscellaneous uses for it over the years. If you have another photo editing suite that has a color changer tool you may be able to use it instead, just make sure it will change a range of color in a region and not only one contiguous shade.
Inside that folder open the BUTTONS folder and copy the file named UI-Panel-Button-Up.blp to the folder with the BLPConverter in it.
Next, right click a blank space in the same folder and create a new text file named whatever you like (for this one I use the file name 'topng' since this batch file will convert textures from the blp format to the editable png format). Open the text file and type in the following:
BLPCONVERTER -m UI-Panel-Button-Up.blp
Then save the file as a batch file. To do so, go to File -> Save As. In the save dialog box change the file type to all files and put the extension .bat at the end of the file name.
Once you've got the batch file in your BLP Converter folder double click it and it will briefly flash a command line window as it performs the conversion. Once the command line window disappears you should see a new file in your BLP Converter folder. This is the file we can now edit in Paint Shop Pro.
Now, with the color changer tool selected you can click on the red background to change the color of the button. Make sure to set your foreground color on the upper right corner of the screen. The RGB values I use for the Blue Buttons are: red 38, green 66, blue 143. If you accidentally color the wrong section the key combination ctrl+z is a quick way to undo your last change. As a side note when editing the remaining textures later on, I came across a texture or two that didn't cooperate with the color changer tool as well. For these textures you may have to experiment with coloring different regions of the image to get the desired effect.
Feel free to play around with different colors but keep in mind that any text placed over the button will come up yellow, so if you use the wrong color you may not be able to see what the button actually says! Once you're satisfied with how your new button looks save the file.
The next step is to make another batch file just like the one above with one exception: change the .blp extension to .png so your new batch file should look like this:
BLPCONVERTER -m UI-Panel-Button-Up.png
I name this one 'toblp'. Regardless of what you name your batch file, make sure to get the old blp file out of the folder before you convert (to prevent corruption of the file) by either deleting it or, preferably, moving it to another folder for backup purposes.
That's it!
Now that you've successfully skinned the button you can add it to your interface. To do so, copy it it your WoW directory under Interface\Buttons. If the folder is not there go ahead and create it. What happens in game is that WoW loads and extracts all these textures from it's MPQ files to a hidden directory in Interface\Buttons. You can't see these directories, but while the game is loaded they are effectively there. By creating a skinned button with the same name and placing it in the same directory our skinned button takes precedence over the default textures. This works for any texture you can find in the interface art folder created by the Custom UI Toolkit.OK, so I lied. That's not completely 'it'. There are actually a ton of files you would need to skin like above to get the desired effect on all the UI buttons. Conveniently enough, all of the buttons that you'd need to skin are located in the same Buttons folder in interface art:
CancelButton-Down.blp
CancelButton-Highlight.blp
CancelButton-Up.blp
UI-DialogBox-Button-Down.blp
UI-DialogBox-Button-Highlight.blp
UI-DialogBox-Button-Up.blp
UI-MinusButton-Down.blp
UI-MinusButton-Up.blp
UI-Panel-BiggerButton-Down.blp
UI-Panel-BiggerButton-Up.blp
UI-Panel-Button-Down.blp
UI-Panel-Button-Highlight.blp
UI-Panel-Button-Up.blp
UI-Panel-CollapseButton-Down.blp
UI-Panel-CollapseButton-Up.blp
UI-Panel-ExpandButton-Down.blp
UI-Panel-ExpandButton-Up.blp
UI-Panel-HideButton-Down.blp
UI-Panel-HideButton-Up.blp
UI-Panel-MinimizeButton-Down.blp
UI-Panel-MinimizeButton-Highlight.blp
UI-Panel-MinimizeButton-Up.blp
UI-Panel-QuestHideButton.blp
UI-Panel-SmallerButton-Down.blp
UI-Panel-SmallerButton-Up.blp
UI-PlusButton-Down.blp
UI-PlusButton-Hilight.blp
UI-PlusButton-Up.blp
UI-ScrollBar-ScrollDownButton-Highlight.blp
UI-ScrollBar-ScrollUpButton-Highlight.blp
Additionally, you'll need to edit your batch files (right click the batch file icon -> Edit) in order to convert the entirety of the files for skinning. You can add as many files as you want for skinning with the same batch file, simply tack another name on to the end of the line with a space in between each file name. For ease of conversion I'm including the full batch files i use below for your copy and pasting pleasure. Happy skinning!
toblp.bat
BLPCONVERTER -m CancelButton-Down.png CancelButton-Highlight.png CancelButton-Up.png UI-DialogBox-Button-Down.png UI-DialogBox-Button-Highlight.png UI-DialogBox-Button-Up.png UI-MinusButton-Down.png UI-MinusButton-Up.png UI-Panel-BiggerButton-Down.png UI-Panel-BiggerButton-Up.png UI-Panel-Button-Down.png UI-Panel-Button-Highlight.png UI-Panel-Button-Up.png UI-Panel-CollapseButton-Down.png UI-Panel-CollapseButton-Up.png UI-Panel-ExpandButton-Down.png UI-Panel-ExpandButton-Up.png UI-Panel-HideButton-Down.png UI-Panel-HideButton-Up.png UI-Panel-MinimizeButton-Down.png UI-Panel-MinimizeButton-Highlight.png UI-Panel-MinimizeButton-Up.png UI-Panel-QuestHideButton.png UI-Panel-SmallerButton-Down.png UI-Panel-SmallerButton-Up.png UI-PlusButton-Down.png UI-PlusButton-Hilight.png UI-PlusButton-Up.png UI-ScrollBar-ScrollDownButton-Highlight.png UI-ScrollBar-ScrollUpButton-Highlight.png
topng.bat
BLPCONVERTER -m CancelButton-Down.blp CancelButton-Highlight.blp CancelButton-Up.blp UI-DialogBox-Button-Down.blp UI-DialogBox-Button-Highlight.blp UI-DialogBox-Button-Up.blp UI-MinusButton-Down.blp UI-MinusButton-Up.blp UI-Panel-BiggerButton-Down.blp UI-Panel-BiggerButton-Up.blp UI-Panel-Button-Down.blp UI-Panel-Button-Highlight.blp UI-Panel-Button-Up.blp UI-Panel-CollapseButton-Down.blp UI-Panel-CollapseButton-Up.blp UI-Panel-ExpandButton-Down.blp UI-Panel-ExpandButton-Up.blp UI-Panel-HideButton-Down.blp UI-Panel-HideButton-Up.blp UI-Panel-MinimizeButton-Down.blp UI-Panel-MinimizeButton-Highlight.blp UI-Panel-MinimizeButton-Up.blp UI-Panel-QuestHideButton.blp UI-Panel-SmallerButton-Down.blp UI-Panel-SmallerButton-Up.blp UI-PlusButton-Down.blp UI-PlusButton-Hilight.blp UI-PlusButton-Up.blp UI-ScrollBar-ScrollDownButton-Highlight.blp UI-ScrollBar-ScrollUpButton-Highlight.blp
Labels:
AddOn,
AddOn authoring,
BlueButtons,
interface,
tutorial,
UI
Thursday, September 24, 2009
Hello World! - Your First AddOn
It's no secret that I'm a UI nut. I redesign my UI constantly, trying out new mods that will help me react faster, make the UI look more streamlined or just reduce the lag my UI imposes on my computer. One thing that may not be as well known is that I run my own personal AddOn that isn't published on it's own anywhere to help accomplish many trivial things that I don't want to download a bloated AddOn to do.
This AddOn is called OobieUtil and it does everything for me from automatically repairing my gear to rewriting my bandage macro to use the highest bandage available and automatically accepting invites from the guild leader during raid times.
OobieUtil does next to nothing graphically speaking, but it keeps my UI running smoothly - like engine oil as it were. I code into this mod many repetitive or convoluted procedures that clutter up the UI, distract me from the game or just plain annoy me.
To me, OobieUtil is as indispensable as DeadlyBossMods or a good action bar AddOn - I can't imagine playing without it. With a little inscturction anybody can accomplish much of what I do in my utility AddOn, it just takes a bit of copy/paste action and the right resources.
In this first tutorial I'll go over the basics of what you need for an AddOn... the basic infrastructure that you'll need to start coding modifications into your UI to streamline it. Here are some examples of things I do with this utility:
OobieUtil
Note: This tutorial is for Windows PCs, though AddOns for Mac follow the same format some specific instructions in terms of how you interact with your OS may not translate properly.
HelloWorld
If you already know a bit about programming chances are that you've made a "Hello World" program before. It's generally the first program written when learning a new language - but don't let that intimidate you. There are a small handful of programming techniques that will help accomplishing certain tasks in an AddOn but for the most part the WoW API is very user friendly and a great deal of things can be accomplished without advanced programming techniques.
For this tutorial, however, I won't be talking about any techniques, just the framework needed for an AddOn.

The first step is to create a folder for your AddOn. Whatever name you use for the folder will be the name of the AddOn, but for this tutorial we'll stick with 'HelloWorld'.
Next you'll want to open Notepad or another text editor of your choice. Stay away from Office products when editing AddOn files, though. They tend to add unnecessary formatting tags that could cause your AddOn to not work properly. My own personal favorite is Notepad++.
Type or copy/paste the following into your text editor of choice:

Next, open a new text file and type in the following:

That's it! Make sure the AddOn folder is nestled into your AddOns directory along with the other mods you use and log in to the game, the end result is that the words in quotes are printed to the chat window. Generally this is a technique used when a mod author wants to post a message to chat that the AddOn has been loaded.
For the AddOn to do anything really meaningful in the game world you need to get into registering and handling events but that, dear reader, is for another tutorial.
This AddOn is called OobieUtil and it does everything for me from automatically repairing my gear to rewriting my bandage macro to use the highest bandage available and automatically accepting invites from the guild leader during raid times.
OobieUtil does next to nothing graphically speaking, but it keeps my UI running smoothly - like engine oil as it were. I code into this mod many repetitive or convoluted procedures that clutter up the UI, distract me from the game or just plain annoy me.
To me, OobieUtil is as indispensable as DeadlyBossMods or a good action bar AddOn - I can't imagine playing without it. With a little inscturction anybody can accomplish much of what I do in my utility AddOn, it just takes a bit of copy/paste action and the right resources.
In this first tutorial I'll go over the basics of what you need for an AddOn... the basic infrastructure that you'll need to start coding modifications into your UI to streamline it. Here are some examples of things I do with this utility:
OobieUtil
- Provides notifications when my character is running low on ammunition i.e. Hunter ammo pouch or Warlock soul bag is below a certain percent full.
- Rewrites a bandage macro to use the highest available bandage. All characters share the same macro and it's automatically rewritten on character changes and inventory updates.
- Rewrites an assist macro via a slash command - more advanced version scans a party and automatically find the tank and rewrites the macro.
- Automatically watches a faction you've recently gained reputation with.
- Automatically repairs gear at a vendor using guild funds if the option is available.
- Rewrites a macro that will equip a lance or the weapon equipped at the time the lance was picked up. Knows which lance you picked up and adjusts the macro accordingly.
Note: This tutorial is for Windows PCs, though AddOns for Mac follow the same format some specific instructions in terms of how you interact with your OS may not translate properly.
HelloWorld
If you already know a bit about programming chances are that you've made a "Hello World" program before. It's generally the first program written when learning a new language - but don't let that intimidate you. There are a small handful of programming techniques that will help accomplishing certain tasks in an AddOn but for the most part the WoW API is very user friendly and a great deal of things can be accomplished without advanced programming techniques.
For this tutorial, however, I won't be talking about any techniques, just the framework needed for an AddOn.
Next you'll want to open Notepad or another text editor of your choice. Stay away from Office products when editing AddOn files, though. They tend to add unnecessary formatting tags that could cause your AddOn to not work properly. My own personal favorite is Notepad++.
Type or copy/paste the following into your text editor of choice:
## Interface: 30200Once you have this much typed in save the file with the name 'HelloWorld.toc' inside the folder we made earlier. Before you save make sure to change drop down menu below the file name box to say 'All Files' otherwise you may end up accidentally saving the file with an extra file extension, which WoW will not know what to do with.
## Title: HelloWorld
HelloWorld.lua
print("Hello World!")Once that's done save the file in the same folder with the name 'HelloWorld.lua'.
For the AddOn to do anything really meaningful in the game world you need to get into registering and handling events but that, dear reader, is for another tutorial.
Labels:
AddOn authoring,
HelloWorld,
tutorial,
UI
Subscribe to:
Posts (Atom)
