Thread Tools Display Modes
02-24-12, 09:04 AM   #1
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
How to make an GUI.

Hello everyone so today, i was bored so i decied i wanted to do a GUI. But didn't find any useful info. So i'm posting here.

Basicly i just want to do somthing simple as this for my true & false options.

Just like this



Thanks!
  Reply With Quote
02-24-12, 01:14 PM   #2
Seerah
Fishing Trainer
 
Seerah's Avatar
WoWInterface Super Mod
Featured
Join Date: Oct 2006
Posts: 10,860
Here are some resources to get you started. If you have questions after reading through these, ask away.

http://www.wowpedia.org/Using_the_In...s_Addons_panel

http://www.wowpedia.org/Creating_GUI...ration_options (This one uses XML, which I always stay away from, but there might be some good info in there for you.)

http://wowprogramming.com/docs/widgets_hierarchy

http://www.wowace.com/addons/ace3/pa...ptions-tables/ (If you decide you want to go the AceConfig route.)
__________________
"You'd be surprised how many people violate this simple principle every day of their lives and try to fit square pegs into round holes, ignoring the clear reality that Things Are As They Are." -Benjamin Hoff, The Tao of Pooh

  Reply With Quote
02-24-12, 01:26 PM   #3
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by Seerah View Post
Here are some resources to get you started. If you have questions after reading through these, ask away.

http://www.wowpedia.org/Using_the_In...s_Addons_panel

http://www.wowpedia.org/Creating_GUI...ration_options (This one uses XML, which I always stay away from, but there might be some good info in there for you.)

http://wowprogramming.com/docs/widgets_hierarchy

http://www.wowace.com/addons/ace3/pa...ptions-tables/ (If you decide you want to go the AceConfig route.)
Thanks Seerah!
  Reply With Quote
02-24-12, 01:51 PM   #4
Seerah
Fishing Trainer
 
Seerah's Avatar
WoWInterface Super Mod
Featured
Join Date: Oct 2006
Posts: 10,860
And don't forget that you can use templates already set up for the Blizzard Options to make your job easier if you don't use AceConfig. There are also templates for fonts. You can find these by searching through the FrameXML.
__________________
"You'd be surprised how many people violate this simple principle every day of their lives and try to fit square pegs into round holes, ignoring the clear reality that Things Are As They Are." -Benjamin Hoff, The Tao of Pooh

  Reply With Quote
02-24-12, 02:04 PM   #5
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by Seerah View Post
And don't forget that you can use templates already set up for the Blizzard Options to make your job easier if you don't use AceConfig. There are also templates for fonts. You can find these by searching through the FrameXML.
true that i think i'm going to stick to blizzards for now, maybe try AceConfig later
  Reply With Quote
02-24-12, 02:06 PM   #6
unlimit
Lookin' Good
 
unlimit's Avatar
AddOn Author - Click to view addons
Join Date: Aug 2008
Posts: 484
Out of curiosity, is it possible to do these entirely in LUA instead of XML?

edit: c.c Sure looks like it is going the Ace3 route, anyway to do it without Ace3, just something quick and simple? o_o
__________________


kúdan: im playing pantheon
JRCapablanca: no youre not
** Pantheon has been Banned. **

Last edited by unlimit : 02-24-12 at 02:27 PM.
  Reply With Quote
02-24-12, 02:27 PM   #7
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by unlimit View Post
Out of curiosity, is it possible to do these entirely in LUA instead of XML?
Yeah, i think so.


Going good so far ;>



And thanks alot Seerah!
  Reply With Quote
02-24-12, 02:49 PM   #8
Haleth
This Space For Rent
 
Haleth's Avatar
Featured
Join Date: Sep 2008
Posts: 1,173
I'm working on this as well with the same system, I still need to figure out a good system though for saved variable management. I want people to be able to easily set options for all chars/their own char, but I also want to make the GUI optional so lua settings can still be used. It's not simple.
  Reply With Quote
02-24-12, 02:57 PM   #9
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by Haleth View Post
I'm working on this as well with the same system, I still need to figure out a good system though for saved variable management. I want people to be able to easily set options for all chars/their own char, but I also want to make the GUI optional so lua settings can still be used. It's not simple.
Nice Yeah, that's gonna be a pain :P Nop, it's not ^^
  Reply With Quote
02-24-12, 03:45 PM   #10
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
If someones else wants to do this here is some code to get you started.

Good Luck!

