New Unity3d user interface: How to set the interactive area of ​​a button larger than the attached image?

Question

I need this because image is small and difficult to touch on a mobile device. Therefore, I need to have a large area of ​​the interacting zone, but the image should remain small.

Answer 1

I believe that the most correct way to make such a button is this:

• Create a new button, delete the default child text.
• Set the Width and Height buttons as you need for the click size.
• Add the Vertical Layout Group component to the button.
• Set Padding for the Vertical Layout Group desired difference between hitzone and visuals.
• Remove the default Image component. Set the default alpha value of Image to zero.
• Put your image as a child of Button.
• Correct the hue: drag (or otherwise set) the Image child field in the Target Graphic Button .

Answer 2

You need to configure it so that the image is inside the button object. Like this:

That way, you can have the button as large as you want, and the image can be of any size. If you do not need the background image of the button, just make the color transparent in the image component of the Button object.