1

I have a button with image (on UI canvas) that is partitially transparent. Clicks are triggered only when clicked on the non-transparent part. I need clicks to trigger everywhere, even on a transparent image. How can I achieve it?

Tamás Sengel
  • 55,884
  • 29
  • 169
  • 223
Fippo
  • 51
  • 1
  • 5
  • Please provide enough code so others can better understand or reproduce the problem. – Community Nov 28 '21 at 14:05
  • Does this answer your question? [How to detect click/touch events on UI and GameObjects](https://stackoverflow.com/questions/41391708/how-to-detect-click-touch-events-on-ui-and-gameobjects) – Ruzihm Mar 29 '22 at 19:47

2 Answers2

0

really simple put the button component on to your image (as best inside the Canvas) then you check inside the button component that "Interactable" is checked as well as the your transparent image is "Raycast Target" is checked, otherwise you can not do it. if you have objects inside the game (like a door) you could ask inside a script which is stored on to the "door" (example)

if (Input.GetMouseButtonDown(0)){ // if left button pressed...
 Ray ray = camera.ScreenPointToRay(Input.mousePosition);
 RaycastHit hit;
 if (Physics.Raycast(ray, out hit)){
   // the object identified by hit.transform was clicked
   // do whatever you want
 }
}

i hope this helped already if its not or you want to give positiv feedback feel free to use the comment section.

[EDIT] oh sorry i did missunderstood your question, under the button component you can change the colors individually like when its hovered or pressed do all of that to fully transparent by drag down the A value in the color picker.

andAnother1
  • 168
  • 1
  • 12
  • as long as your button isnt deactivated you should be good to go with this as long as you have the image and the button component active and checked the checkboxes i told in my answer – andAnother1 Nov 24 '21 at 13:49
  • I think you still don't understand the question correctly: OP has an icon with some parts transparent, some not. OP claims that currently clicks are only working correctly on the non-transparent parts and wants to have it working also on the transparent parts. – derHugo Nov 24 '21 at 14:03
  • then my solving way will work, is it UI (inside Canvas) or is it inside your game scene (like a prop)? – andAnother1 Nov 24 '21 at 14:29
  • The question as about ui inside canvas. I use a standart Button OnClick function. It works well, but only with non-transparent images. My image has transparent parts on it, and when you click on a transparent part - nothing happens. – Fippo Nov 24 '21 at 18:40
  • how did you made the image transparent? i hope you just dragged down the A value inside the color picker, and not disabled the image component, this is important for raycast your hit thats why the image needs to be "RayCast Target" – andAnother1 Nov 25 '21 at 06:12
0

Add an Image component to the game object you have the Button component added to, and set its color to a color with 0 opacity.

Tamás Sengel
  • 55,884
  • 29
  • 169
  • 223