LUA Code:
  1. --Create an function so we can give all the frames texts!
  2.  
  3. function CreateOptions(self, TextTitle, DescriptionsText) -- CreateOptions(self, "Header Text", "Description Text")
  4.     local title = self:CreateFontString(nil, "OVERLAY")
  5.     title:SetFontObject('GameFontNormalLarge')
  6.     title:SetPoint('TOPLEFT', 16, -16)
  7.     title:SetText(TextTitle) -- Header Text
  8.    
  9.     local title2 = self:CreateFontString(nil, "OVERLAY")
  10.     title2:SetFontObject('GameFontHighlightSmall')
  11.     title2:SetPoint('TOPLEFT', 18, -35)
  12.     title2:SetText(DescriptionsText) -- Description Text.
  13. end
  14.  
  15. -- AftermathhUI_GUI (our main directory)
  16.  
  17. AftermathhUI.panel = CreateFrame("Frame", "AftermathhUI", UIParent)
  18. AftermathhUI.panel.name = "AftermathhUI" -- our name of the directory.
  19.  
  20. CreateOptions(AftermathhUI.panel, "AftermathhUI", "Welcome to AftermathhUI_GUI. Here you can find most of the options that are needed!") -- add the function to add some text!
  21.  
  22. InterfaceOptions_AddCategory(AftermathhUI.panel) -- add it to the interface category!
  23.  
  24. -- Unitframes (our subdirectory of "AftermathhUI")
  25.  
  26. AftermathhUI.Unitframes = CreateFrame("Frame", "Unitframes", AftermathhUI.panel)
  27. AftermathhUI.Unitframes.name = "Unitframes"
  28. AftermathhUI.Unitframes.parent = AftermathhUI.panel.name
  29.  
  30. CreateOptions(AftermathhUI.Unitframes, "Unitframes", "Options for the Unitframes")
  31.  
  32. InterfaceOptions_AddCategory(AftermathhUI.Unitframes)
  33.  
  34. -- Buffs (our subdirectory of "AftermathhUI")
  35.  
  36. AftermathhUI.Buffs = CreateFrame("Frame", "Buffs", AftermathhUI.panel)
  37. AftermathhUI.Buffs.name = "Buffs"
  38. AftermathhUI.Buffs.parent = AftermathhUI.panel.name
  39. InterfaceOptions_AddCategory(AftermathhUI.Buffs)
  40.  
  41. -- Chat (our subdirectory of "AftermathhUI")
  42.  
  43. AftermathhUI.Chat = CreateFrame("Frame", "Chat", AftermathhUI.panel)
  44. AftermathhUI.Chat.name = "Chat"
  45. AftermathhUI.Chat.parent = AftermathhUI.panel.name
  46. InterfaceOptions_AddCategory(AftermathhUI.Chat)
  47.  
  48. -- Loot (our subdirectory of "AftermathhUI")
  49.  
  50. AftermathhUI.Loot = CreateFrame("Frame", "Loot", AftermathhUI.panel)
  51. AftermathhUI.Loot.name = "Loot"
  52. AftermathhUI.Loot.parent = AftermathhUI.panel.name
  53. InterfaceOptions_AddCategory(AftermathhUI.Loot)
  54.  
  55. -- Tooltip (our subdirectory of "AftermathhUI")
  56.  
  57. AftermathhUI.Tooltip = CreateFrame("Frame", "Tooltip", AftermathhUI.panel)
  58. AftermathhUI.Tooltip.name = "Tooltip"
  59. AftermathhUI.Tooltip.parent = AftermathhUI.panel.name
  60. InterfaceOptions_AddCategory(AftermathhUI.Tooltip)
  61.  
  62. -- Panels (our subdirectory of "AftermathhUI")
  63.  
  64. AftermathhUI.Panels = CreateFrame( "Frame", "Panels", AftermathhUI.panel)
  65. AftermathhUI.Panels.name = "Panels"
  66. AftermathhUI.Panels.parent = AftermathhUI.panel.name
  67. InterfaceOptions_AddCategory(AftermathhUI.Panels)
  68.  
  69. -- Repair (our subdirectory of "AftermathhUI")
  70.  
  71. AftermathhUI.Repair = CreateFrame("Frame", "Repair", AftermathhUI.panel)
  72. AftermathhUI.Repair.name = "Repair"
  73. AftermathhUI.Repair.parent = AftermathhUI.panel.name
  74. InterfaceOptions_AddCategory(AftermathhUI.Repair)
  75.  
  76. -- CombatText (our subdirectory of "AftermathhUI")
  77.  
  78. AftermathhUI.CombatText = CreateFrame("Frame", "CombatText", AftermathhUI.panel)
  79. AftermathhUI.CombatText.name = "Combat Text"
  80. AftermathhUI.CombatText.parent = AftermathhUI.panel.name
  81. InterfaceOptions_AddCategory(AftermathhUI.CombatText)
  82.  
  83. -- GeneralOptions (our subdirectory of "AftermathhUI")
  84.  
  85. AftermathhUI.GeneralOptions = CreateFrame("Frame", "GeneralOptions", AftermathhUI.panel)
  86. AftermathhUI.GeneralOptions.name = "General Options"
  87. AftermathhUI.GeneralOptions.parent = AftermathhUI.panel.name
  88. InterfaceOptions_AddCategory(AftermathhUI.GeneralOptions)
  89.  
  90. -- Plugins (our subdirectory of "AftermathhUI")
  91.  
  92. AftermathhUI.Plugins = CreateFrame("Frame", "Plugins", AftermathhUI.panel)
  93. AftermathhUI.Plugins.name = "Plugins"
  94. AftermathhUI.Plugins.parent = AftermathhUI.panel.name
  95. InterfaceOptions_AddCategory(AftermathhUI.Plugins)
  Reply With Quote
02-24-12, 05:24 PM   #11
Blazingstorm
A Deviate Faerie Dragon
 
Blazingstorm's Avatar
Join Date: Jan 2007
Posts: 16
Great Idea

I can't wait to see this implemented into your ui. Keep up the great work.

Found this over on WoWAce. It would make a cool base for a graphical control panel.
http://www.wowace.com/addons/neteaseui/

Last edited by Blazingstorm : 02-24-12 at 06:02 PM.
  Reply With Quote
02-24-12, 08:13 PM   #12
SDPhantom
A Pyroguard Emberseer
 
SDPhantom's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2006
Posts: 2,308
Originally Posted by unlimit View Post
Out of curiosity, is it possible to do these entirely in LUA instead of XML?

edit: c.c Sure looks like it is going the Ace3 route, anyway to do it without Ace3, just something quick and simple? o_o
I've done that just using what was needed for the Blizzard options UI. All you do is create a frame, add some properties to it, then put whatever on it.

