在做UI后期设计时,我们可能要对UI做一些特效,这篇文章我们来学习下如何在Unity3d中对实现渐隐渐现的效果,

首先我们看下Unity New UI即UGUI中渐隐渐现的做法.

观察我们会发现Unity4.6 UI中每个能够显示控件都会有一个CanvasRender对象,CanvasRender有什么作用呢,我们

看下官方的解释:The Canvas Renderer component renders a graphical UI object contained within a Canvas.简单的

翻译过来就是,画布上的渲染器组件将呈现包含在一个画布内的图形用户界面对象,再仔细查看CanvasRenderer类

时我们可以看到有两个方法SetAlpha ,SetColor,显然我们可以修改透明度Alpha和Color来实现渐隐渐现,同时我

们还可以发现Button,Text,Image等控件都会集成自Unity.UI.Graphic

如下所示:

 public class Text : MaskableGraphic, ILayoutElement

 public abstract class MaskableGraphic : Graphic, IMaskable

 public class Image : MaskableGraphic, ICanvasRaycastFilter, ISerializationCallbackReceiver, ILayoutElement
然后我们再阅读Graphic代码,我们会发现有两个方法
 public void CrossFadeAlpha(float alpha, float duration, bool ignoreTimeScale);
public void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha);
 

开源源码如下:

 public void CrossFadeAlpha(float alpha, float duration, bool ignoreTimeScale)
{
CrossFadeColor(CreateColorFromAlpha(alpha), duration, ignoreTimeScale, true, false);
} public void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha)
{
CrossFadeColor(targetColor, duration, ignoreTimeScale, useAlpha, true);
} private void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha, bool useRGB)
{
if (canvasRenderer == null || (!useRGB && !useAlpha))
return; Color currentColor = canvasRenderer.GetColor();
if (currentColor.Equals(targetColor))
return; ColorTween.ColorTweenMode mode = (useRGB && useAlpha ? ColorTween.ColorTweenMode.All : (useRGB ? ColorTween.ColorTweenMode.RGB : ColorTween.ColorTweenMode.Alpha)); var colorTween = new ColorTween {duration = duration, startColor = canvasRenderer.GetColor(), targetColor = targetColor};
colorTween.AddOnChangedCallback(canvasRenderer.SetColor);
colorTween.ignoreTimeScale = ignoreTimeScale;
colorTween.tweenMode = mode;
m_ColorTweenRunner.StartTween(colorTween);
}
 

因此我们利用CrossFadeColor或CrossFadeAlpha这两个方法就可以实现渐隐渐现了

下面是客户端调用代码

 {

     Component[] comps = GameObject.Find("/Canvas").GetComponentsInChildren<Component>();
foreach (Component c in comps)
{
if (c is Graphic)
{
(c as Graphic).CrossFadeAlpha(, , true);
}
}
}
 

执行的效果就是所有Canvas下的元素都在1秒之类执行淡出效果!

---上面原文:Unity4.6 UI实现渐隐渐现(FadeIn FadeOut)效果---

以下是我在实际项目中结合协程制作的提示信息闪烁功能实现

   internal Coroutine noticeCor;
internal void ShowNotice()
{
HideNotice();
noticeCor = StartCoroutine(NoticeShowScale());
} internal void HideNotice()
{
if (null != noticeCor)
{
StopCoroutine(noticeCor);
noticeItme.gameObject.SetActive(false);
}
} IEnumerator NoticeShowScale()
{
noticeItem.gameObject.SetActive(true);
float targetA = ;
noticeItem.GetComponent<CanvasRenderer>().SetAlpha();
float timer = ;
while (timer<6f)
{
noticeItem.GetComponent<Graphic>().CrossFadeAlpha(targetA, , true);
yield return new WaitForSeconds(1f);
timer += 1f;
targetA = targetA == ? : ;
}
noticeItem.gameObject.SetActive(false);
noticeCor = null;
}

