How to created highlightable button of a rounded UI panel

Question

I'm trying to create a set of toggle buttons. My panel has rounded edges using a sliced sprite. This is how it looks…

alt text

But if I highlight that top button, I get bleeding out of the rounded corners…

alt text

I can solve this if I use an image for the button which has rounded corners…

alt text

But this creates a new issue. Because I'm using a Vertical Layout Group to keep the buttons aligned and sized, after I add this image for the top button, it makes it larger than all the other buttons. (You can see this in comparison to the size of the 3rd button).

How can I resolve this so that I don't get bleeding outside the border but they each stay equal in size?

Answer 1

Best Answer

Answer by blueteak · Dec 06, 2014 at 07:22 PM

I think you want to look at UI Masks, http://unity3d.com/learn/tutorials/modules/beginner/ui/ui-mask

Add comment · Show 2 · Share

Essential · Dec 06, 2014 at 07:44 PM 0

Share

Ah, that seems like the better route! :)

bentoBAUX · Mar 13 at 09:48 AM 0

Share

Hi, will you share how you have solved this please?

How to created highlightable button of a rounded UI panel

1 Reply

Your answer

Follow this Question

Related Questions