Thread Tools Display Modes
10-17-10, 02:47 PM   #1
Shanyn
A Deviate Faerie Dragon
Join Date: Nov 2009
Posts: 16
Circluar frame/mask with kgPanels - help me understand how?

So let's say I have a square unit portrait, and I'd like to make it into a circle with a thin border. Like this:


Can someone give me the basics on how I might make all the square corners and bits outside the circular texture transparent?

Note: I understand photoshop. Alpha channels, masks, all that stuff--I can make any TEXTURES I need for this without explanation. What I don't understand is the actual execution. How many textures I need, what to mask in which--it seems like I'd take a transparent texture and mask out the corners, but... if it's a transparent texture... wouldn't it do nothing?

I know it's possible; I have an example of a UI that does this (here), but I've looked at the textures in the art pack and still can't figure out exactly how.
  Reply With Quote
10-17-10, 04:21 PM   #2
Maul
Ion Engines, Engage!
 
Maul's Avatar
AddOn Author - Click to view addons
Join Date: Mar 2005
Posts: 401
You have to trick the eye. If you look at circle skins for buttons, you will notice they have a black ring on the outside or inside of the visual circle to cover the square edges.

There is no true way to mask-off a texture. I have asked for this in the past but was told that the graphics engine the UI uses would have to be re-done, which would be low-priority since the existing engine works fine for Blizzard's UI.
__________________

Twitter: @IonMaul | Windows Live: [email protected] | Google Talk: [email protected]
  Reply With Quote
10-21-10, 07:54 PM   #3
Grimsin
A Molten Giant
 
Grimsin's Avatar
AddOn Author - Click to view addons
Join Date: Sep 2006
Posts: 990
that isn't true for the minimap though is it? i know i masked the minimap from circle to square and back again via Minimap:SetMaskTexture([[Interface\BUTTONS\WHITE8X8]])

without having to compensate the edges. i always thought this is how the circle buttons were done but as i have never used circle buttons other then the ones that were in Necrosis i have no idea.

has anyone tried setting the mask texture to their own mask file? or to any number of the files in bliz's art that would work? is that not how the fancy hud bars are done to?

edit - and to answer the initial question to some degree - No, you would not use a transparent texture but rather you would have to set the player portrait texture mask to a circle, a white one? I think. At lest that is how i would think to do it. That is how i did it with the minimap via the code line i entered above. This may be something only the minimap can do but as i have seen a ton of round char portrait stuff and i know the char portrait stuff has a ton of special functions in its code, i would go look through that and see if you find something there maybe and try that line above.
__________________
"Are we there yet?"

GrimUI
[SIGPIC][/SIGPIC]

Last edited by Grimsin : 10-21-10 at 07:59 PM.
  Reply With Quote
10-22-10, 12:43 AM   #4
Shanyn
A Deviate Faerie Dragon
Join Date: Nov 2009
Posts: 16
Thank you for the assistance, I'll look into that. I know the basic circular char portraits are actually built in to WoW itself, but I was looking to do 3D ones, which are only ever square in any unit frame addon I've used.

Last edited by Shanyn : 10-22-10 at 12:54 AM.
  Reply With Quote
11-13-10, 01:10 PM   #5
jeffy162
A Pyroguard Emberseer
 
jeffy162's Avatar
AddOn Author - Click to view addons
Join Date: May 2009
Posts: 2,364
I know this is a bit late, but have a look at how SquidFrame does it. I'm not sure if the 3D portraits are round, though.
  Reply With Quote
11-23-10, 05:36 AM   #6
Lyelu
A Cyclonian
AddOn Author - Click to view addons
Join Date: Oct 2010
Posts: 44
I was working on the same thing... Maul's right. The only place that masking works in-game is in the minimap.


If you will look closely at the image you linked, the layers will be like this, from bottom to top:

1. A round background, which is transparent at the outer edges.
2. A square 3d portrait, which is smaller than the background.
3. A round overlay, which shades away the bottom edges, so you can't see the fact that the very bottom of the 3d portrait isn't there.

I'll be done with my oUF in a week or so, if you want to bookmark my portal, then you could use the oUF code after it's done. I also have a page there about graphics, if you need to know how to get your TGAs to be transparent.

It does seem like Blizz uses round portraits, but I am fairly (90%) certain there's no way we can. Which makes no sense, but I'm not queen of the world so I didn't get to decide.
  Reply With Quote
