Button with an image problem

Unity Engine
1

Hello
I purchased UI from the store and there is these buttons image with lot of padding around it
The problem is that I assigned it to a button, and the button is clickable where the red arrow is Outside of the button it self?

Removing the padding around the button will show a warning about unable to compress the button, since it height x width does not go with the power of two

Is there a solution for this how can I work around it or fix with the editor or made the collision only inside the button

2
  • POT problem could be solved with SpriteAtlas asset. You could make an atlas with only one image if you want to but usually you should pack more into it while ensuring POT and thus compression compatible.
  • GraphicRaycaster works on the bounds of Graphic component. Image is one of them. So the transparent area counts. However I would say what you actually want is a button that could be touched outside of the graphic especially on mobile device where finger accuracy may be off. I made my button prefab to contain a different transparent graphic bigger than the button just to catch the GraphicRaycaster.
3

Thank you for your fast replay, I will look into SpriteAtlas asset
I will probably wont release it on mobile, but thank you for the tip I will have this in my head in the future