Full disclosure, this is really basic, only uses in-game assets and is just a hint of what you can do (time being what it is).
With the exception of secure templates being required to create certain “controlled substances” (Action Buttons, Unit Frames etc.) XML is not otherwise required so it is personal preference if you use it to create your frames or not.
There are a whole lot of templates created using XML but these can also be used in lua created frames, this example uses one of them for the buttons.
You can paste the following into the website addon.bool.no to create a simple addon consisting of a frame with a game standard border and two standard template based buttons. (The addon will have a basic .toc file required for all addons which must have the same name as the folder the addon is in.)
local f = CreateFrame("Frame", "ScrabbleTestFame", UIParent)
f:SetSize(200, 200)
f:SetPoint("CENTER")
local backdrop = {
bgFile = "Interface/BUTTONS/WHITE8X8",
edgeFile = "Interface/DialogFrame/UI-DialogBox-Border",
tile = true,
edgeSize = 32,
tileSize = 16,
insets = {
left = 11,
right = 11,
top = 12,
bottom = 10,
},
}
f:SetBackdrop(backdrop)
f:SetBackdropColor(0, 0, 0)
f.Tab1 = CreateFrame("Button", "$parentTab1", f, "UIPanelButtonTemplate")
f.Tab1:SetSize(44, 22)
f.Tab1:SetText("Tab 1")
f.Tab1:SetPoint("BOTTOMLEFT", 10, 10)
f.Tab1:SetScript("OnClick", function(self)
print("Tab 1 Clicked!")
end)
f.Tab2 = CreateFrame("Button", "$parentTab2", f, "UIPanelButtonTemplate")
f.Tab2:SetSize(44, 22)
f.Tab2:SetText("Tab 2")
f.Tab2:SetPoint("LEFT", f.Tab1, "RIGHT")
f.Tab2:SetScript("OnClick", function(self)
print("Tab 2 Clicked!")
end)
f.Title = CreateFrame("Frame", "$parentTitle", f)
f.Title:SetSize(150, 50)
f.Title:SetBackdrop(f:GetBackdrop())
f.Title:SetBackdropColor(0, 0, 0)
f.Title:SetPoint("BOTTOM", f, "TOP", 0, -8)
f.Title.Text = f.Title:CreateFontString("$parentText")
f.Title.Text:SetFont("Fonts\\FRIZQT__.TTF", 11, "OUTLINE, MONOCHROME")
f.Title.Text:SetPoint("CENTER")
f.Title.Text:SetText("Scrabble's Addon")
In this code I’ve used the buttons OnClick scripts to just print some text to the chat window not exciting but gives a very small idea of how you might create other objects (frames, buttons, fontstrings etc.) and arrange them to build up your addon.
The addon sreates a frame as a child of UIParent (the frame that hides everything when you Alt-Z). Sets its size and location (CENTER and because no relative frame passed in the SetPoint function, the parent is used ie. center of screen).
It uses a backdrop to display the border and background with game supplied images but you could also create one or more child Texture regions with custom images instead)
f.Tab1 and f.Tab2 are two default game style buttons created using the UIPanelButtonTemplate. The template supplies the button images (normal, highlight, pressed) and fontstring used to display the text.
The SetPoints for each button “Anchor” them to the parent frame with f.Tab1 to the bottom left of the frame itself and f.Tab2 anchors it’s left side to f.Tab1’s right side.
The books are still a good starting source but are large for a reason, there’s a lot to this, but once you start to get a handle how the bits work together it becomes much easier.
![:wink:](https://d38bqls1q93fod.cloudfront.net/en/wow/images/emoji/twitter/wink.png?v=6" ":wink:")
.