Texture oddity when placing a frame.

[Subere]

So I was messing around with my buff frame and depending on how I set the point for the frame it changes the way to texture looks. Was wondering if you anyone could tell me why?

self.Buffs:SetPoint('TOPRIGHT', UIParent, 'TOPRIGHT', -137, -19)

Produces: http://i26.tinypic.com/i4jsro.jpg

self.Buffs:SetPoint('RIGHT', UIParent, 'RIGHT', -137, 393)

Produces: http://i29.tinypic.com/egtxs6.jpg


As you can see with the first example it moves the texture down a bit and the top border looks like it becomes thicker. The second example is what is desired look wise but I can see it causing problems when releasing my layout as it is very dependent on your current resolution.

The only difference in the screenshots code wise is the lines posted.

Thanks for any insight anyone can give.

[zero-kill]

Which addon is this displaying? My eyes must not be very good, cause they look identical to me.

[v6o]

I'm pretty sure WoW streches "pixels" to fit resolution / ui scale.

[Subere]

It's oUF but I'm sure it's a WoW thing and not an oUF thing.

The difference between them is the first one gets scrunched down and it makes the top border appear thicker compared to the second one.

I figure as much that WoW scales things but I don't understand why the anchoring point changes the image at all? They're placed in exactly the same spot and nothing else was changed. The only difference is one is placed in that exact spot via the TOPRIGHT anchor and the other using just RIGHT.

[lilsparky]

are you setting any other points?

RIGHT by itself will only adjust horizontal placement and leave vertical alone (which would equate to centered vertically).

TOPRIGHT, of course, is explicitly referencing both vertical and horizontal placement.

my guess is that you've "pinned" the bottom of your texture and the TOPRIGHT setpoint is stretching it beyond its normal height (which must have been set via SetHeight). the RIGHT setpoint function is leaving the height alone and simply stretching to the desired width.

edit: if these items are potentially set up prior to your messing with them, then you can ClearAllPoints() to make sure you delete any prior anchors.

[Subere]

I'm guessing you're right and that is the problem although I'm not quite sure how it's happening.

Each buff frame is set to a width/height of 23. For each buff the buff icon and border texture are set to the same dimensions. The icon texture and the border are both positioned by SetAllPoints() on the original 23x23 buff frame.

[Seerah]

It's generally a good idea to call frame:ClearAllPoints() before setting a new anchor point.

[Subere]

I just went and called ClearAllPoints() on the buff frame, icon, and border texture and then reset them, and the difference between TOPRIGHT and RIGHT is still there.

[lilsparky]

Originally Posted by Subere I just went and called ClearAllPoints() on the buff frame, icon, and border texture and then reset them, and the difference between TOPRIGHT and RIGHT is still there.

can you post the entirety of your point setting calls for this item? include width and height assignments as well.

you might also try changing the size of the reference frame just to see how the item is being attached. it's easier to figure things out when the offsets are larger than a single pixel here or there.

[Subere]

Well this is kind of just pulling bits where I can find them being set. This is an oUF layout.

The frame:

local button = CreateFrame("Button", nil, icons)

button:SetWidth(23)
button:SetHeight(23)

The buff icon:

local icon = button:CreateTexture(nil, "BACKGROUND")
icon:SetAllPoints(button)

The border:

local overlay = button:CreateTexture(nil, "OVERLAY")
overlay:SetTexture"Interface\\Buttons\\UI-Debuff-Overlays"
overlay:SetAllPoints(button)

Each buff is in the buffs frame and that is the frame positioned as shown above.

The buffs frame:

self.Buffs = CreateFrame('Frame', nil, UIParent)

self.Buffs:SetHeight(23)
self.Buffs:SetWidth(645)
--self.Buffs:SetPoint('TOPRIGHT', UIParent, 'TOPRIGHT', -137, -19)
self.Buffs:SetPoint('RIGHT', UIParent, 'RIGHT', -137, 393)

[Waverian]

This is a wow side 'problem.' Feature, technically. The wow UI resolution is 1024 x 768. Pixels in wow are drawn as the UI resolution, divided by the screen width (or height), divided by UI scale. From what I understand this is an anti-aliasing mechanic, so if the width of your texture doesn't fall on a particular 'wow ui pixel' it is cropped to fit.

So for me, 1 pixel wide is:

768 / 1280 / .64 = .9375 pixels.