Unity3D中UGUI不使用DOTween制作渐隐渐现效果的更多相关文章

  1. 在Unity5中使用C#脚本实现UI的下滑、变色、渐隐渐现效果

    一.首先,我们先创建一个Text    依次选择Component→UI→Text创建一个Text,创建完成后如下: 二.创建完成后,在Project面板点击Create→C# Script,本例命名 ...

  2. css3 hover平滑过渡效果,鼠标经过元素,背景渐隐渐现效果

    下面实例,演示,鼠标经过时,改变div宽度,平滑改变,带动画 div { width:100px; height:100px; background:blue; transition:width 2s ...

  3. UGUI 实现界面 渐隐渐现 FadeIn/Out 效果

    孙广东  2015.7.10 事实上熟悉NGUI的人,应该知道  实现渐隐渐现 FadeIn/Out 效果是非常方便的,由于父对象 的 改变会自己主动影响到子对象. 比方 UIWidget.UIPan ...

  4. WPF 渐隐渐现切换背景图片

    最近学习WPF,尝试着自己做一些小玩意,也遇到了一些问题,于是整理记录以便日后查阅. 我们都知道WPF可以实现一些很炫的效果,然而有时候为达到这个目的却并不是一件很容易的事情.比如:在软件中我希望能够 ...

  5. 基于JQuery的渐隐渐现轮播

    <div id="ads"> <div> <!--轮播图片--> <ul> <li><a href="# ...

  6. js渐隐渐现透明度变化淡入淡出轮播图

    js渐隐渐现透明度变化淡入淡出轮播图.焦点图 一些广告banner展示常见. (附件) <!DOCTYPE html> <html> <head> <meta ...

  7. jQuery鼠标悬停文字渐隐渐现动画效果

    jQuery鼠标悬停文字渐隐渐现动画效果 当时是做项目的时候用到的所以图片有些大,九张,真正要做图片不需要这么大 css样式 <style> *{ margin: 0; padding: ...

  8. Unity3D中uGUI事件系统简述及使用方法总结

    Unity3D的uGUI系统的将UI可能触发的事件分为12个类型,即EventTriggerType枚举的12个值.如下图所示: 先以PointerClick为例.这个是用于某点点击事件.其他事件都可 ...

  9. Unity3D中UGUI使用ScrollBar之后保存,工程启动报错原因跟踪

    笔者不久前将Unity3D版本更新为4.6.2之后.在使用新UI的时候发现关闭项目之后经常再次打开项目会出现一对的报错. 找了一圈,发现是ScrollBar控件出现了BUG.整个空间的滑块消失了. 在 ...

随机推荐

  1. 支持向量机SVM知识梳理和在sklearn库中的应用

    SVM发展史 线性SVM=线性分类器+最大间隔 间隔(margin):边界的活动范围.The margin of a linear classifier is defined as the width ...

  2. Qt 的日期 时间

    QDateTime 的构造函数,有参数是QDate的.这样就可以把日期转化成 QDateTime. QDateTime.toTime_t() 可以转化成 Unix 时间.

  3. Ubuntu 18.04更换apt-get源

    使用apt-get安装时,会很慢,更换了国内的源后,就可以解决这个问题了. 1. 备份sources.list文件 sudo cp /etc/apt/sources.list /etc/apt/sou ...

  4. C6 C7的开机启动流程

    C6开机启动流程 1.内核引导,加电自检(通电后检查内核):检查bios的配置,检测硬件 装好系统之后才会进行以下内容 MBR 引导 (3.2.1...) GRUB菜单 (选择不同的系统)(按e,进入 ...

  5. HTML后台管理页面布局

    设计网页,让网页好看:网上找模板 搜 HTML模板 BootStrap 一.内容回顾: HTML 一大堆的标签:块级.行内 CSS position background text-align mar ...

  6. 小猪的Python学习之旅 —— 16.再尝Python数据分析:采集拉勾网数据分析Android就业行情...

    一句话概括本文: 爬取拉钩Android职位相关数据,利用numpy,pandas和matplotlib对招人公司 情况和招聘要求进行数据分析. 引言: 在写完上一篇<浅尝Python数据分析: ...

  7. Codeforces Round #530 (Div. 1) 1098A Sum in the tree

    A. Sum in the tree Mitya has a rooted tree with nn vertices indexed from 11 to nn, where the root ha ...

  8. 王颖奇 20171010129《面向对象程序设计(java)》第十周学习总结

    实验十  泛型程序设计技术 实验时间 2018-11-1 1.实验目的与要求 (1) 理解泛型概念: (2) 掌握泛型类的定义与使用: (3) 掌握泛型方法的声明与使用: (4) 掌握泛型接口的定义与 ...

  9. layui里面的layer模块弹窗,强制居中的方法!!!

    每次调用layer弹窗做动态展示的时候,只要内容不固定或者需要二次渲染 比如layui.form.render()进行渲染的时候 由于弹窗已经出来了,只是content部分的结构改变了宽度或者高度,l ...

  10. Python爬虫丨大众点评数据爬虫教程(1)

    大众点评数据获取 --- 基础版本 大众点评是一款非常受普罗大众喜爱的一个第三方的美食相关的点评网站. 因此,该网站的数据也就非常有价值.优惠,评价数量,好评度等数据也就非常受数据公司的欢迎. 今天就 ...