Drawing rectangles (for borders)

Guides UI and Macro
1

So if I just want a flat textured addon and want to draw borders (either around the whole “addon window( aka frame)” of just an area within in it I’m wondering what the best method would be?

eg:

For a border I could create my main addon frame, set it’s texture colour then create another frame fractionally smaller than the first one and a different colour.

Alternatively I could use frame.createline to draw four lines around the edge of my main addon.

And I wouldn’t be surprised if there are lots of other ways. So, just wondering what the best approach is?

2

A Backdrop is the most common. See Backdrop in:

local f = CreateFrame("Frame", "FizzleTestSomeFrameName", UIParent, "BackdropTemplate")
-- Simple backdrop so you can see it but style the frame how you like
f:SetSize(100, 100)
f:SetPoint("CENTER") -- or wherever you want the default anchor to be
f:SetBackdrop({ bgFile = "Interface/DialogFrame/UI-DialogBox-Background-Dark", edgeFile = "Interface/Tooltips/UI-Tooltip-Border", tile = true, edgeSize = 10, tileSize = 10, insets = { left = 1, right = 1, top = 1, bottom = 1, }, })
1 Like
3

That relies on an image to form the border though . So if you want to make it an unusual colour doesn’t that mean you have to create your own image file and reference it?

4

You can frame:SetBackdropBorderColor(...)

1 Like
5

Not a question you’ve asked, but you can use Paint.net software to easily make custom images for WoW.

It’s lighter weight than Gimp and Photoshop and works just fine.

It’s a free app, although the name will lead you to the wrong website.

If you want to try it, it’s at https://www.getpaint.net/download.html

It’s also a Windows app if you prefer to go that way.

1 Like
6

I already use Paint.net (it’s great and been around for ages) and also have Corel Painter, Corel Draw and Paintshop Pro installed (Humble Bundle is great!) It’s not so much a problem of creating a texture as just trying to avoid using them at all. :slight_smile:

Just trying to make a completely flat looking addon like say AstralKeys. So I was trying to avoid using image based textures where I can.

And I’d just like to say that thanks to the help from Gello on FizzleMizz I’ve now got my addon 90% working and themes implemented and they work a charm. I love being able to switch between a light mode and a dark mode. And now the framework is in place it’s super easy to add more so I knocked up a transparent theme and a grey scale theme that look pretty decent in half an hour.

It’s going to form the basis of any new ones I make too now that I understand it better and it’s relatively quick to implement and quite useful.

7

For making a flat frame with a flat border, I would just use an existing white swatch like Interface\ChatFrame\ChatFrameBackground and adjust the edgeSize to the pixel width of the border:

local f = CreateFrame("Frame","TestBackdrop",UIParent,"BackdropTemplate")
f:SetSize(150,150)
f:SetPoint("CENTER")
f:SetBackdrop( { bgFile="Interface\\ChatFrame\\ChatFrameBackground", tileSize=16, tile=true, edgeFile="Interface\\ChatFrame\\ChatFrameBackground", edgeSize=2 } )
f:SetBackdropColor(0.1,0.1,0.1,0.75) -- main area color
f:SetBackdropBorderColor(0,0,0) -- border color

If no transparency is involved, a texture in a texture works, and you can use textureSubLevels to make them order properly in the BACKGROUND drawLayer:

local f = CreateFrame("Frame","TestBorder",UIParent)
f:SetSize(150,150)
f:SetPoint("CENTER")

f.border = f:CreateTexture(nil,"BACKGROUND",nil,-2)
f.border:SetAllPoints(true)
f.border:SetColorTexture(0,0,0)

f.back = f:CreateTexture(nil,"BACKGROUND",nil,-1)
f.back:SetPoint("TOPLEFT",2,-2)
f.back:SetPoint("BOTTOMRIGHT",-2,2)
f.back:SetColorTexture(0.1,0.1,0.1)
1 Like