A little help creating a circular menu Thread last updated on 2007-11-18 12:28:25

Posted by member 387645 on 2007-11-17 12:51:22

Hello everybody, I was just wondering if someone here could help me with a little xLabel related issue.

I'm new to Litestep so please go easy on me. I'm trying to create a simple theme with a circular menu and for a week now I've been trying to make that happen with xLabel. I've got it to display correctly, to react to MouseOver events with respect to the alphamap in the PNG's I used but everything goes wrong on the MouseOut tracking. After I rollover it, and it changes the image, when I try to rollout, even if the mouse is over a completely transparent area the MouseOver won't trigger ( or at least the image won't change ). I somehow managed to fix that with an Overlayed label at the cost of a pinkish border around my menu item as seen in this image: ( http://www.greeneyedblog.com/litestep/mockup1.png ).

I'm willing to live with that and I tried adding another menu item right next to that one but whenever I mouseover one of the menu items, the other one's mouseevents won't follow the alphamap. So, even if no opaque areas overlap, when one item is mouseovered, if the mouse goes over the bounding box of the other it will trigger the event, even if it's on transparent area. Image here: http://www.greeneyedblog.com/litestep/mockup2.png

My question is: is there any way to make that menu work correctly using xLabel or any other module? I'm only interest in having correct mouse events ( mouseover, mouseout and click )

Here are the png's I'm using: http://www.greeneyedblog.com/litestep/roundmenu.zip

I appreciate any help. Thanks a lot.

Posted by member 32550 on 2007-11-18 04:07:43 link

That should be quite simple :)
1. Use xPaintClass-1.0 Update 4 (you can download it at http://www.ls-universe.info)
2. Use xLabel-4.1.1 (the latest version)
3. Use the "AlphaMap" setting
4. Don't use MagicPink or the "TrueTransparency" setting, because that are relicts from the Win98/Me times.

Btw.: I don't know for what reason you need the MouseEnter and MouseLeave actions, but in case you don't know all visual elements of a xLabel have builtin "Hover" and "Pressed" states. (Background, Overlays and Text/Font)

Posted by member 387645 on 2007-11-18 11:36:28 link

Thanks a lot for your answer.

I was allready using xLabel 4.1.1 and I updated the xPaintClass allthough the file I had was the exact same size as the one from ls-universe.info and it's the same behaviour (the MouseLeave tracking is not following the alpha map).
Do I have to use "myLabelHoverAlphaMap true" or something to that effect?

I need the MouseEnter and MouseLeave actions because I want to make a "clickless" interface.

Do you know some theme that uses a circular menu similar to mine? Maybe their code will inspire me...

Thanks again

Posted by member 32550 on 2007-11-18 12:28:25 link

Ok, my fault :P
With enabled AlphaMap you cannot have an exact OnMouseLeave!

Therefore your only choice atm is to set "AlphaMap" to false and "TrueTransparency" to true.
BUT: That means you cannot use AlphaBlended Edges on your PNG's. It must be a sharp MagicPink border.

Maybe a find a quick fix for this and update xLabel to version 4.1.2 in the next week.