Full Blizzard-provided documentation is in InterfaceOptionsFrame.lua line 490:
Code:
---------------------------------------------------------------------------------------------------
-- HOWTO: Add new categories of options
--
-- The new Interface Options frame allows authors to place their configuration
-- frames (aka "panels") alongside the panels for modifying the default UI.
--
-- Adding a new panel to the Interface Options frame is a fairly straightforward process.
-- Any frame can be used as a panel as long as it implements the required values and methods.
-- Once a frame is ready to be used as a panel, it must be registered using the function
-- InterfaceOptions_AddCategory, i.e. InterfaceOptions_AddCategory(panel)
--
-- Panels can be designated as sub-categories of existing options. These panels are listed
-- with smaller text, offset, and tied to parent categories. The parent categories can be expanded
-- or collapsed to toggle display of their sub-categories.
--
-- When players select a category of options from the Interface Options frame, the panel associated
-- with that category will be anchored to the right hand side of the Interface Options frame and shown.
--
-- The following members and methods are used by the Interface Options frame to display and organize panels.
--
-- panel.name - string (required)	
--	The name of the AddOn or group of configuration options. 
--	This is the text that will display in the AddOn options list.
--
-- panel.parent - string (optional)
--	Name of the parent of the AddOn or group of configuration options. 
--	This identifies "panel" as the child of another category.
--	If the parent category doesn't exist, "panel" will be displayed as a regular category.
--
-- panel.okay - function (optional)
--	This method will run when the player clicks "okay" in the Interface Options. 
--
-- panel.cancel - function (optional)
--	This method will run when the player clicks "cancel" in the Interface Options. 
--	Use this to revert their changes.
--
-- panel.default - function (optional)
--	This method will run when the player clicks "defaults". 
--	Use this to revert their changes to your defaults.
--
-- panel.refresh - function (optional)
--  This method will run when the Interface Options frame calls its OnShow function and after defaults
--  have been applied via the panel.default method described above.
--  Use this to refresh your panel's UI in case settings were changed without player interaction.
--
-- EXAMPLE -- Use XML to create a frame, and through its OnLoad function, make the frame a panel.
--
--	MyAddOn.xml
--		<Frame name="ExamplePanel">
--			<Scripts>
--				<OnLoad>
--					ExamplePanel_OnLoad(self);
--				</OnLoad>
--			</Scripts>
--		</Frame>
--
--	MyAddOn.lua
--		function ExamplePanel_OnLoad (panel)
--			panel.name = "My AddOn"
--			InterfaceOptions_AddCategory(panel);
--		end
--
-- EXAMPLE -- Dynamically create a frame and use it as a subcategory for "My AddOn".
--
--	local panel = CreateFrame("FRAME", "ExampleSubCategory");
--	panel.name = "My SubCategory";
--	panel.parent = "My AddOn";
--
--	InterfaceOptions_AddCategory(panel);
--
-- EXAMPLE -- Create a frame with a control, an okay and a cancel method
--
--	--[[ Create a frame to use as the panel ]] -- 
--	local panel = CreateFrame("FRAME", "ExamplePanel");
--	panel.name = "My AddOn";
--
--	-- [[ When the player clicks okay, set the original value to the current setting ]] --
--	panel.okay = 
--		function (self)
--			self.originalValue = MY_VARIABLE;
--		end
--
--	-- [[ When the player clicks cancel, set the current setting to the original value ]] --
--	panel.cancel =
--		function (self)
--			MY_VARIABLE = self.originalValue;
--		end
--
--	-- [[ Add the panel to the Interface Options ]] --
--	InterfaceOptions_AddCategory(panel);
-------------------------------------------------------------------------------------------------
__________________
WoWInterface AddOns
"All I want is a pretty girl, a decent meal, and the right to shoot lightning at fools."
-Anders (Dragon Age: Origins - Awakening)

Last edited by SDPhantom : 02-24-12 at 08:22 PM.
  Reply With Quote
02-24-12, 08:56 PM   #13
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
How do you make tick box? i haven't found it yet

Also how do you make this?


Last edited by Aftermathhqt : 02-24-12 at 08:58 PM.
  Reply With Quote
02-24-12, 09:10 PM   #14
Seerah
Fishing Trainer
 
Seerah's Avatar
WoWInterface Super Mod
Featured
Join Date: Oct 2006
Posts: 10,860
Originally Posted by unlimit View Post
Out of curiosity, is it possible to do these entirely in LUA instead of XML?
Of course.
__________________
"You'd be surprised how many people violate this simple principle every day of their lives and try to fit square pegs into round holes, ignoring the clear reality that Things Are As They Are." -Benjamin Hoff, The Tao of Pooh

  Reply With Quote
02-24-12, 09:12 PM   #15
Seerah
Fishing Trainer
 
Seerah's Avatar
WoWInterface Super Mod
Featured
Join Date: Oct 2006
Posts: 10,860
Originally Posted by Game92 View Post
How do you make tick box? i haven't found it yet

Also how do you make this?

You're looking for checkbuttons and sliders.

http://wowprogramming.com/docs/widgets/CheckButton
http://wowprogramming.com/docs/widgets/Slider
__________________
"You'd be surprised how many people violate this simple principle every day of their lives and try to fit square pegs into round holes, ignoring the clear reality that Things Are As They Are." -Benjamin Hoff, The Tao of Pooh

  Reply With Quote
02-24-12, 09:23 PM   #16
unlimit
Lookin' Good
 
unlimit's Avatar
AddOn Author - Click to view addons
Join Date: Aug 2008
Posts: 484


I logged into wow to try out your code, Aftermath, then Fatality popped up and I figured I may as well see what makes it's check buttons click. c.c

Sooo, credit to oomp for his buttons. <_<

...and to my wife for the motivation for the screenshot. <_<

