I have a button. When I click this button it adds 5 to the score. I use an image for this button and this image has a transparent parts. When I click on transparent parts it still adds 5 to the score. How can I achieve that when I press only on the visible part of the image it fires on click event?
I don’t think you can just per sé. The clickable area of a button is defined by the dimensions in the WidgetBlueprint and not by the transparency of a button’s image. So what you can do is create an extra Image under your button. If you then make the button texture fully transparent, and the scaling of the button quite small, you should get the desired effect. Yet, as far as I know, there is no thing as button masking. But i could be wrong here.
try this: go to the image that you are using and double click on it, this will open the image property, under “Level of Detail” (on the left panel) change the texture group to “UI”. and under “Compression” change the compression settings to “UserInterface2D (RGBA)” this will enable the Alpha channel (the transparent part) on your image.
second: inside your widget … select the button and under “Style” make sure the “draw as” is set to “image” for each state (Normal, Hovered, Pressed … etc.)
Unfortunately, it still fires OnClickEvent when I click on the transparent part of the image.
I couldn’t find any other way to make it work. I’ve just made some transparent buttons to cover my image and that works.
any solution ?