Unity UI Image 的软阴影

10

如何在Unity UI图像周围实现柔和阴影的最佳方法? 我想要达到下面的效果:

desired-soft-shadow

(图片来源:YouTube视频:Soft Shadow UI || Unity 5)

我目前的方法是在主图像后面手动添加一个阴影图像。例如,如下屏幕截图所示:

button-with-soft-shadow

scene-heirarchy

shadow-inspector

然而,从工作流程的角度来看,我认为这种方法很繁琐且混乱,因为每次我想要向UI图像添加柔和阴影时,都必须手动将此阴影游戏对象添加到我的游戏对象层次结构中。虽然我认为可能稍微改进当前的工作流程,但是否有更好的方法呢?
请注意,我也尝试了Unity的内置阴影效果组件

built-in-drop-shadow

我正在寻找的不是柔和阴影效果,而是投影阴影。
但我认为这种方法展示了一个理想的工作流程,只需向带有图像的GameObject添加阴影组件即可。

这不是问这个问题的正确位置,与编程或您尝试但无法工作的代码无关。更好的方式是在Gamedev stackexchange上提出这个问题:https://gamedev.stackexchange.com/ - FutureCake
1
很遗憾,我认为目前只有那个硬阴影组件...不过,该组件的源代码实际上已经在线上了:Shadow.csOutline.cs...所以有人可以尝试制作一个支持软阴影的自定义版本^^ - derHugo
1
我实际上尝试并查看了源代码...不幸的是,将其更改为软阴影不会那么容易...这有点像复制Uzi的6个顶点,并从中制作彩色叠加层...对于软阴影,需要以某种方式将原始的2个三角形分成多个,并相应地更改alpha值...但总的来说应该是可能的...无论如何,就目前而言,我建议你继续使用你已经使用的“图像”方式。 - derHugo
1
但是也许使用大纲更容易控制,可以尝试操纵大纲来模拟软阴影,就像图像处理方法一样。 - derHugo
1
@ΕυάγγελοςΜπίλης 目前还没有,因为我正在处理其他事情,所以我还没有深入研究它,但是如果我在未来发现任何其他信息,我会发布更新的。目前我能想到的只有derHugo建议的方法,以及与材料和着色器相关的方法。 - sonnyb
显示剩余6条评论
2个回答

2
我会将您当前的阴影分为三个图像:角落,边缘和背景。
然后,我会编写一个脚本,将这些图像实例化到所有角落、边缘和您要添加阴影的元素下方(用于背景),并确保它们具有正确的大小和方向。
该脚本还将处理以下参数:
- 浮点型强度(实际上改变了alpha透明度) - 浮点型扩展(拉伸图像) - 三维向量位置(简单平移,以便您的阴影从要添加阴影的图像中偏移)
然后,您就可以将其用于任何元素。

1

Procedural UI Image由Unity Asset Store的Josh H开发,看起来很有前途。

无需大量图像资源即可创建无限数量的基本形状。控制和动画边框宽度和边框半径。非常适合创建扁平化样式的UI。易于理解和注释良好的代码以及PDF文档将使此软件包具有可扩展性。

主要特点:

[...]

➤ 衰减:可用于柔和阴影效果或发光效果

fall-off-distance-param


其他“过程化UI”软件包也可能支持软阴影。

自从提出这个问题以来,Asset Store上发布了一些新的UI资源,例如Tai's Assets的True Shadow - UI Soft Shadow and Glow (beta)


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接