lua Code:
  1. function TRUESYS.Checkbox(self, selfid, px, py, description)
  2.     local checkbox = CreateFrame("CheckButton", "TrueAuiEnableButton_" .. selfid, self, "OptionsSmallCheckButtonTemplate")
  3.     checkbox:SetScript("OnClick", Checkbox_OnClick)
  4.     checkbox:SetPoint("TOPLEFT", self, px, py)
  5.     checkbox:SetWidth(28)
  6.     checkbox:SetHeight(28)
  7.     checkbox:SetHitRectInsets(0, -60, 0, 0)
  8.     checkbox:GetNormalTexture():SetAlpha(0.6)
  9.  
  10.     local checkboxtexture = checkbox:CreateTexture(nil, "ARTWORK")
  11.     checkboxtexture:SetWidth(22)
  12.     checkboxtexture:SetHeight(22)
  13.     checkboxtexture:SetAlpha(0.9)
  14.     checkboxtexture:SetPoint("LEFT", 2, 1)
  15.     checkboxtexture:SetTexture("Interface\\RAIDFRAME\\ReadyCheck-Ready")
  16.     checkbox:SetCheckedTexture(checkboxtexture)
  17.    
  18.     local checkboxtext = self:CreateFontString(nil, "ARTWORK", "GameFontNormal")
  19.     checkboxtext:SetPoint("LEFT", checkbox, "RIGHT", 5, 1)
  20.     checkboxtext:SetFontObject("GameFontNormal")
  21.     checkboxtext:SetText(description)
  22. end
  23.  
  24. function TRUESYS.CreateOptions(self, TextTitle, DescriptionsText)
  25.     local title = self:CreateFontString(nil, "OVERLAY")
  26.     title:SetFontObject('GameFontNormalLarge')
  27.     title:SetPoint('TOPLEFT', 16, -16)
  28.     title:SetText(TextTitle)
  29.  
  30.     local title2 = self:CreateFontString(nil, "OVERLAY")
  31.     title2:SetFontObject('GameFontHighlightSmall')
  32.     title2:SetPoint('TOPLEFT', 18, -35)
  33.     title2:SetText(DescriptionsText)
  34. end
  35.  
  36. TRUESYS.panel = CreateFrame("Frame", "TrueAuiOptions", UIParent)
  37. TRUESYS.panel.name = "|cff89F559True|r|c007ffcffAui|r"
  38. TRUESYS.CreateOptions(TRUESYS.panel, "|cff89F559(True)|r |c007ffcffAdaptive User Interface|r", "http://www.wowrdx.com")
  39.  
  40. TRUESYS.Checkbox(TRUESYS.panel, 1, 18, -60, "Enable ability priority system")
  41. TRUESYS.Checkbox(TrueAuiEnableButton_1, 2, 1, -25, "Enable PVP trinket tracking")
  42. TRUESYS.Checkbox(TrueAuiEnableButton_2, 3, 1, -25, "Enable loving your incredibly fussy wife forever")
  43.  
  44. InterfaceOptions_AddCategory(TRUESYS.panel)

I don't know how to make it actually work yet, but, just thought I'd share the good looking button code. c.c
__________________


kúdan: im playing pantheon
JRCapablanca: no youre not
** Pantheon has been Banned. **

Last edited by unlimit : 02-24-12 at 09:27 PM.
  Reply With Quote
02-25-12, 07:25 AM   #17
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by Seerah View Post
Originally Posted by unlimit View Post


I logged into wow to try out your code, Aftermath, then Fatality popped up and I figured I may as well see what makes it's check buttons click. c.c

Sooo, credit to oomp for his buttons. <_<

...and to my wife for the motivation for the screenshot. <_<

lua Code:
  1. function TRUESYS.Checkbox(self, selfid, px, py, description)
  2.     local checkbox = CreateFrame("CheckButton", "TrueAuiEnableButton_" .. selfid, self, "OptionsSmallCheckButtonTemplate")
  3.     checkbox:SetScript("OnClick", Checkbox_OnClick)
  4.     checkbox:SetPoint("TOPLEFT", self, px, py)
  5.     checkbox:SetWidth(28)
  6.     checkbox:SetHeight(28)
  7.     checkbox:SetHitRectInsets(0, -60, 0, 0)
  8.     checkbox:GetNormalTexture():SetAlpha(0.6)
  9.  
  10.     local checkboxtexture = checkbox:CreateTexture(nil, "ARTWORK")
  11.     checkboxtexture:SetWidth(22)
  12.     checkboxtexture:SetHeight(22)
  13.     checkboxtexture:SetAlpha(0.9)
  14.     checkboxtexture:SetPoint("LEFT", 2, 1)
  15.     checkboxtexture:SetTexture("Interface\\RAIDFRAME\\ReadyCheck-Ready")
  16.     checkbox:SetCheckedTexture(checkboxtexture)
  17.    
  18.     local checkboxtext = self:CreateFontString(nil, "ARTWORK", "GameFontNormal")
  19.     checkboxtext:SetPoint("LEFT", checkbox, "RIGHT", 5, 1)
  20.     checkboxtext:SetFontObject("GameFontNormal")
  21.     checkboxtext:SetText(description)
  22. end
  23.  
  24. function TRUESYS.CreateOptions(self, TextTitle, DescriptionsText)
  25.     local title = self:CreateFontString(nil, "OVERLAY")
  26.     title:SetFontObject('GameFontNormalLarge')
  27.     title:SetPoint('TOPLEFT', 16, -16)
  28.     title:SetText(TextTitle)
  29.  
  30.     local title2 = self:CreateFontString(nil, "OVERLAY")
  31.     title2:SetFontObject('GameFontHighlightSmall')
  32.     title2:SetPoint('TOPLEFT', 18, -35)
  33.     title2:SetText(DescriptionsText)
  34. end
  35.  
  36. TRUESYS.panel = CreateFrame("Frame", "TrueAuiOptions", UIParent)
  37. TRUESYS.panel.name = "|cff89F559True|r|c007ffcffAui|r"
  38. TRUESYS.CreateOptions(TRUESYS.panel, "|cff89F559(True)|r |c007ffcffAdaptive User Interface|r", "http://www.wowrdx.com")
  39.  
  40. TRUESYS.Checkbox(TRUESYS.panel, 1, 18, -60, "Enable ability priority system")
  41. TRUESYS.Checkbox(TrueAuiEnableButton_1, 2, 1, -25, "Enable PVP trinket tracking")
  42. TRUESYS.Checkbox(TrueAuiEnableButton_2, 3, 1, -25, "Enable loving your incredibly fussy wife forever")
  43.  
  44. InterfaceOptions_AddCategory(TRUESYS.panel)

I don't know how to make it actually work yet, but, just thought I'd share the good looking button code. c.c
Thanks both!
  Reply With Quote
02-28-12, 12:36 PM   #18
zork
A Pyroguard Emberseer
 
zork's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2008
Posts: 1,740
More to read:
http://www.wowinterface.com/forums/s...ad.php?t=40444
http://wowprogramming.com/utils/xmlb...tionsFrame.lua
http://www.wowwiki.com/Creating_GUI_...ration_options
http://www.wowinterface.com/forums/s...ad.php?t=41215
http://forums.wowace.com/showthread....774#post318774
http://tain.wowinterface.com/forums/...ad.php?t=18154
http://www.wowace.com/addons/libsimp...e-options-1-0/

