A Pyroguard Emberseer
Join Date: Jul 2008
Posts: 1,740
|
So to sum this up. When trying to create config menus the following UI elements come in handy.
FrameA normal frame that can hold all your config elements. (buttons, checkboxes, etc.)
FrameType: Frame
Template: BasicFrameTemplate
Widget: http://wowprogramming.com/docs/widgets/Frame ScrollFrameA frame that is scrollable inside.. The best example for this is the keybind setup frame.
FrameType: ScrollFrame
Template: FauxScrollFrameTemplate
Widget: http://wowprogramming.com/docs/widgets/ScrollFrame EditBoxA small input element that lets you input data into a field.
FrameType: EditBox
Template: InputBoxTemplate
Widget: http://wowprogramming.com/docs/widgets/EditBox CheckButton / CheckBox A checkbox like input element. Basically switch values between 0 and 1.
FrameType: CheckButton
Template: UICheckButtonTemplate
Widget: http://wowprogramming.com/docs/widgets/CheckButton
Lua Code:
--Example: local name = "MyExampleCheckButton" local template = "UICheckButtonTemplate" local checkButton = CreateFrame("Button",name,UIParent,template) --frameType, frameName, frameParent, frameTemplate checkButton:SetPoint("CENTER",0,0) checkButton.text = _G[name.."Text"] checkButton.text:SetText("Hello World") checkButton:SetScript("OnClick", function(self,event,arg1) if self:GetChecked() then print("Button is checked") else print("Button is unchecked") end end)
Lua Code:
--Example2: local name = "MyExampleCheckButton" local template = "OptionsBaseCheckButtonTemplate" local checkButton = CreateFrame("Button",name,UIParent,template) --frameType, frameName, frameParent, frameTemplate checkButton:SetPoint("CENTER",0,0) checkButton.text = _G[name.."Text"] checkButton.text:SetText("Hello World") local callback = function(setting) print("callback") end checkButton.setFunc = callback
CheckButton / RadioButtonA list of radiobuttons. Lets you choose one of "n" options.
FrameType: CheckButton
Template: UIRadioButtonTemplate
Widget: http://wowprogramming.com/docs/widgets/CheckButton SliderSliders are elements intended to allow the user to choose a value in a range.
FrameType: Slider
Template: UIPanelScrollBarTemplate
Widget: http://wowprogramming.com/docs/widgets/Slider
Lua Code:
--Example: local name = "MyExampleSlider" local template = "OptionsSliderTemplate" local slider = CreateFrame("Slider",name,UIParent,template) --frameType, frameName, frameParent, frameTemplate slider:SetPoint("CENTER",0,0) slider.textLow = _G[name.."Low"] slider.textHigh = _G[name.."High"] slider.text = _G[name.."Text"] slider:SetMinMaxValues(1, 100) slider.minValue, slider.maxValue = slider:GetMinMaxValues() slider.textLow:SetText(slider.minValue) slider.textHigh:SetText(slider.maxValue) slider.text:SetText(name) slider:SetValue(50) slider:SetValueStep(1) slider:SetScript("OnValueChanged", function(self,event,arg1) print(event) end)
ButtonA clickable frame that calls an action OnClick. Blizzard provides tons of button templates.
FrameType: Button
Template: UIPanelButtonTemplate
Widget: http://wowprogramming.com/docs/widgets/Button
Lua Code:
--Example: local name = "MyExampleButton" local template = "UIPanelButtonTemplate" local button = CreateFrame("Button",name,UIParent,template) --frameType, frameName, frameParent, frameTemplate button:SetSize(150,80) button:SetPoint("CENTER",0,0) button.text = _G[name.."Text"] button.text:SetText("Hello World")
UIDropDownMenuDepending on setup this can be both a selectbox or a context menu.
FrameType: Frame
Template: UIDropDownMenuTemplate
WriteUps: [1] [2] [3] [4]
Lua Code:
--EasyMenu Example: local dropdown = CreateFrame("Frame", "MyMenuFrame", nil, "UIDropDownMenuTemplate") local menuTable = {} local line, data, submenu = nil, nil, nil local function createMenuLine(data) local line = {} if not data then return line end line.text = data.text or nil line.isTitle = data.isTitle or nil line.notCheckable = data.notCheckable or nil line.notClickable = data.notClickable or nil line.keepShownOnClick = data.keepShownOnClick or nil line.hasArrow = data.hasArrow or nil line.func = data.func or nil line.menuList = data.menuList or nil return line end local function createDelimLine() --split line local delim = "~~~~~~~~~~~~~~~~~~~~~~~" data = { text = delim, notCheckable = true, notClickable = true } line = createMenuLine(data) return line end local function createMenu() --title data = { text = "MyMenuTitle", isTitle = true, notCheckable = true, notClickable = true } line = createMenuLine(data) table.insert(menuTable,line) --add delimiter line = createDelimLine() table.insert(menuTable,line) --generate sub menu submenu = {} data = { text = "General", isTitle = true, notCheckable = true, notClickable = true } line = createMenuLine(data) table.insert(submenu,line) line = createDelimLine() table.insert(submenu,line) data = { text = "MyOption1", func = myGlobalFunction1, notCheckable = true, keepShownOnClick = true, } line = createMenuLine(data) table.insert(submenu,line) data = { text = "MyOption2", func = myGlobalFunction2, notCheckable = true, keepShownOnClick = true, } line = createMenuLine(data) table.insert(submenu,line) data = { text = "MyOption3", func = myGlobalFunction3, notCheckable = true, keepShownOnClick = true, } line = createMenuLine(data) table.insert(submenu,line) --add submenu to menuTable data = { text = "General", notCheckable = true, hasArrow = true, menuList = submenu } line = createMenuLine(data) table.insert(menuTable,line) --add delimiter line = createDelimLine() table.insert(menuTable,line) --close menu data = { text = "Close", func = function() CloseDropDownMenus() end, notCheckable = true } line = createMenuLine(data) table.insert(menuTable,line) end --INIT createMenu() --CALL local function SlashCmd(cmd) EasyMenu(menuTable, dropdown, "cursor", 10 , -15, "MENU") end SlashCmdList["menu"] = SlashCmd SLASH_menu1 = "/menu"
ColorSelect / ColorPickerIn many cases you want to recolor textures. All you have to do is to call the ColorPicker and apply a callback function that handles the colors returned by the ColorPicker. Normally you have a small frame with a texture and once you change the color in the ColorPicker the texture color updates via the callback function.
FrameType: Frame (with an applied texture)
WriteUps: [1] [2]
Lua Code:
local function showColorPicker(r,g,b,a,callback) ColorPickerFrame:SetColorRGB(r,g,b) ColorPickerFrame.hasOpacity, ColorPickerFrame.opacity = (a ~= nil), a ColorPickerFrame.previousValues = {r,g,b,a} ColorPickerFrame.func, ColorPickerFrame.opacityFunc, ColorPickerFrame.cancelFunc = callback, callback, callback ColorPickerFrame:Hide() -- Need to run the OnShow handler. ColorPickerFrame:Show() end local function createMyFrame() --frame local f = CreateFrame("FRAME",nil,UIParent) f:SetSize(150,150) f:SetPoint("CENTER",0,0) --texture f.tex = f:CreateTexture(nil,"BACKGROUND",nil,-7) f.tex:SetAllPoints(f) f.tex:SetTexture(1,0,0,1) --recolor callback function f.recolorTexture = function(color) local r,g,b,a if color then r,g,b,a = unpack(color) else r,g,b = ColorPickerFrame:GetColorRGB() a = OpacitySliderFrame:GetValue() end f.tex:SetVertexColor(r,g,b,a) end f:EnableMouse(true) f:SetScript("OnMouseDown", function(self,button,...) if button == "LeftButton" then local r,g,b,a = self.tex:GetVertexColor() showColorPicker(r,g,b,a,self.recolorTexture) end end) end --init createMyFrame()
StatusBarSometimes it can be helpful to display data in a statusbar. They are similar to sliders, just without the option to edit. Like a progressbar or healthbar.
FrameType: StatusBar
Template: ???
Widget: http://wowprogramming.com/docs/widgets/StatusBar
Lua Code:
--Example: local color = {0,1,0} local statusbar = CreateFrame("StatusBar",nil,UIParent) --frameType, frameName, frameParent statusbar:SetPoint("CENTER",0,0) statusbar:SetSize(200,20) --statusbar background statusbar.bg = statusbar:CreateTexture(nil,"BACKGROUND",nil,-8) statusbar.bg:SetAllPoints(statusbar) statusbar.bg:SetTexture(unpack(color)) statusbar.bg:SetAlpha(0.2) --statusbar texture local tex = statusbar:CreateTexture(nil,"BACKGROUND",nil,-6) tex:SetTexture(unpack(color)) statusbar:SetStatusBarTexture(tex) statusbar:SetStatusBarColor(unpack(color)) --values statusbar:SetMinMaxValues(1, 100) statusbar.minValue, statusbar.maxValue = statusbar:GetMinMaxValues() statusbar:SetValue(50)
__________________
| 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 : 08-09-12 at 06:51 AM.
|