孙广东  2015.7.10

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

比方 UIWidget、UIPanel等组件都有 Alpha属性。在Inspector面板上能够直接设置拖拽的改变看看。  确实如此。

可是到UGUI呢,没有这么方便。  须要熟悉一下 组件的内部和继承关系了!

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);

由于源码是开源的,大家能够自己去看看!

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

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

可是 Unity提供的方法非常有限,就是 要做延迟怎么办? 要在结束后运行回调怎么办? 要改变渐变曲线怎么办?

我们在知道 原理了之后,就能够 在看看 DOTween 补间动画插件。

官方文档有专门 的区域 API 是针对 Unity4.6种的UGUI元素的。【自己去看】

        #region 渐显/渐隐的形式 对菜单对象
/// <summary>
/// 渐现菜单
/// </summary>
/// <param name="targetGO">菜单游戏对象</param>
public static void FadeOpenMenu(GameObject targetGO)
{
Component[] comps = targetGO.GetComponentsInChildren<Component>();
for (int index = 0; index < comps.Length; index++)
{
Component c = comps[index];
if (c is Graphic)
{
//(c as Graphic).color = new Color(1, 1, 1, 0);
// (c as Graphic).CrossFadeAlpha(1f, MENU_FADE_IN_TIME, true);
(c as Graphic)
.DOFade(0f, MENU_FADE_IN_TIME)
.SetDelay(CAMERA_ZOOM_IN_DELAY)
.SetEase(MENU_SCALE_OPEN_TYPE)
.From()
.OnComplete(
() =>
{
MenuSignalManager.OpenedMenuSignal.Dispatch();
});
}
}
// 运行完成的回调
}
/// <summary>
/// 渐隐菜单(无销毁操作)
/// </summary>
/// <param name="targetGO">菜单游戏对象</param>
public static void FadeCloseMenu(GameObject targetGO)
{
Component[] comps = targetGO.GetComponentsInChildren<Component>();
for (int index = 0; index < comps.Length; index++)
{
Component c = comps[index];
if (c is Graphic)
{
//(c as Graphic).CrossFadeAlpha(0, MENU_FADE_OUT_TIME, true); // 当然了假设觉得不方便的话,能够使用dotween的Graphic的DoColor、DoFade
(c as Graphic).
DOFade(0, MENU_FADE_OUT_TIME)
.SetEase(MENU_FADE_OUT_TYPE)
.OnComplete(() =>
{
MenuSignalManager.CloseedMenuSignal.Dispatch(targetGO);
});
}
}
// 运行完成的回调
}
#endregion

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />



UGUI 实现界面 渐隐渐现 FadeIn/Out 效果的更多相关文章

  1. Unity3D中UGUI不使用DOTween制作渐隐渐现效果

    在做UI后期设计时,我们可能要对UI做一些特效,这篇文章我们来学习下如何在Unity3d中对实现渐隐渐现的效果, 首先我们看下Unity New UI即UGUI中渐隐渐现的做法. 观察我们会发现Uni ...

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

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

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

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

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

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

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

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

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

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

  7. part10 header界面渐隐渐显 //动态路由//项目动画

    两个组件只同时显示一个 可以用 a v-show='variable'  b: v-show='!variable' 1.对全局事件的解绑 //代码容易出现大量bug 因为影响其他组件 keep-al ...

  8. UGUI DOTween渐隐渐现

    Tween tweenAlpha; tweenAlpha = DOTween.To(() => MaskSpr.fillAmount, x => MaskSpr.fillAmount = ...

  9. [css3动画]渐隐渐现

    测试 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...

随机推荐

  1. JavaScript ES6部分语法

    ES6是JavaScript语言的新版本,它也可以叫做ES2015,之前学习的JavaScript属于ES5,ES6在它的基础上增加了一些语法,ES6是未来JavaScript的趋势,而且vue组件开 ...

  2. js的变量的有效域

    function test(o) { var i=0; if(typeof o=="object") { var j=1; for(var k=0;k<10;k++) { c ...

  3. Spring源码 之环境搭建

    1.安装gitHub 在官网https://desktop.github.com/下载githubsetup.exe,在线安装总是出错,试了几次后不成功就放弃了.不知道是不是网络的原因. 后来在网上找 ...

  4. python 多进程并发与多线程并发

    本文对python支持的几种并发方式进行简单的总结. Python支持的并发分为多线程并发与多进程并发(异步IO本文不涉及).概念上来说,多进程并发即运行多个独立的程序,优势在于并发处理的任务都由操作 ...

  5. php split 和 explode 的区别

    php split 和 explode 的区别 split (PHP   3,   PHP   4   ) split   --   用正则表达式将字符串分割到数组中 说明 array   split ...

  6. CF 816B Karen and Coffee【前缀和/差分】

    To stay woke and attentive during classes, Karen needs some coffee! Karen, a coffee aficionado, want ...

  7. 学习LSM(Linux security module)之一:解读yama

    最近打算写一个基于LSM的安全模块,发现国内现有的资料极少.因此打算自己琢磨一下.大致的学习路线如下: 由易至难使用并阅读两到三个安全模块->参照阅读模块自己实现一个安全模块->在自己实现 ...

  8. CodeChef - UASEQ Chef and sequence

    Read problems statements in Mandarin Chinese and Russian. You are given an array that consists of n ...

  9. [CF983D]Arkady and Rectangles

    题意:按顺序在坐标轴上画$n$个颜色为$1\cdots n$的矩形(数字大的颜色覆盖数字小的颜色),问最后能看到多少种颜色 先离散化,然后考虑扫描线+线段树 线段树每个节点用一个set存覆盖整个区间的 ...

  10. 【差分约束系统】【spfa】UVALive - 4885 - Task

    差分约束系统讲解看这里:http://blog.csdn.net/xuezhongfenfei/article/details/8685313 模板题,不多说.要注意的一点是!!!对于带有within ...