What's kind of interesting is the module concept that Wildbreath is using in SuperClassic. I guess some others use it too. Thus if your addon is an interface with many modules you can activate them individually.
__________________
| Simple is beautiful.
| WoWI AddOns | GitHub | Zork (WoW)

"I wonder what the non-pathetic people are doing tonight?" - Rajesh Koothrappali (The Big Bang Theory)

Last edited by zork : 02-29-12 at 03:26 AM.
  Reply With Quote
02-28-12, 02:27 PM   #19
zork
A Pyroguard Emberseer
 
zork's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2008
Posts: 1,740
Basic template for creating and calling a panel

TOC
lua Code:
  1. ## Interface: 40300
  2. ## Title: rConfig
  3. ## Author: zork
  4. ## Notes: A config template
  5. ## Version: 0.001
  6. ## SavedVariables: RCONFIG_DB_GLOB
  7. ## SavedVariablesPerCharacter: RCONFIG_DB_CHAR
  8. core.lua

LUA
lua Code:
  1. --VARIABLES/CONSTANTS
  2.  
  3. --init the addon frame
  4. local addon = CreateFrame("Frame")
  5. local db_glob, db_char
  6. local _G = _G
  7.  
  8. --FUNCTIONS
  9.  
  10. --default values
  11. local function loadDefaultsGlobal()
  12.   local t = {
  13.     name = 'green',
  14.   }
  15.   return t
  16. end
  17. local function loadDefaultsChar()
  18.   local t = {
  19.     width = 100,
  20.   }
  21.   return t
  22. end
  23.  
  24. local function loadDatabase()
  25.   db_glob = _G["RCONFIG_DB_GLOB"] or loadDefaultsGlobal()
  26.   _G["RCONFIG_DB_GLOB"] = db_glob
  27.   --saved variables per character
  28.   db_char = _G["RCONFIG_DB_CHAR"] or loadDefaultsChar()
  29.   _G["RCONFIG_DB_CHAR"] = db_char
  30. end
  31.  
  32. local function resetAllValues()
  33.   db_glob = loadDefaultsGlobal()
  34.   _G["RCONFIG_DB_GLOB"] = db_glob
  35.   db_char = loadDefaultsChar()
  36.   _G["RCONFIG_DB_CHAR"] = db_char
  37. end
  38.  
  39. --do you really want to reset all values?
  40. StaticPopupDialogs["RESET"] = {
  41.   text = "Reset all values for rConfig?",
  42.   button1 = ACCEPT,
  43.   button2 = CANCEL,
  44.   OnAccept = function() resetAllValues() print('reset done') end,
  45.   OnCancel = function() print('reset canceled') end,
  46.   timeout = 0,
  47.   whileDead = 1,
  48. }
  49.  
  50. local function createSubPanel(parent, name)
  51.   local panel = CreateFrame("FRAME")
  52.   panel.name = name
  53.   panel.parent = parent.name
  54.   panel.okay = function (self)
  55.     print(name..' okay')
  56.   end
  57.   panel.cancel = function (self)
  58.     print(name..' cancel')
  59.   end
  60.   panel.default = function (self)
  61.     --resetAllValues()
  62.     StaticPopup_Show("RESET")
  63.     print(name..' default')
  64.   end
  65.   panel.refresh = function (self)
  66.     print(name..' refresh')
  67.   end
  68.   InterfaceOptions_AddCategory(panel)
  69. end
  70.  
  71. local function initPanel()
  72.   local mainpanel = CreateFrame("FRAME")
  73.   mainpanel.name = "rConfig"
  74.   InterfaceOptions_AddCategory(mainpanel)
  75.   createSubPanel(mainpanel,"rConfigSubPanel1")
  76.   createSubPanel(mainpanel,"rConfigSubPanel2")
  77.   return mainpanel
  78. end
  79.  
  80. local function initSlashCmd(panel)
  81.   SLASH_RCONFIG1, SLASH_RCONFIG2 = '/rc', '/rconfig'
  82.   function SlashCmdList.RCONFIG(msg, editbox)
  83.     InterfaceOptionsFrame_OpenToCategory(panel)
  84.   end
  85. end
  86.  
  87. --INIT
  88.  
  89. function addon:VARIABLES_LOADED(...)
  90.   local self = self
  91.   --load the database
  92.   loadDatabase()
  93.   self:UnregisterEvent("VARIABLES_LOADED")
  94. end
  95.  
  96. function addon:PLAYER_LOGIN(...)
  97.   local self = self
  98.   print(db_glob.name)
  99.   local mainpanel = initPanel()
  100.   initSlashCmd(mainpanel)
  101.   self:UnregisterEvent("PLAYER_LOGIN")
  102. end
  103.  
  104. --CALL
  105.  
  106. --by doing this the addon will call functions based on registered events by itself
  107. addon:SetScript("OnEvent", function(self, event)
  108.   self[event](self)
  109.   --return self[event](self)
  110. end)
  111. --register events
  112. addon:RegisterEvent("VARIABLES_LOADED")
  113. addon:RegisterEvent("PLAYER_LOGIN")

Result is a blank panel.
Example shows loading the DB, creating the panel/subpanel and adding a slashcmd to call the panel.
__________________
| Simple is beautiful.
| WoWI AddOns | GitHub | Zork (WoW)

"I wonder what the non-pathetic people are doing tonight?" - Rajesh Koothrappali (The Big Bang Theory)

Last edited by zork : 02-28-12 at 02:49 PM.
  Reply With Quote
03-02-12, 03:16 AM   #20
Aftermathhqt
A Molten Giant
 
Aftermathhqt's Avatar
AddOn Author - Click to view addons
Join Date: Dec 2009
Posts: 784
Originally Posted by zork View Post
Basic template for creating and calling a panel

TOC
lua Code:
  1. ## Interface: 40300
  2. ## Title: rConfig
  3. ## Author: zork
  4. ## Notes: A config template
  5. ## Version: 0.001
  6. ## SavedVariables: RCONFIG_DB_GLOB
  7. ## SavedVariablesPerCharacter: RCONFIG_DB_CHAR
  8. core.lua

