浅谈unity淡入淡出的效果的实现

丢了蜡笔小新会哭〆 丢了蜡笔小新会哭〆     2022-09-23     421

关键词:

Unity淡入淡出的效果的实现

 

前言:在我们的许多的游戏中,我们在游戏的开始的时候会有一个淡入的效果(场景由黑逐渐变清晰),当我们切换场景的时候(会由清晰逐渐的变黑的一个过程).

 

自己的思考:因为我们在许多的游戏中都有可能用到我们的淡入淡出的效果,所有就可以把它封装成一个类,每次当我们需要用到的时候,就可以直接拿来用了,这也体现我们我们c#的封装的特性。

 

实现的思路:

 

                     一.因为当我们封装好一个类的时候,那么我们 考虑如何会调用它呢??这时候我们会考虑使用单例模式。

 

                       单例模式的实现思路:

 

                                                          (1):我们使用静态字段来模拟全局变量。

 

                                                          (2):构造函数的私有化,因为我们不允许 别人通过使用new的关键字来创建类的实例,这也就保证了我们当前类只能有一个实例,来避免一些不必要的麻烦。

 

                                                          (3):得到实例。

 

 

 

单例模式的具体的实现:

 

 1         //设置静态的字段来模拟全局的变量(开始为空)
 2         private static SceneFadeInAndOut _instance = null;
 3         /// <summary>
 4         /// 只读属性的设置(得到实例)
 5         /// </summary>
 6         public static SceneFadeInAndOut Instance
 7         {
 8             get
 9             {
10                 //如果一开始的为空的话
11                 if (_instance == null)
12                 {
13                     //进行类的实例化的操作
14                     _instance = new SceneFadeInAndOut();
15                 }
16                 //下一个访问的话_instance就不为空直接返回字段
17                 return _instance;
18             }
19         }
20         //构造函数的私有化
21         private SceneFadeInAndOut() { }

 

 

 二:好的,当我们写完单例模式的时候,接下来要考虑显示的事情了,我们需要时候来进行显示呢???我们需要使用UGUI的RawImage组件,来控制Color来控制淡入淡出效果。

       请看截图:

 

 代码如下:

 1         //RawImage对象
 2         public GameObject goRawImage;
 3         //RawImage组件
 4         private RawImage _rawImage;
 5         void Awake()
 6         {
 7             //如果goRawImage不为空的话
 8             if (goRawImage)
 9             {
10                 //得到RawImage组件
11                 _rawImage = goRawImage.GetComponent<RawImage>();
12             }
13         }

 

 三:这时候需要控制组件来实现屏幕的淡入和淡出了。(颜色插值API自补)。

       方法为私有的,因为我们不要再别的类中调用,只在类中自己使用。

代码实现如下:

 1         //渐变的速率
 2         public float floatColorChangeSpeed = 1f;
 3         /// <summary>
 4         /// 屏幕逐渐清晰(淡入)
 5         /// </summary>
 6         private void FadeToClear()
 7         {
 8             //插值运算
 9             _rawImage.color = Color.Lerp(_rawImage.color, Color.clear, floatColorChangeSpeed * Time.deltaTime);
10         }
11 
12         /// <summary>
13         /// 屏幕逐渐暗淡(淡出)
14         /// </summary>
15         private void FadeToBlack()
16         {
17             //插值运算
18             _rawImage.color = Color.Lerp(_rawImage.color, Color.black, floatColorChangeSpeed * Time.deltaTime);
19         }
20 
21         /// <summary>
22         /// 屏幕的淡入
23         /// </summary>
24         private void SceneToClear()
25         {
26             FadeToClear();
27             //当我们的a值小于等于0.05f的时候 就相当于完全透明了
28             if (_rawImage.color.a <= 0.05f)
29             {
30                 //设置为完全透明
31                 _rawImage.color = Color.clear;
32                 //组件的开关设置为关闭的状态
33                 _rawImage.enabled = false;
34                 //布尔条件设置为false
35                 _isSceneToClear = false;
36             }
37         }
38 
39         /// <summary>
40         /// 屏幕的淡出
41         /// </summary>
42         private void SceneToBlack()
43         {
44             //组件的打开
45             _rawImage.enabled = true;
46             FadeToBlack();
47             //当前的阿尔法值大于0.95f的时候 表示已经接近于完全不透明的状态
48             if (_rawImage.color.a >= 0.95f)
49             {
50                 //设置为完全不透明的状态 
51                 _rawImage.color = Color.black;
52                 //布尔条件当到达指定的阿尔法值得时候设置为false
53                 _isSceneToBlack = false;
54             }
55         }

 

 四:那我们就接下来考虑如何调用淡入的方法   如何调用淡出的方法???

       1.设置两个布尔类型的条件,屏幕是否需要逐渐变清晰     屏幕是否需要变暗淡。

       2.编写两个公共的方法,当场景需要淡入的时候 分别的设置布尔条件就可以了。

       3.这样就可以在Update里面进行调用了。

 

