Thread Tools Display Modes
09-11-15, 05:04 PM   #1
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Backdrop and resizable/movable frames

I have a frame using this backdrop:
Lua Code:
  1. local Backdrop = {
  2.    bgFile      = db.PATH.."BackdropBG",
  3.    edgeFile    = db.PATH.."BackdropEdge",
  4.    edgeSize    = 8,
  5.    insets      = {left = 8, right = 8, top = 8, bottom = 8}
  6. }

The edge file is made up of 8x8 tiles and is correctly configured, however, when the frame can be moved and resized, the backdrop doesn't always draw correctly. Any idea why this is happening, and if so, a way to circumvent or even prevent it?

It looks like it moves one line from the top edge to the bottom edge, or occassionally it moves a line from the left edge to the right edge.

Correct:


Incorrect:
__________________

Last edited by MunkDev : 09-11-15 at 08:28 PM.
  Reply With Quote
09-11-15, 08:29 PM   #2
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Here's a gif, vaguely showing the issue inside a moving scrollframe:

Quality is bad, but good enough to spot the flickering edge file.
__________________
  Reply With Quote
09-12-15, 05:56 AM   #3
myrroddin
A Pyroguard Emberseer
 
myrroddin's Avatar
AddOn Author - Click to view addons
Join Date: Oct 2008
Posts: 1,240
That gif is hard to follow with the bouncing. It is just better to post with the code tags or Lua button.

Anyway, the error is simple: loc1 is presumably undefined, or if it is, your assignment of it is incorrect. Depending on what you want (can't see the rest of your code):
Code:
loc1 = 11
-- or
loc1 = loc1 + 11
  Reply With Quote
09-12-15, 06:00 AM   #4
Lombra
A Molten Giant
 
Lombra's Avatar
AddOn Author - Click to view addons
Join Date: Nov 2006
Posts: 554
Originally Posted by myrroddin View Post
That gif is hard to follow with the bouncing. It is just better to post with the code tags or Lua button.

Anyway, the error is simple: loc1 is presumably undefined, or if it is, your assignment of it is incorrect. Depending on what you want (can't see the rest of your code):
Code:
loc1 = 11
-- or
loc1 = loc1 + 11
You didn't really read the thread at all, did you? :P
__________________
Grab your sword and fight the Horde!
  Reply With Quote
09-12-15, 07:34 AM   #5
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Originally Posted by myrroddin View Post
That gif is hard to follow with the bouncing. It is just better to post with the code tags or Lua button.

Anyway, the error is simple: loc1 is presumably undefined, or if it is, your assignment of it is incorrect. Depending on what you want (can't see the rest of your code):
Code:
loc1 = 11
-- or
loc1 = loc1 + 11
Lol! This is a lua IDE I'm working on. The error is intended to draw the error tooltip, which has the graphical error I can't figure out. I didn't think the OP was that wordy?
__________________
  Reply With Quote
09-12-15, 08:45 AM   #6
Lombra
A Molten Giant
 
Lombra's Avatar
AddOn Author - Click to view addons
Join Date: Nov 2006
Posts: 554
Originally Posted by MunkDev View Post
Lol! This is a lua IDE I'm working on. The error is intended to draw the error tooltip, which has the graphical error I can't figure out. I didn't think the OP was that wordy?
Didn't realise you were referring to the tooltip in that GIF! That looks like it could be plain old aliasing from it being drawn on fractions of pixels.
__________________
Grab your sword and fight the Horde!
  Reply With Quote
09-12-15, 08:52 AM   #7
Gethe
RealUI Developer
 
Gethe's Avatar
Premium Member
Featured
Join Date: Sep 2008
Posts: 942
This is a general issue with single pixel lines. As the tooltip moves, the border will occasionally get between pixels which results in that line becoming dimmer.

One way you can work around this is ensuring that 1) both the width and height are whole numbers and 2) the frame is positioned on whole pixels. Using floor() and/or ceil() can help in both cases.

Also, if you're not anchoring corner to corner, you may need to add .5.
__________________
Knowledge = Power; Be OP

  Reply With Quote
09-12-15, 10:31 AM   #8
ObbleYeah
A Cobalt Mageweaver
AddOn Author - Click to view addons
Join Date: Sep 2008
Posts: 210
I've used

Lua Code:
  1. UIParent:GetScale()/frame:GetEffectiveScale()

to fix borders with this issue on corner to corner offsets
  Reply With Quote
09-12-15, 01:56 PM   #9
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Originally Posted by Gethe View Post
This is a general issue with single pixel lines. As the tooltip moves, the border will occasionally get between pixels which results in that line becoming dimmer.

One way you can work around this is ensuring that 1) both the width and height are whole numbers and 2) the frame is positioned on whole pixels. Using floor() and/or ceil() can help in both cases.