The way I implement this into my layouts is with this:

local Px = function(num, height)
	if height then
		return 768 / GetScreenHeight() / UIParent:GetScale() * num
	else
		return 1024 / GetScreenWidth() / UIParent:GetScale() * num
	end
end

I also sometimes use numbers like N.25, N.5 and N.75 to reduce the chances of getting an uneven texture. This isn't foolproof but it does make it significantly easier to deal with precise small pixel elements like borders on different resolutions and different screen positions.

Although this is a bit of a tangent to the topic. When dealing with border textures I haven't found a solution for this problem. Unless you're manually creating your texture side-by-side in game, you can't control the width of them. If you're using SetAllPoints() you can slightly fine tune it by using

:SetPoint('TOPLEFT', xOff, yOff)
:SetPoint('BOTTOMRIGHT', xOff, yOff)

but there's you've only got a few pixels to work with before the border gets distorted.

The best solution is to just shift the entire buff frame around a few pixels until you find the right look. It's annoying but generally something being 5 pixels off from where you want it to be isn't too bad (assuming you move any paired elements to match the offset, i.e. the minimap in this case)

[Subere]

Thanks a bunch for your reply.

It still escapes me how it looks different when they're being placed in the exact same spot just from a different starting point. I guess it just ends up being that fraction of a pixel that makes it stretch.

I just ended up making them 1px smaller and shaving a very small bit off the top with SetTexCoord.

This 'feature' has driven me nuts ever since I've started playing around with my UI. All the time get extra pixels on things and I've always played with AA completely off even though my comp can handle it just because it makes all the borders and such on things super fuzzy and that annoys me more than the rough edges on models.

Was just keeping my fingers crossed in hopes that it wasn't the case. Oh well. Thanks again to all those that were trying to help.

[lilsparky]

oh i see. i didn't catch that object you were moving wasn't the actual texture itself and was instead the frame that ultimately controls their placement via reference points.

how are you determining that 393 up from the center is the same 19 down from the top for the UI parent? i think that is the essence of the quirk you're experiencing.

[Subere]

I took a screenshot of it at 0 up and measured it. I took a screenshot after at both alignments and they line up with the top pixel of the minimap perfectly.

[lilsparky]

Originally Posted by Subere I took a screenshot of it at 0 up and measured it. I took a screenshot after at both alignments and they line up with the top pixel of the minimap perfectly.

what you should notice is that with a height of 23, your RIGHT anchor point lies between whole units -- it is 11.5 units from the top corner of the buff frame.

setting the RIGHT to be 393 units up from the RIGHT of the UIParent would be the same as setting the TOPRIGHT to be 404.5 units up from the RIGHT of the UIparent.

similarly, setting the TOPRIGHT to be 19 units down from the TOPRIGHT of the UIParent, should be mathematically identical to setting the RIGHT to be 30.5 units down from the TOPRIGHT of the UIParent.

you should do 393.5 up from right to have the math work out properly, i believe.

[Subere]

The initial problem with positioning it from the RIGHT of UIParent was that the measurement will be different for every screen resolution. Where as TOPRIGHT would be generally in the same area (the top right corner) where on some screens RIGHT could end up in the middle of the screen easier than TOPRIGHT would.

Aligning from RIGHT / RIGHT gives me the look I want so I'm not sure why I'd change to TOPRIGHT / RIGHT as you've suggested as it may either change the look or be the same but still have the initial problem of anchoring from the RIGHT.

I'll try RIGHT / TOPRIGHT and see if that gives a desired result.

Sorry if I missed the point of your post :s I do appreciate the help though.

[lilsparky]

i'm not really suggesting any method over another, i'm just pointing out why they are different. one method is inherently offset from the other by .5 units and unless you account for that in your vertical offset, the two placements are putting the frames in slightly different locations (even tho some of the frames ends up in the same spot).

i was just addressing your question as to why the two placements were different even tho they were "the same".

assigning the position from the TOPRIGHT makes more sense since that's the closest anchor. if it looks funny, then as waverian said many posts ago, throw in the fractional offset to see if it corrects itself.

[Subere]

Ah ok, I got you now. Yeah I just offset it by .5 and it's all good now. Could've sworn I tried that yesterday and it still looked off. Guess it was just my eyes playing tricks on me, it was late :s

Thanks again for all the responses and help, I greatly appreciate it :]