代码实现如下:

 1         //屏幕是否要逐渐清晰(默认是需要的)
 2         private bool _isSceneToClear = true;
 3         //屏幕是否需要逐渐变暗(默认是不需要的)
 4         private bool _isSceneToBlack = false;
 5         void Update()
 6         {
 7             if (_isSceneToClear)
 8             {
 9                 SceneToClear();
10             }
11             else if (_isSceneToBlack)
12             {
13                 SceneToBlack();
14             }
15         }
16         /// <summary>
17         /// 设置场景的淡入
18         /// </summary>
19         public void SetSceneToClear()
20         {
21             _isSceneToClear = true;
22             _isSceneToBlack = false;
23         }
24 
25         /// <summary>
26         /// 设置场景的淡出
27         /// </summary>
28         public void SetSceneToBlack()
29         {
30             _isSceneToClear = false;
31             _isSceneToBlack = true;
32         }

 

全部代码实现如下:

/**
*    Title:"":项目
*          主题 :
*    Description:
*          功能:场景的淡入淡出的效果
*    Date:2017.10.12
*    Version:Unity5.5.4
*    Modify Recoder:
*    Operator:
*
**/
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

namespace Gnome
{
    public class SceneFadeInAndOut : MonoBehaviour
    {

        #region 单例模式

        //设置静态的字段来模拟全局的变量(开始为空)
        private static SceneFadeInAndOut _instance = null;
        /// <summary>
        /// 只读属性的设置
        /// </summary>
        public static SceneFadeInAndOut Instance
        {
            get
            {
                //如果一开始的为空的话
                if (_instance == null)
                {
                    //进行类的实例化的操作
                    _instance = new SceneFadeInAndOut();
                }
                //下一个访问的话_instance就不为空直接返回字段
                return _instance;
            }
        }
        private SceneFadeInAndOut() { }

        #endregion

        #region 字段和属性的定义

        //渐变的速率
        public float floatColorChangeSpeed = 1f;
        //RawImage对象
        public GameObject goRawImage;
        //RawImage组件
        private RawImage _rawImage;
        //屏幕是否要逐渐清晰(默认是需要的)
        private bool _isSceneToClear = true;
        //屏幕是否需要逐渐变暗(默认是不需要的)
        private bool _isSceneToBlack = false;

        #endregion

        void Awake()
        {
            //如果goRawImage不为空的话
            if (goRawImage)
            {
                //得到RawImage组件
                _rawImage = goRawImage.GetComponent<RawImage>();
            }
        }
        void Update()
        {
            if (_isSceneToClear)
            {
                SceneToClear();
            }
            else if (_isSceneToBlack)
            {
                SceneToBlack();
            }
        }

        #region 公共方法的定义

        /// <summary>
        /// 设置场景的淡入
        /// </summary>
        public void SetSceneToClear()
        {
            _isSceneToClear = true;
            _isSceneToBlack = false;
        }

        /// <summary>
        /// 设置场景的淡出
        /// </summary>
        public void SetSceneToBlack()
        {
            _isSceneToClear = false;
            _isSceneToBlack = true;
        }

        #endregion

        #region 私有方法的定义

