• 欢迎来到莫知我哀的博客,日常不定时更新C++、C#、Unity、OpenGL、游戏开发相关文章。同步博客: CSDN
  • 网站左下角可以开启好听的背景音乐~~
  • 如果您觉得本博客很有看点,那么赶紧使用Ctrl+D 收藏吧

[Unity3D] Gradient Editor的使用

Unity3D wahh 1672次浏览 0个评论 扫描二维码

1. 前言

有时候,我们需要定义渐进色来实现一系列颜色变化的动画效果;传统做法可以使用Animation来做补间动画,这里我们可以使用一种新的方式——Gradient。相比起优势来说,Gradient比补间动画来说更容易直观看到颜色渐变的过程而且编辑较为方便。下面将使用Gradient来实现一个我们在FPS类游戏中常见的受击提示效果。

 

2. Gradient Editor

在场景中新建一个ImageUI,然后将素材图片Image01拖放至Image的Sprite属性中,如下:

新建脚本GradientScript并挂载到Image上,添加一个public的Gradient变量color,此时GradientScript组件会将color字段序列化到Image的Inspector面板上,点击color字段的颜色面板就会弹出Gradient Editor面板,如下:

简单介绍一下Gradient Editor面板的属性:

  • Mode : 渐进模式,有两种Blend(混合)和Fixed(固定)。
  • 渐进颜色调色板:调色板可以在上方或者下方添加Key,不同的是上方添加的是AlphaKey,下方添加的是ColorKey,通过这两种Key可以很灵活的控制渐进颜色。
  • Presets:我们可以将调制好的渐进颜色存放至最近记录,这样的话在其他Gradient属性的Editor面板可以很灵活的使用这些预制。

我们在9%的位置添加一个100%的AlphaKey,在100%的位置添加一个0%的AlphaKey,在0%的位置添加一个RGB(255,0,0)的ColorKey,在100%的位置添加一个RGB(255,255,255)的ColorKey。这样就可以得到如下的渐进色:

 

3. 从渐进色获取颜色

设置好渐进色之后,我们需要通过代码将渐进色的颜色应用到Image的Color属性上,在Gradient类型中有个方法为:

public Color Evaluate(float time);  //通过传入[0,1]的变量来获取渐进色上的颜色。

完整的GradientScript代码如下:

 

4. 效果

 

5. 素材

Image01图片下载地址 :  Image01

 


莫知我哀 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:[Unity3D] Gradient Editor的使用
喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
Title - Artist
0:00