Soft shadow for Unity UI Image

Question

What is the best approach to implement a soft shadow around the outline of a Unity UI Image? I want to achieve the effect below:

(Image Source: YouTube video: Soft Shadow UI || Unity 5)

My current approach is to manually add a shadow Image behind the main Image. For example, see below screenshots:

However, I find this approach tedious and messy from a workflow perspective, because I have to manually add this shadow GameObject to my GameObject hierarchy every time I want to add a soft shadow to a UI Image.

While I think it's possible to improve on this current workflow slightly, is there a better approach?

---

Note that I also tried Unity's built-in Shadow effect component:

This is a drop shadow and not a soft shadow effect I am looking for.

But I think this approach shows an ideal workflow, where it's as simple as adding a shadow component to a GameObject with an Image.

Answer 1

Procedural UI Image by Josh H on the Unity Asset Store looks promising.

Create an infinite number of basic shapes without a ton of image resources. Control and animate border-width and border-radius. It is perfect for creating flat styled UI. Easy to understand and well-commented code along with a PDF documentation will keep this package extendable.

Main features:

[...]

➤ Fall-off: can be used for soft shadow effect or glow

---

Other "procedural UI" packages may also support soft shadows.

There are some new UI assets on the Asset Store that have been released since this question was asked, e.g. True Shadow - UI Soft Shadow and Glow (beta) by Tai's Assets.