Photoshop Question posted in
The official user guide can be found here.

Custom Shaped Buttons Unity UI – Photoshop

Hi I am trying to create custom buttons on unity (trapeziums). I successfully created the visible area on Photoshop and imported it as Sprite 2D UI as per the following image:

enter image description here

The issue arises, when I’m trying to select one of the buttons in game, their border overlap each other, since the transparent area is still being considered as part of the clickable button area. How can I remove this?

enter image description here

EDIT:

Practically when I import I want the squared boxes to not be counted with the image. I need the edges of the orange area to be cut flush with that and not the entire area(i.e. including the transparent boxes).

enter image description here

Tags:

2

Answers


  1. 0

    The clickable area is based on the Rect Transform component of the GameObject. Adjust the width and height to the clickable area you want. You may have to crop your image in photoshop accordingly. If you select ‘Gizmos’ in the editor you can toggle viewing the click region.

    enter image description here

    Login or Signup to reply.
  2. 0

    You may achieve this by using Alpha Hit Test Minimum Threshold. Take a look at this nice video tutorial.

    There is one extra step that is not shown in the video but mentioned in the comments: you have to change "Mesh Type" to "Full Rect" and not "Tight" as it is.

    Hope that helps.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search