【转载】UGUI动画

原文链接:http://blog.sina.com.cn/s/blog_89d90b7c0102vi4y.html

Unity暂时没有单独给UGUI提供动画系统,用官方的动画系统也能做只是比较麻烦,所以我们有很多选择了。

1.修改NGUI的UITweener在用UGUI上,轻量级动画系统。

2.使用第三方插件入iTween,DoTween,HOTween等。

发现DoTween不错,就试试了。

先来看效果图:


这里用到了位置,旋转,缩放,颜色四个最主要的动画效果,暂时简单写一个例子,以便以后使用时查阅。

下载地址和详细使用说明如下。

下载地址:http://dotween.demigiant.com/download.php

文档地址:http://dotween.demigiant.com/documentation.php

下载之后复制到工程目录,VS引用DOTween.dll,代码引用using DG.Tweening即可。

demo代码如下:

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using DG.Tweening;   

public class UIFirstAnima : MonoBehaviour
{
    private Tweener m_pos;
    private Tweener m_rota;
    private Tweener m_scale;
    private Tweener m_color;
    void Start () {
        // 全局初始化
        DOTween.Init(true, true, LogBehaviour.ErrorsOnly).SetCapacity(200, 10);
        Image image = transform.GetComponent();
        // 位置
        m_pos = image.rectTransform.DOMove(new Vector3(Screen.width * 0.5f, Screen.height * 0.5f,0), 1f);
        m_pos.SetEase(Ease.OutCubic);
        m_pos.SetLoops(10,LoopType.Yoyo);
        // 旋转
        m_rota = image.rectTransform.DORotate(new Vector3(0,180,0), 1);
        m_rota.SetEase(Ease.Linear);
        m_rota.SetLoops(10, LoopType.Yoyo);
        // 缩放
        m_scale = image.rectTransform.DOScale(new Vector3(0.6f, 0.6f, 1f), 1);
        m_scale.SetEase(Ease.Linear);
        m_scale.SetLoops(10, LoopType.Yoyo);
        // 颜色
        m_color = image.material.DOColor(new Color(0f,1f,1f, 0.7f), 1f);
        m_color.SetEase(Ease.Linear);
        m_color.SetLoops(10, LoopType.Yoyo);
        // 注册开始和结束事件
        m_pos.OnStart(AnimaStart);
        m_pos.OnComplete(AnimaEnd);
    }
    private void AnimaStart()
    {
        Debug.Log("动画开始");
    }
    private void AnimaEnd()
    {
        Debug.Log("动画结束");
    }
}

  

时间: 2024-10-24 22:31:12

【转载】UGUI动画的相关文章

Unity CCTween UGUI 动画插件

在这简单的介绍一个 CCTween 动画插件的使用 因为GIF 制作软件不太好(网上随便下载的)所以导致效果不太好,有时间我重新制作一下 这是一下简单的效果 下面介绍怎么使用 首先 先下载 CCTween  导入工程 点击下载 Unity5.0的包 如果使用的Unity 版本不够5.0的 就点击下边的连接 下载源码 点击下载 源码 GitGub地址 欢迎大神来更新 好了下面正式开始介绍使用了 #------------ 这是使用的一些变量 以及类型 -----------------------

[转载]网页动画的十二原则

CSS的Animation是一个很有意思的东西,也是CSS中较为复杂也难设计的一部分.熟不知在Web的动画设计中有12个关键原则.在Animation 101将这十二原则剖析出来.今天特意转载@刘英滕翻译<Animation Principles for the Web>的中文. 作为前端的设计师和工程师,我们用 CSS 去做样式.定位并创建出好看的网站.我们经常用 CSS 去添加页面的运动过渡效果甚至动画,但我们经常做的东西不会超过这些. 动效是一个有助于访客和消费者理解我们设计的强有力工具

NGUI和UGUI动画不能设置alpha值的问题

动画播放alpha参数改变但无实际画面效果,原因是要挂一个脚本,设置实时更新数据. NGUI void Update() { widget.SetDirty(); } UGUI void Update() { graphic.SetAllDirty(); }

UGUI官网文档重温笔记——Animation Integration

Unity推荐使用Animator动画来制作UGUI控件的动画效果.先制作好UI控件的Animation片段,然后为控件添加相应的Animator以及过渡参数,控制参数即可控制动画的播放. 例如在一个Button中, 此处将Transition(过渡转换)属性设置为:Animation,然后点击"Auto Generate Animation",即可自动添加带有四个参数的Animator, Unity已经自动添加并设置好带有四个参数的动画状态机.此时只需按下Ctrl+6,单独编辑Nor

Web动画API教程2:AnimationPlayer和Timeline

本文转载: Web动画API教程2:AnimationPlayer和Timeline

UGUI 制作Animation 死活都不播放的坑

修改alpha死活颜色都不变,后面经过不断的尝试,发现只要加一个Rect 中的一个属性就可以起效了...估计UGUI的动画识别,只识别带有Rect属性的动画. 记住一点:制作UGUI动画,一定要附加一个小雪花属性    

css3常用属性之表现型

本文来源:www.liteng.org如需转载请注明出处.否则将追究法律责任 版权归作者和博客园所有,请友情转载. css3的使用已经分布在各种网站上,其用途对于前端开发人员来说有很大的帮助,比如之前的圆角矩形,需要使用背景图片来完成,现在只需使用border-radius:5px;便可以做出圆角边框的效果,今天来记录下css3一些常用的属性. 盒子属性:边框圆角:radius,边框阴影:box-shadow 边框:border-radius:top-left top-right bottom-

UGUI 过渡动画插件,模仿NGUI的Tween (转载)

最近在相亲,后来好朋友跟我说他写了一个好插件,于是我就把女朋友甩了,看看他的插件,可以在UGUI制作简单过渡动画. 我看了下是模仿NGUI的Tween, 我在筱程的基础上稍微改到人性化, 简单支持的让子物体也透明功能. 组件图: 整体图:   TaoCode地址: http://code.taobao.org/svn/Tween/ 下载地址: http://yunpan.cn/cLQnwsWuhppLz  访问密码 08e9 , DoTween需要自己下载 联系方式: [email protec

使用uGUI制作游戏内2D动画

在3D的游戏中制作2D的效果是一个很常见的需求,我在很早前玩过一个叫做艾尔之光的游戏,里面就大量的使用了这个技术.就像下面图片中的伤害数字,这些数字往往还是有一些动画效果在里面的,比如大小的变化,颜色的变化等.在使用NGUI的时候这个东西做起来有点麻烦,因为2D对象在屏幕的位置需要根据游戏内3D对象的位置进行换算.但是在uGUI中,这个问题有了一个非常好的解决方案. 我先把做好的效果图放上来,原谅我不会做gif,其实图中的圆环是个2D的帧动画.它会跟着cube的移动而运动. 对于如何使用图片制作