【Unity3D】 DoTween实现飘字的效果

原创 2015年07月08日 10:12:37

Sequence.Append构建缓动序列,同时Join方法支持并行缓动。利用这个特性,可以实现ugui—Text的飘字缓动效果。

Append是在序列的末端插入一个Tweener,如果前面的Tweener都执行完了,就执行这个Tweener。

Join也是在序列末端插入一个Tweener,不同的是,这个Tweener将与前一个非Join加进来的Tweener并行执行。

飘字效果代码:

public static void FlyTo(Graphic graphic)
{
	RectTransform rt = graphic.rectTransform;
	Color c = graphic.color;
	c.a = 0;
	graphic.color = c;
	Sequence mySequence = DOTween.Sequence();
	Tweener move1 = rt.DOMoveY(rt.position.y + 50, 0.5f);
	Tweener move2 = rt.DOMoveY(rt.position.y + 100, 0.5f);
	Tweener alpha1 = graphic.DOColor(new Color(c.r, c.g, c.b, 1), 0.5f);
	Tweener alpha2 = graphic.DOColor(new Color(c.r, c.g, c.b, 0), 0.5f);
	mySequence.Append(move1);
	mySequence.Join(alpha1);
	mySequence.AppendInterval(1);
	mySequence.Append(move2);
	mySequence.Join(alpha2);
}

调用

Text text = gameObject.GetComponent<Text>();
FlyTo(text);

1.首先设置文字的alpha值为0

2.然后文字沿y轴向上缓动,同时alpha从0缓动到1,两个Tweener同时进行

3.停留1秒钟,让玩家看清楚字写的是什么

4.文字继续往上飘,同时alpha从1缓动到0,逐渐消失


效果:




有同学问,这个字体颜色渐变效果怎么弄,这里可以参考雨松MOMO的文章http://www.xuanyusong.com/archives/3471,但是要稍微修改设置color的部分,alpha值不能设进去,否则我们这里的渐变效果就出不来了。代码我就贴出来吧。另外,再加个Outline的效果就很好看了。

using UnityEngine;
using System.Collections.Generic;
using UnityEngine.UI;

namespace MyScripts
{
	[AddComponentMenu("UI/Effects/Gradient")]
	public class Gradient : BaseVertexEffect
	{
		[SerializeField]
		private Color32 topColor = Color.white;
		[SerializeField]
		private Color32 bottomColor = new Color32(255, 153, 0, 255);
		[SerializeField]
		private bool useGraphicAlpha = true;

		public override void ModifyVertices(List<UIVertex> vertexList)
		{
			if (!IsActive())
			{
				return;
			}

			int count = vertexList.Count;
			if (count > 0)
			{
				float bottomY = vertexList[0].position.y;
				float topY = vertexList[0].position.y;

				for (int i = 1; i < count; i++)
				{
					float y = vertexList[i].position.y;
					if (y > topY)
					{
						topY = y;
					}
					else if (y < bottomY)
					{
						bottomY = y;
					}
				}

				float uiElementHeight = topY - bottomY;

				for (int i = 0; i < vertexList.Count; )
				{
					ChangeColor(ref vertexList, i, topColor);
					ChangeColor(ref vertexList, i + 1, topColor);
					ChangeColor(ref vertexList, i + 2, bottomColor);
					ChangeColor(ref vertexList, i + 3, bottomColor);
					i += 4;
				}
			}
		}

		private void ChangeColor(ref List<UIVertex> verList, int i, Color32 color)
		{
			UIVertex uiVertex = verList[i];
			if (useGraphicAlpha)
			{
				uiVertex.color = new Color32(color.r, color.g, color.b, uiVertex.color.a);
			}
			else
			{
				uiVertex.color = color;
			}
			verList[i] = uiVertex;
		}
	}
}


版权声明:本文为博主原创文章,未经博主允许不得转载。

在Unity3D中实现高效的战斗飘字

这周有网友提到用NGUI做战斗冒血,冒伤害等文字性能太差。确实如此,我之前(NGUI 3.8.2,1000块的Android机器上)在Profile中也发现UIPanel占用CPU奇高。因此最终自己在...
  • kakashi8841
  • kakashi8841
  • 2016年01月27日 19:18
  • 10310

NGUI战斗飘字及界面优化

1. 飘字问题:飘字会有Alpha的渐变,当渐变到0的时候,会触发UIPanel的Rebuild      解决问题:查找哪些地方触发了Rebuild,在UIPanel中添加日志代码,查找出对应的UI...
  • ywjun0919
  • ywjun0919
  • 2016年06月23日 17:51
  • 1236

【Unity3D】 DoTween实现飘字的效果

Sequence.Append构建缓动序列,同时Join方法支持并行缓动。利用这个特性,可以实现飘字的缓动效果。 Append是在序列的末端插入一个Tweener,如果前面的Tweener都执行完了,...
  • xhyzdai
  • xhyzdai
  • 2015年07月08日 10:12
  • 3767

Unity飘血文字

飘血的文字在Unity场景中添加一个Cube作为怪物,当我们点击鼠标左键的时候产生伤害的文字,然后让这些文字,慢慢向上移动,然后消失。using System.Collections; using S...
  • yy763496668
  • yy763496668
  • 2017年05月12日 10:55
  • 979

Unity高效的战斗飘字

  • 2017年01月18日 16:19
  • 18.79MB
  • 下载

文字飞入飞出效果/自定义View/随机刷新数据/

Android源码,文字飞入飞出效果/自定义View/随机刷新数据,网络上很多娱乐性质的app都有这个东西拿来就能用,知己添加数据就可以。...
  • zz2043191420
  • zz2043191420
  • 2015年08月24日 14:12
  • 836

利用ugui做血条和漂浮文字

时间过完一天,现在是第二篇文章了;只能说时间过得很慢,我还想多写几篇文章了。  现在开始讲怎么制作吧,如下:          1、创建slider和伤害值文本并且把cancas的模式改成世界坐标,把...
  • LY204433295
  • LY204433295
  • 2016年11月10日 20:53
  • 966

如何在Unity中实现文字的渐隐效果?

欢迎来到unity学习、unity培训、unity企业培训教育专区,这里有很多U3D资源、U3D培训视频、U3D教程、U3D常见问题、U3D项目源码,我们致力于打造业内unity3d培训、学习第一品牌...
  • book_longssl
  • book_longssl
  • 2014年11月16日 20:21
  • 2069

UGUI 实现文本打字效果

孙广东 2015.6.17熟悉NGUI的人可定知道了。但是NGUI弄的有些繁琐, 感兴趣的人可以将NGUI的TypewriterEffect类转成 UGUI特定的,因为有些以来的其他脚本,不爱弄。我这...
  • u010019717
  • u010019717
  • 2015年06月19日 08:53
  • 7089

unity3d文字特效

  • 2015年07月13日 10:41
  • 10.95MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:【Unity3D】 DoTween实现飘字的效果
举报原因:
原因补充:

(最多只允许输入30个字)