        /// <summary>
        /// 屏幕逐渐清晰(淡入)
        /// </summary>
        private void FadeToClear()
        {
            //插值运算
            _rawImage.color = Color.Lerp(_rawImage.color, Color.clear, floatColorChangeSpeed * Time.deltaTime);
        }

        /// <summary>
        /// 屏幕逐渐暗淡(淡出)
        /// </summary>
        private void FadeToBlack()
        {
            //插值运算
            _rawImage.color = Color.Lerp(_rawImage.color, Color.black, floatColorChangeSpeed * Time.deltaTime);
        }

        /// <summary>
        /// 屏幕的淡入
        /// </summary>
        private void SceneToClear()
        {
            FadeToClear();
            //当我们的a值小于等于0.05f的时候 就相当于完全透明了
            if (_rawImage.color.a <= 0.05f)
            {
                //设置为完全透明
                _rawImage.color = Color.clear;
                //组件的开关设置为关闭的状态
                _rawImage.enabled = false;
                //布尔条件设置为false
                _isSceneToClear = false;
            }
        }

        /// <summary>
        /// 屏幕的淡出
        /// </summary>
        private void SceneToBlack()
        {
            //组件的打开
            _rawImage.enabled = true;
            FadeToBlack();
            //当前的阿尔法值大于0.95f的时候 表示已经接近于完全不透明的状态
            if (_rawImage.color.a >= 0.95f)
            {
                //设置为完全不透明的状态 
                _rawImage.color = Color.black;
                //布尔条件当到达指定的阿尔法值得时候设置为false
                _isSceneToBlack = false;
            }
        }

        #endregion

    }//class_end
}

 

五:这样就可以在别的脚本上进行调用了。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

wpf实现渐变淡入淡出的动画效果(代码片段)

原文:WPF实现渐变淡入淡出的动画效果1、实现原理1.1利用UIElement.OpacityMask属性,用于改变对象区域的不透明度的画笔。可以使元素的特定区域透明或部分透明,从而实现比较新颖的效果。1.2OpacityMask属性接受任何画刷,可利用Linea... 查看详情

jquery,您可以实现元素的淡入淡出效果。

fadeIn()fadeOut()fadeToggle()fadeTo()jQueryfadeIn()用于淡入已隐藏的元素$("button").click(function(){$("#div1").fadeIn();$("#div2").fadeIn("slow");$("#div3").fadeIn(3000);});jQueryfadeOut()方法用于淡出可见元素。$("button") 查看详情

jquery实现淡入淡出效果(代码片段)

...元素的显示与隐藏,本节我们来学习如何实现元素的淡入淡出效果。fadeIn()方法fadeIn()方法用于淡入已隐藏的元素。语法如下所示:$(selector).fadeIn(speed,callback);speed:规定效果的时长,可选值有slow、fast或毫秒。callba... 查看详情

jquery显示和隐藏以及淡出淡入效果