Also, if you're not anchoring corner to corner, you may need to add .5.
By corner to corner, do you mean e.g. anchoring to top left of UIParent?
I tried applying this:
Lua Code:
  1. local function EditorStopMoveSize()
  2.     Editor:StopMovingOrSizing()
  3.     if  Editor.isSizing then
  4.         local width, height = Editor:GetSize()
  5.         Editor:SetSize(ceil(width), ceil(height))
  6.     elseif Editor.isMoving then
  7.         local point, _, _, x, y = Editor:GetPoint()
  8.         Editor:SetPoint(point, ceil(x), ceil(y))
  9.     end
  10.     Editor.isSizing = false
  11.     Editor.isMoving = false
  12. end

However, the problem remains. Adding .5 at the end of each calculation doesn't do the trick either.

Originally Posted by ObbleYeah View Post
I've used

Lua Code:
  1. UIParent:GetScale()/frame:GetEffectiveScale()

to fix borders with this issue on corner to corner offsets
Could you elaborate? This always returns 1 for me when fed with the frame I want to correct.
__________________

Last edited by MunkDev : 09-12-15 at 03:07 PM.
  Reply With Quote
09-13-15, 07:44 AM   #10
Gethe
RealUI Developer
 
Gethe's Avatar
Premium Member
Featured
Join Date: Sep 2008
Posts: 942
It's hard to say what else would need to be done without seeing the rest of your code, though I would also look at your scroll update too.
__________________
Knowledge = Power; Be OP

  Reply With Quote
09-13-15, 11:01 AM   #11
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Here's the git.

It's just a simple draft atm. Note that I removed the border from the tooltip, but the border still exists on the main frame.

The frame is constructed here, and the editor resizing happens here.

/dev to open the editor.
__________________

Last edited by MunkDev : 09-13-15 at 11:07 AM.
  Reply With Quote
09-15-15, 11:52 AM   #12
Gethe
RealUI Developer
 
Gethe's Avatar
Premium Member
Featured
Join Date: Sep 2008
Posts: 942
First, your OnDragStart/Stop hooks do not call your custom Move and StopMoveSize methods.

Second, instead of ceil() (not sure why I mentioned it tbh), I would round the vars using floor(var + 0.5). This is mostly to combat the fact that the numbers from GetPoint/GetSize could be +/- 0.0000002430 from the actual value. Rounding it simply gets the value back to what it should be, because when dealing with exact pixels such details make a difference.

UIParent can in most cases be assumed to have even numbered sides, and since the editor is anchored to UIParent it would be easier to just clamp the frame down the the nearest even number rather than worrying about half pixel positioning. This can easily be done using modulus (%). (Var % 2) evals to 1 if Var is odd, and evals to 0 if it's even.

The SetPoint was taken out of the if block to account for the width/height potentially being odd, and changing it to even. After using :StartSizing() the anchors of the frame are updated dynamically in the background, so if the width ends up being odd (e.g. 345) and you are anchored to the CENTER, the x offset might end up with a half (e.g. 45.5). When the side is then resized (e.g. 344), that point still remains and results in the border looking off.

Lua Code:
  1. function Editor:StopMoveSize()
  2.     if  Notepad.reFocus then
  3.         Notepad:Enable()
  4.         Notepad:SetFocus()
  5.         Notepad.reFocus = false
  6.     end
  7.     Editor:StopMovingOrSizing()
  8.  
  9.     if Editor.isSizing then
  10.         local width, height = Editor:GetSize()
  11.         width, height = floor(width + 0.5), floor(height + 0.5)
  12.         Editor:SetSize(width - (width % 2), height - (height % 2))
  13.     end
  14.  
  15.     local point, _, _, x, y = Editor:GetPoint()
  16.     Editor:SetPoint(point, UIParent, floor(x + 0.5), floor(y + 0.5))
  17.  
  18.     Editor.isSizing = false
  19.     Editor.isMoving = false
  20. end
__________________
Knowledge = Power; Be OP

  Reply With Quote
09-16-15, 10:16 AM   #13
MunkDev
A Scalebane Royal Guard
 
MunkDev's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2015
Posts: 431
Originally Posted by Gethe View Post
First, your OnDragStart/Stop hooks do not call your custom Move and StopMoveSize methods.
Woops. I fired it from the resize button and the tabs up top, but managed to forget about dragging the actual frame.

I initially tried to even the numbers using modulus, but took it out since it didn't solve the issue. I was not, however, clever enough to account for the centered anchor point. It seems to work as intended now.

Thanks for taking the time to investigate this.
__________________

Last edited by MunkDev : 09-17-15 at 01:47 PM.
  Reply With Quote

WoWInterface » Developer Discussions » Graphics Help » Backdrop and resizable/movable frames

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