LUA
lua Code:
  1. --VARIABLES/CONSTANTS
  2.  
  3. --init the addon frame
  4. local addon = CreateFrame("Frame")
  5. local db_glob, db_char
  6. local _G = _G
  7.  
  8. --FUNCTIONS
  9.  
  10. --default values
  11. local function loadDefaultsGlobal()
  12.   local t = {
  13.     name = 'green',
  14.   }
  15.   return t
  16. end
  17. local function loadDefaultsChar()
  18.   local t = {
  19.     width = 100,
  20.   }
  21.   return t
  22. end
  23.  
  24. local function loadDatabase()
  25.   db_glob = _G["RCONFIG_DB_GLOB"] or loadDefaultsGlobal()
  26.   _G["RCONFIG_DB_GLOB"] = db_glob
  27.   --saved variables per character
  28.   db_char = _G["RCONFIG_DB_CHAR"] or loadDefaultsChar()
  29.   _G["RCONFIG_DB_CHAR"] = db_char
  30. end
  31.  
  32. local function resetAllValues()
  33.   db_glob = loadDefaultsGlobal()
  34.   _G["RCONFIG_DB_GLOB"] = db_glob
  35.   db_char = loadDefaultsChar()
  36.   _G["RCONFIG_DB_CHAR"] = db_char
  37. end
  38.  
  39. --do you really want to reset all values?
  40. StaticPopupDialogs["RESET"] = {
  41.   text = "Reset all values for rConfig?",
  42.   button1 = ACCEPT,
  43.   button2 = CANCEL,
  44.   OnAccept = function() resetAllValues() print('reset done') end,
  45.   OnCancel = function() print('reset canceled') end,
  46.   timeout = 0,
  47.   whileDead = 1,
  48. }
  49.  
  50. local function createSubPanel(parent, name)
  51.   local panel = CreateFrame("FRAME")
  52.   panel.name = name
  53.   panel.parent = parent.name
  54.   panel.okay = function (self)
  55.     print(name..' okay')
  56.   end
  57.   panel.cancel = function (self)
  58.     print(name..' cancel')
  59.   end
  60.   panel.default = function (self)
  61.     --resetAllValues()
  62.     StaticPopup_Show("RESET")
  63.     print(name..' default')
  64.   end
  65.   panel.refresh = function (self)
  66.     print(name..' refresh')
  67.   end
  68.   InterfaceOptions_AddCategory(panel)
  69. end
  70.  
  71. local function initPanel()
  72.   local mainpanel = CreateFrame("FRAME")
  73.   mainpanel.name = "rConfig"
  74.   InterfaceOptions_AddCategory(mainpanel)
  75.   createSubPanel(mainpanel,"rConfigSubPanel1")
  76.   createSubPanel(mainpanel,"rConfigSubPanel2")
  77.   return mainpanel
  78. end
  79.  
  80. local function initSlashCmd(panel)
  81.   SLASH_RCONFIG1, SLASH_RCONFIG2 = '/rc', '/rconfig'
  82.   function SlashCmdList.RCONFIG(msg, editbox)
  83.     InterfaceOptionsFrame_OpenToCategory(panel)
  84.   end
  85. end
  86.  
  87. --INIT
  88.  
  89. function addon:VARIABLES_LOADED(...)
  90.   local self = self
  91.   --load the database
  92.   loadDatabase()
  93.   self:UnregisterEvent("VARIABLES_LOADED")
  94. end
  95.  
  96. function addon:PLAYER_LOGIN(...)
  97.   local self = self
  98.   print(db_glob.name)
  99.   local mainpanel = initPanel()
  100.   initSlashCmd(mainpanel)
  101.   self:UnregisterEvent("PLAYER_LOGIN")
  102. end
  103.  
  104. --CALL
  105.  
  106. --by doing this the addon will call functions based on registered events by itself
  107. addon:SetScript("OnEvent", function(self, event)
  108.   self[event](self)
  109.   --return self[event](self)
  110. end)
  111. --register events
  112. addon:RegisterEvent("VARIABLES_LOADED")
  113. addon:RegisterEvent("PLAYER_LOGIN")

Result is a blank panel.
Example shows loading the DB, creating the panel/subpanel and adding a slashcmd to call the panel.

Thanks Zork

Anyways i started on a new GUI

Here is it!



The thing is i need to figure how to create new windows for the tabs :<

