Case Status
Log In


Home ยป Custom Button Shapes
Community Wiki

Custom Button Shapes

Q: How do I make a custom clickable shape for a button?



Use the Set Property action to set the alphaHitTestMinimumThreshold property on an Image component:

This lets you use the sprite's alpha channel when hit testing the button.

Note: In Unity 5.3 the property was called: eventAlphaThreshold


Example Setup

Let's say you have a Star sprite you want to use as a Button:

1. Setup the Star Sprite's import settings:

  • Select the Sprite asset in the Project View.
  • The Inspector shows the Import Settings.
  • Under Advanced, check Read/Write Enabled.
  • Also make sure the sprite is not Packed.

NOTE: In older versions of Unity, these settings are under Texture Type: Advanced.


2. Use the Star Sprite in the Button:

  • Select the Button and find its Image component.
  • Use the Sprite as the Source Image.
  • Adjust the Button's Width and Height (e.g., 100 x 100)


3. Use the Set Property action to set the Image alphaHitTestMinimumThreshold.

  • Add an FSM to the Button and select the Start State.
  • Drag the Button's Image component into the State panel.
  • From the popup menu select Set Property.
  • Select the alphaHitTestMinimumThreshold property.
  • Set the value to 0.5.

Note: You can also add the Set Property action from the Action Browser and set it up manually. Drag and dropping the component just saves you a couple of steps!


4. Now when you press Play, only the solid part of the star should be clickable!



  • This kind of hit-testing is a little more expensive than rectangular hit testing.
  • Set Property is slower than a custom action, but in this kind of situation where you're doing something once (not every frame) it really won't be noticeable.
  • Since making this tutorial Jean added a uGuiSetImageAlphaTestThreshold to the PlayMakerEcosystem.

Last modified on 1/29/2019 2:43 PM by User.

  • RSS Feed