Making resizable frames

Resizable frames can be resized by holding down a specified mouse button over a frame and then moving the mouse to resize the frame in a specified direction. This tutorial shows example code to make a resizable window.

Create the frame
local myFrame = CreateFrame("Frame", "MyFrame", UIParent) frame:SetWidth(500) frame:SetHeight(300) frame:SetPoint("CENTER", UIParent, "CENTER")

Frame background and border
backdropInfo = { bgFile = "Interface\\Buttons\\WHITE8X8", edgeFile = "Interface\\Buttons\\WHITE8X8", edgeSize = 1, insets = { left = 1, right = 1, top = 1, bottom = 1, }, } frame:SetBackdrop(backdropInfo) frame:SetBackdropColor(0,0,0,1) -- Black background frame:SetBackdropBorderColor(1,1,1,1) -- White border

Make the frame resizable
frame:RegisterForDrag("LeftButton") frame:EnableMouse(true) frame:SetResizable(true) frame:SetMinResize(300,200) -- The minimum height & width the frame can be resized frame:SetMaxResize(800,500) -- The maximum height & width the frame can be resized

Resizing Handlers
frame:SetScript("OnMouseDown", function(self, button)  self:StartSizing   self.isMoving = true   self.hasMoved = false end) frame:SetScript("OnMouseUp", function(self)  if self.isMoving then     self:StopMovingOrSizing     self.isMoving = false     self.hasMoved = true   end end)


 * self:StartSizing defaults to resizing to the "bottomright" direction. But you can specify other directions to resize. For example self:StartSizing("topleft") or self:StartSizing("right"). Valid points are "top", "topright", "right", "bottomright", "bottom", "bottomleft", "left", "topleft".