(made in photoshop)
But I can’t get the background image to be at 50% transparency despite using Appearance>Color and opacity. It’s either 100% colored or 100% invisible. I’ve even tried importing the image with transparency applied in photoshop but i get the same result.
I’m also having trouble with the rendering quality of opacity on some image assets such as my selection highlight. The asset should have a flowing transparency gradient but only displays up to a certain opacity.
And finally i’m having some issues with overall quality, i’m often getting a jagged black border around multiple objects including images, buttons and text. All assets are clear in the widget editor but not when displayed in 3D space. You may also be able to notice it in other screenshots.
Instead of using textures as SamWal, I try getting a transparent border.
Make new Project (c++ shooter in my case)
Make new Widget, insert border, set BrushColor.Alpha = 0.2
Make actor, add Widget component, set widget
List item
place actor in the world → Border not visible (is also not visible within the actor viewport)
Set Widget Border BrushColor.Alpha = 0.5 → widget visible, but fully opaque.
Alpha < 0.4: Invisible. Alpha > 0.4: Fully opaque. This is somewhat the
same what the third image of SamWal is showing. Fully opaque until a
certain treshold where it gets fully
invisible.
So after testing I believe I have found the reason as to why this is occurring. Since your border/texture you are trying to render has translucency, you need to set the Blend Mode within the Actor Blueprint for the Widget itself from ‘Masked’ to ‘Transparent’, as seen in the below image.
As you can see it is rendering as expected. Since you are using a gradient from 1.0 to 0.0 for opacity, using the masked blend mode is going to clip out anything up to the masked clipping value/threshold. This is why you need to use the translucent blend mode so you can render the entire gradient.