jQuery实现动画效果?1)显示和隐藏show():显示hide():隐藏togger():显示和隐藏的组合1234<scripttype="text/javascript">$(function()$("tr:even").css("background-color","gray").eq(1).css("background-color","red");//设置tr的偶数的背景 查看详情

淡入淡出效果(jquery)

...通过改变这个值可以让元素有一个透明度的效果。常见的淡入淡出动画正是这样的原理。fadeOut()函数用于隐藏所有匹配的元素,并带有淡出的过渡动画效果 查看详情

jquery效果-淡入淡出

jQueryfadeIn()方法jQueryfadeIn()用于淡入已隐藏的元素。语法:$(selector).fadeIn(speed,callback);可选的speed参数规定效果的时长。它可以取以下值:"slow"、"fast"或毫秒。.可选的callback参数是fading完成后所执行的函数名称。下面的例子演示了带... 查看详情

在多个列表项上使用淡入淡出 jQuery 淡入淡出效果更改图像源

】在多个列表项上使用淡入淡出jQuery淡入淡出效果更改图像源【英文标题】:ChangetheimagesourcewithfadejQueryfadeeffectonmultiplelistitems【发布时间】:2013-08-1302:58:01【问题描述】:我想从具有淡入淡出效果的列表项中更改具有多个悬停在... 查看详情

图像从左到右的淡入淡出效果

】图像从左到右的淡入淡出效果【英文标题】:Fadeeffectlefttorightonaimage【发布时间】:2012-12-2100:14:11【问题描述】:我有淡入淡出效果结构。带有以下内容:<imgsrc=\'firstStar.jpg\'alt=\'starimage\'id=\'firstStar\'/>varloopImages=function()$(\'... 查看详情

js原生javascript轮播图渐变淡入淡出效果实现(附代码)(代码片段)

目录前言轮播图的组成以及实现思想左右按钮的隐藏与显示核心思想 代码实现 动态生成底部小圆圈核心思想代码实现     右左按钮实现核心思想代码实现实现自动播放核心思想代码实现整体代码(复制可用)总结前... 查看详情

AVAssetExportSession 和淡入淡出效果

】AVAssetExportSession和淡入淡出效果【英文标题】:AVAssetExportSessionandfade-infade-outEffect【发布时间】:2013-12-2311:20:27【问题描述】:我正在使用AVAssetExportSession修剪音频文件,但无法在保存的文件中实现淡入淡出效果。这是我正在使... 查看详情

listview的淡入淡出和activity的淡入淡出补间动画效果animation

//=========主页面=======================packagecom.bw.lianxi7;importandroid.os.Bundle;importandroid.app.Activity;importandroid.content.Intent;importandroid.view.Menu;importandroid.view.View;importandroid 查看详情

有关网页常见图片淡入淡出的效果的随笔

网页常见的图片淡入淡出的效果还是比较常见的,在这里,我个人来分享一些自己的一些笔记。 <!DOCTYPEhtml><html><head>   <metacharset="utf-8">   <title>淡入淡出图片效果图</title> &... 查看详情

html网页淡入淡出特效怎样实现

参考技术Ajquery的fadeIn()和fadeOut()方法 参考技术BHTML5利用动画效果实现,菜鸟教程里面可以找到 参考技术C这有插件你可以去看看 查看详情

我想知道程序切换时候的淡入淡出效果单纯靠c++能不能实现?如果不能需要怎样才能实现?

比如Q+、Iphone这类,在打开程序关闭程序的时候会有淡入淡出的效果,还有QQ主面板的下拉弹出这些效果,需要怎样的编程语言呢?光靠C++能不能实现?C/C++是语言,语言可以在多种平台下开发,语法一样,平台提供的接口是不一样的... 查看详情

《迷失岛2》游戏开发框架开发日记:场景切换和淡入淡出效果(代码片段)

M_Studio的教程:【《迷失岛2》游戏框架开发01:实现场景转换|Unity教程】搭建场景使用下载好的素材搭建场景H1-H4和H2A、永久的场景Persistent,将场景都拖拽到Hierachy面板,只加载和H1和Persistent场景,将H1作为激... 查看详情

《迷失岛2》游戏开发框架开发日记:场景切换和淡入淡出效果(代码片段)

M_Studio的教程:【《迷失岛2》游戏框架开发01:实现场景转换|Unity教程】搭建场景使用下载好的素材搭建场景H1-H4和H2A、永久的场景Persistent,将场景都拖拽到Hierachy面板,只加载和H1和Persistent场景,将H1作为激... 查看详情

iOS 如何在 Sprite Kit 游戏中创建音频淡入/淡出效果?

】iOS如何在SpriteKit游戏中创建音频淡入/淡出效果?【英文标题】:iOShowtocreateaudiofadein/outeffectinaSpriteKitgame?【发布时间】:2014-01-0218:05:16【问题描述】:我对如何在我的SpriteKit游戏中管理背景音乐以实现淡入/淡出很感兴趣。我注... 查看详情

两个 UILabel 之间的交叉淡入淡出

】两个UILabel之间的交叉淡入淡出【英文标题】:Cross-FadeBetweenTwoUILabels【发布时间】:2010-12-2207:45:14【问题描述】:假设我有两个UILabels(labelOne和labelTwo),我需要在两个标签之间交叉淡入淡出。实现这种效果的最佳方法是什么... 查看详情