11-23-10, 12:26 PM   #7
Xubera
A Cobalt Mageweaver
 
Xubera's Avatar
AddOn Author - Click to view addons
Join Date: May 2009
Posts: 207
SetPortraitToTexture(texture or "texture", "texturePath") - Sets the texture to be displayed from a file applying a circular opacity mask making it look round like portraits.
__________________
Chat Consolidate is the solution to any out of control trade chat. Ignore lines, throttle chat, consolidate posts!Follow the link to find out how!

▲ ▲ WoWInterface wont let me triforce >.>
  Reply With Quote
11-23-10, 03:37 PM   #8
Dawn
A Molten Giant
 
Dawn's Avatar
AddOn Author - Click to view addons
Join Date: May 2006
Posts: 918
Originally Posted by Xubera View Post
SetPortraitToTexture(texture or "texture", "texturePath") - Sets the texture to be displayed from a file applying a circular opacity mask making it look round like portraits.
That works for 3D, too? Seems like this is only used for 2D. Worth a try, though.
__________________
Rock: "We're sub-standard DPS. Nerf Paper, Scissors are fine."
Paper: "OMG, WTF, Scissors!"
Scissors: "Rock is OP and Paper are QQers. We need PvP buffs."

"neeh the game wont be remembered as the game who made blizz the most money, it will be remembered as the game who had the most QQ'ers that just couldnt quit the game for some reason..."

  Reply With Quote
11-23-10, 05:31 PM   #9
Lyelu
A Cyclonian
AddOn Author - Click to view addons
Join Date: Oct 2010
Posts: 44
I did try earlier (for a good hour this morning, while researching the topic) and couldn't even get WoW to recognize the name SetPortraitToTexture or SetPortraitTexture. Want to provide a working example, please? I think if they did work, which they might outside my oUF, but I couldn't convince them to work in oUF), then the resulting image would probably be flat, leading to the look like in SquidFrame picture.

Last edited by Lyelu : 11-23-10 at 05:37 PM.
  Reply With Quote
11-24-10, 12:50 AM   #10
zork
A Pyroguard Emberseer
 
zork's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2008
Posts: 1,740
Marked for testing.
__________________
| Simple is beautiful.
| WoWI AddOns | GitHub | Zork (WoW)

"I wonder what the non-pathetic people are doing tonight?" - Rajesh Koothrappali (The Big Bang Theory)
  Reply With Quote
11-24-10, 06:57 AM   #11
Xubera
A Cobalt Mageweaver
 
Xubera's Avatar
AddOn Author - Click to view addons
Join Date: May 2009
Posts: 207
i didnt realize it was 3d, didnt see that in your initial post
__________________
Chat Consolidate is the solution to any out of control trade chat. Ignore lines, throttle chat, consolidate posts!Follow the link to find out how!

▲ ▲ WoWInterface wont let me triforce >.>
  Reply With Quote
11-24-10, 08:38 AM   #12
Elloria
An Onyxian Warder
 
Elloria's Avatar
AddOn Author - Click to view addons
Join Date: Nov 2007
Posts: 358
Man if you guys figure this out i have a few interfaces that would certainly benefit from this.
__________________
  Reply With Quote
07-04-11, 01:06 PM   #13
Elloria
An Onyxian Warder
 
Elloria's Avatar
AddOn Author - Click to view addons
Join Date: Nov 2007
Posts: 358
Any luck on figuring this out yet?
__________________
  Reply With Quote
07-06-11, 05:47 AM   #14
zork
A Pyroguard Emberseer
 
zork's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2008
Posts: 1,740
Yeah I did. It is worthless. What it does it applies an radial mask to a rectangular texture. But you can do the same and even better by adding a radial alpha layer yourself in the TGA file.

It only makes sense if you want to apply it to textures that have no radial mask by itself.

Where it _can_ be cool is actionbutton and aura icon textures. (You could make them all radial)

My Test: http://code.google.com/p/rothui/sour...trunk/rGalaxy/
http://code.google.com/p/rothui/sour...xy/rGalaxy.lua
__________________
| Simple is beautiful.
| WoWI AddOns | GitHub | Zork (WoW)

"I wonder what the non-pathetic people are doing tonight?" - Rajesh Koothrappali (The Big Bang Theory)

Last edited by zork : 07-06-11 at 05:53 AM.
  Reply With Quote

WoWInterface » Developer Discussions » Graphics Help » Circluar frame/mask with kgPanels - help me understand how?

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