LUA Code:
  1. -- Create an function so we can give all the frames texts in a smart way!
  2.  
  3. function CreateOptions(self, TextTitle, DescriptionsText) -- CreateOptions(self, "Header Text", "Description Text")
  4.     local title = self:CreateFontString(nil, "OVERLAY")
  5.     title:SetFontObject('GameFontNormalLarge')
  6.     title:SetPoint('TOPLEFT', 16, -16)
  7.     title:SetText(TextTitle) -- Header Text
  8.    
  9.     local title2 = self:CreateFontString(nil, "OVERLAY")
  10.     title2:SetFontObject('GameFontHighlightSmall')
  11.     title2:SetPoint('TOPLEFT', 17, -37)
  12.     title2:SetText(DescriptionsText) -- Description Text.
  13. end
  14.  
  15. function Checkbox(self, selfid, px, py, description, SetChecked, OnClick) -- Checkbox(self, 1, 14, -55, "Description Text", SetChecked, OnClick)
  16.     local checkbox = CreateFrame("CheckButton", "CheckBoxButton" .. selfid, self, "OptionsSmallCheckButtonTemplate")
  17.     checkbox:SetPoint("TOPLEFT", self, px, py)
  18.     checkbox:SetScript("OnClick", OnClick)
  19.     checkbox:SetWidth(28)
  20.     checkbox:SetHeight(28)
  21.     checkbox:SetFrameStrata("HIGH")
  22.     checkbox:SetChecked(SetChecked)
  23.     checkbox:SetHitRectInsets(0, -60, 0, 0)
  24.     checkbox:GetNormalTexture():SetAlpha(0.6)
  25.     checkbox:SetNormalTexture("")
  26.     checkbox:SetPushedTexture("")
  27.     checkbox:SetHighlightTexture("")
  28.     checkbox:SetBackdrop({
  29.         bgFile = AftermathhUI.media.backdrop,
  30.         insets = {top = 1, left = 1, bottom = 1, right = 1},
  31.     })
  32.  
  33.     CreateBorderLight(checkbox, AftermathhUI.media.bordersize, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor, -4)
  34.    
  35.     checkbox:HookScript("OnEnter", function(self)
  36.         ColorBorder(checkbox, 1.0, 0.82, 0)
  37.     end)
  38.    
  39.     checkbox:HookScript("OnLeave", function(self)
  40.         ColorBorder(checkbox, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor)
  41.     end)
  42.    
  43.     local checkboxtexture = checkbox:CreateTexture(nil, "ARTWORK")
  44.     checkboxtexture:SetWidth(25)
  45.     checkboxtexture:SetHeight(22)
  46.     checkboxtexture:SetAlpha(0.9)
  47.     checkboxtexture:SetPoint("LEFT", 2, 1)
  48.     checkboxtexture:SetTexture("Interface\\RAIDFRAME\\ReadyCheck-Ready")
  49.     checkbox:SetCheckedTexture(checkboxtexture)
  50.    
  51.     local checkboxtext = self:CreateFontString(nil, "ARTWORK", "GameFontNormal")
  52.     checkboxtext:SetPoint("LEFT", checkbox, "RIGHT", 5, 1)
  53.     checkboxtext:SetFontObject("GameFontNormal")
  54.     checkboxtext:SetTextColor(1, 1, 1)
  55.     checkboxtext:SetText(description)
  56. end
  57.  
  58. function ShowBuffs_OnClick()
  59.  
  60. end
  61.  
  62. local AftermathhUIFrame = CreateFrame("Frame", "AftermathhUIFrame", UIParent)
  63. AftermathhUIFrame:SetSize(800, 550)
  64. AftermathhUIFrame:SetFrameStrata("HIGH")
  65. AftermathhUIFrame:SetFrameLevel(25)
  66. AftermathhUIFrame:SetBackdrop({
  67.     bgFile = AftermathhUI.media.blank,
  68.     insets = {top = -1, left = -1, bottom = -1, right = -1},
  69. })
  70. AftermathhUIFrame:SetBackdropColor(unpack(AftermathhUI.media.backdropcolor))
  71. AftermathhUIFrame:Hide()
  72.  
  73. CreateOptions(AftermathhUIFrame, "AftermathhUI_Config", "Welcome to AftermathhUI_Config. Here you can find most of the options that are needed!")
  74.  
  75. CreateBorderLight(AftermathhUIFrame, AftermathhUI.media.bordersize, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor, 1)
  76.  
  77. AftermathhUIFrame:SetClampedToScreen(true)
  78. AftermathhUIFrame:SetMovable(true)
  79. AftermathhUIFrame:SetUserPlaced(true)
  80. AftermathhUIFrame:EnableMouse(true)
  81. AftermathhUIFrame:RegisterForDrag("LeftButton")
  82. AftermathhUIFrame:SetHitRectInsets(-15, -15, -5, -5)
  83.  
  84. AftermathhUIFrame:ClearAllPoints()
  85. AftermathhUIFrame.ClearAllPoints = function() end
  86. AftermathhUIFrame:SetPoint("CENTER", UIParent)
  87. AftermathhUIFrame.SetPoint = function() end
  88.  
  89. AftermathhUIFrame:SetScript("OnDragStart", function(self)
  90.     AftermathhUIFrame:StartMoving()
  91. end)
  92.  
  93. AftermathhUIFrame:SetScript("OnDragStop", function(self)
  94.     AftermathhUIFrame:StopMovingOrSizing()
  95. end)
  96.  
  97. Checkbox(AftermathhUIFrame, 1, 14, -95, "Show PvP Icon.", AftermathhUI.ouf.showpvpicon)
  98. Checkbox(AftermathhUIFrame, 2, 14, -115, "Show Buffs.", AftermathhUI.ouf.showbuffs, ShowBuffs_OnClick)
  99. Checkbox(AftermathhUIFrame, 3, 14, -135, "Show Debuffs.", AftermathhUI.ouf.showdebuffs)
  100. Checkbox(AftermathhUIFrame, 4, 14, -155, "Only Show Player Debuffs.", AftermathhUI.ouf.onlyshowplayerdebuffs)
  101. Checkbox(AftermathhUIFrame, 5, 14, -175, "Show Aggroo.", AftermathhUI.ouf.showaggroo)
  102. Checkbox(AftermathhUIFrame, 6, 14, -195, "Show Debuff Highlight", AftermathhUI.ouf.showdebuffhighlight)
  103. Checkbox(AftermathhUIFrame, 7, 14, -215, "Tooltip On Mouseover (Player etc).", AftermathhUI.ouf.tooltiponouf)
  104. Checkbox(AftermathhUIFrame, 8, 14, -235, "Show Role Icon.", AftermathhUI.ouf.showroleicon)
  105. Checkbox(AftermathhUIFrame, 9, 14, -255, "Show Boss Frames.", AftermathhUI.ouf.bossframes)
  106. Checkbox(AftermathhUIFrame, 10, 14, -275, "Show Party Frames.", AftermathhUI.ouf.showparty)
  107. Checkbox(AftermathhUIFrame, 11, 14, -295, "Tooltip On Mouseover (Raidframes).", AftermathhUI.ouf.tooltiponraid)
  108. Checkbox(AftermathhUIFrame, 12, 14, -315, "Highlight On Mouseover (Raidframes).", AftermathhUI.ouf.highlightontarget)
  109. Checkbox(AftermathhUIFrame, 13, 14, -335, "Make Raid Frames Vertical.", AftermathhUI.ouf.raidframesvertical)
  110. Checkbox(AftermathhUIFrame, 14, 14, -355, "Aura Watch (Raidframes).", AftermathhUI.ouf.aurawatch)
  111. Checkbox(AftermathhUIFrame, 15, 14, -375, "Raid Debuffs.", AftermathhUI.ouf.raiddebuffs)
  112. Checkbox(AftermathhUIFrame, 16, 14, -395, "Show Aggro On Raidframes.", AftermathhUI.ouf.showaggroonraidframes)
  113. Checkbox(AftermathhUIFrame, 17, 14, -415, "Experiance Bar.", AftermathhUI.ouf.expbar)
  114. Checkbox(AftermathhUIFrame, 18, 14, -435, "Reputation Bar.", AftermathhUI.ouf.repbar)
  115. Checkbox(AftermathhUIFrame, 19, 14, -455, "Moveable Frames.", AftermathhUI.ouf.moveableframes)
  116. Checkbox(AftermathhUIFrame, 20, 14, -475, "Totembar from oUF.", AftermathhUI.ouf.totembar)
  117. Checkbox(AftermathhUIFrame, 21, 14, -495, "Heal Prediction.", AftermathhUI.ouf.healprediction)
  118. Checkbox(AftermathhUIFrame, 22, 14, -515, "Combat Feedback.", AftermathhUI.ouf.combatfeedback)
  119.  
  120. --- Coulum 2
  121.  
  122. Checkbox(AftermathhUIFrame, 23, 350, -95, "Classcolor on Castbar.", AftermathhUI.ouf.castbarclasscolor)
  123. Checkbox(AftermathhUIFrame, 24, 350, -115, "Show Safe Zone.", AftermathhUI.ouf.showsafezone)
  124. Checkbox(AftermathhUIFrame, 25, 350, -135, "Show Latency.", AftermathhUI.ouf.showlatency)
  125. Checkbox(AftermathhUIFrame, 26, 350, -155, "Target Castbar Icon.", AftermathhUI.ouf.targetcastbaricon)
  126. Checkbox(AftermathhUIFrame, 27, 350, -175, "Focus Castbar Icon.", AftermathhUI.ouf.focuscastbaricon)
  127. Checkbox(AftermathhUIFrame, 28, 350, -195, "Show Interrupt Highlight.", AftermathhUI.ouf.showinterrupthighlight)
  128.  
  129. local function AftermathhUIFrameOnEnter(self, fontsub)
  130.     self:HookScript("OnEnter", function(self)
  131.         ColorBorder(self, 1.0, 0.82, 0)
  132.     end)
  133.     self:HookScript("OnLeave", function(self)
  134.         ColorBorder(self, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor)
  135.     end)
  136. end
  137.  
  138. local function AftermathhUIFontOnEnter(self)
  139.     self:HookScript("OnEnter", function(self)
  140.         self:SetTextColor(1, 1, 1)
  141.     end)
  142.     self:HookScript("OnLeave", function(self)
  143.         self:SetTextColor(1.0, 0.82, 0)
  144.     end)
  145. end
  146.  
  147. local AftermathhUIFrameSub1 = CreateFrame("Button", nil, UIParent)
  148. AftermathhUIFrameSub1:SetSize(75, 20)
  149. AftermathhUIFrameSub1:SetFrameStrata("HIGH")
  150. AftermathhUIFrameSub1:SetFrameLevel(26)
  151. AftermathhUIFrameSub1:SetBackdrop({
  152.     bgFile = AftermathhUI.media.texture2,
  153.     --insets = {top = -1, left = -1, bottom = -1, right = -1},
  154. })
  155. AftermathhUIFrameSub1:SetBackdropColor(.40, .40, .40, 1)
  156. AftermathhUIFrameSub1:SetPoint("TOPLEFT", AftermathhUIFrame, 16, -65)
  157. AftermathhUIFrameSub1:Hide()
  158.  
  159. CreateBorderLight(AftermathhUIFrameSub1, AftermathhUI.media.bordersize, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor, 1)
  160.  
  161. AftermathhUIFrameOnEnter(AftermathhUIFrameSub1)
  162.  
  163. local AftermathhUIFrameSub1Font = AftermathhUIFrameSub1:CreateFontString(nil, "OVERLAY")
  164. AftermathhUIFrameSub1Font:SetFontObject('GameFontHighlightSmall')
  165. AftermathhUIFrameSub1Font:SetText("Unitframes")
  166. AftermathhUIFrameSub1Font:SetTextColor(1.0, 0.82, 0)
  167. AftermathhUIFrameSub1Font:SetPoint("CENTER")
  168.  
  169. local AftermathhUIFrameSub2 = CreateFrame("Button", nil, UIParent)
  170. AftermathhUIFrameSub2:SetSize(75, 20)
  171. AftermathhUIFrameSub2:SetFrameStrata("HIGH")
  172. AftermathhUIFrameSub2:SetFrameLevel(26)
  173. AftermathhUIFrameSub2:SetBackdrop({
  174.     bgFile = AftermathhUI.media.texture2,
  175.     --insets = {top = -1, left = -1, bottom = -1, right = -1},
  176. })
  177. AftermathhUIFrameSub2:SetBackdropColor(.40, .40, .40, 1)
  178. AftermathhUIFrameSub2:SetPoint("TOPLEFT", AftermathhUIFrame, 95, -65)
  179. AftermathhUIFrameSub2:Hide()
  180.  
  181. CreateBorderLight(AftermathhUIFrameSub2, AftermathhUI.media.bordersize, AftermathhUI.bordercolor, AftermathhUI.bordercolor, AftermathhUI.bordercolor, 1)
  182.  
  183. AftermathhUIFrameOnEnter(AftermathhUIFrameSub2)
  184.  
  185. local AftermathhUIFrameSub2Font = AftermathhUIFrameSub2:CreateFontString(nil, "OVERLAY")
  186. AftermathhUIFrameSub2Font:SetFontObject('GameFontHighlightSmall')
  187. AftermathhUIFrameSub2Font:SetText("Buffs")
  188. AftermathhUIFrameSub2Font:SetTextColor(1.0, 0.82, 0)
  189. AftermathhUIFrameSub2Font:SetPoint("CENTER")
  Reply With Quote

WoWInterface » Developer Discussions » Lua/XML Help » How to make an GUI.

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off