UI Clicking thought alpha of image

We have two UI images next to each other (see picture). when you click at the circle in the green area, the red area is triggert. This makes sense because the collision is a rectangle. However is it possible to let the event system ignore the parts of the image with a alpha of 1? or is there a other way to make this work?

Thanks already!

Hi,

I came from 2019 when google is not your friend, so let me show how do this…

step1

drag the img to your project → assets → wherever

Configure the img: sprite 2D to unity UI create a sprite child, Alpha for transparency and Enable read/wirte for code…
148018-sprite-setting.png

step2

Create a C# file and paste this code, remember to modify the class name equal your file name

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;

public class estado_click : MonoBehaviour, IPointerDownHandler 
{
	public Image img;
	
    void Start()
    {
		img.alphaHitTestMinimumThreshold = 0.5f;
	}

	public void OnPointerDown (PointerEventData eventData) 
	{
		GameObject.Find("GameObject").GetComponent<game>().estado_name( this.gameObject.name );
	}	

}

On hierarchy add canvas-> img and set sprite the img, set RAYCAST to click trigger.

Now select in hierarchy the images (hold control if need) and add the code created

step3

click in each image :drag the sprite to source and drag the image to script parameter;

Now when click the image call “estado_name” function with the img name as parameter.

i hope it helps.

Google is your friend.

check this one How to handle Raycast hit in Transparent Images | Unity 3D Tutorial | Overflow Archieves - YouTube