【Unity3D】 DoTween实现飘字的效果

12 篇文章 0 订阅
5 篇文章 0 订阅

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


  • 2
    点赞
  • 35
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
使用DOTween实现伤害飘字可以通过以下步骤完成: 1. 创建一个伤害飘字的预制体,可以包含一个Text组件来显示伤害数字。 2. 在代码中使用DOTween创建一个Tween对象,将伤害飘字的位置从伤害来源点移动到目标位置,并在移动过程中改变伤害飘字的透明度和缩放大小等属性。 3. 在Tween对象完成后,销毁伤害飘字的预制体。 下面是一个示例代码: ```csharp public class DamageNumber : MonoBehaviour { public Text damageText; public float moveDuration = 1f; public float fadeDuration = 0.5f; public float scaleDuration = 0.5f; public float moveDistance = 50f; public Vector3 targetPosition; private void Start() { // 设置伤害飘字的初始位置 transform.position = targetPosition + new Vector3(0f, moveDistance, 0f); // 创建Tween对象来移动伤害飘字的位置 var moveTween = transform.DOMove(targetPosition, moveDuration); // 创建Tween对象来改变伤害飘字的透明度 var fadeTween = damageText.DOFade(0f, fadeDuration); // 创建Tween对象来改变伤害飘字的缩放大小 var scaleTween = transform.DOScale(2f, scaleDuration).SetEase(Ease.OutQuad); // 当Tween对象完成时,销毁伤害飘字的预制体 moveTween.OnComplete(() => Destroy(gameObject)); // 启动Tween对象 moveTween.Play(); fadeTween.Play(); scaleTween.Play(); } public void SetDamageNumber(int damage) { // 设置伤害数字的文本 damageText.text = damage.ToString(); } } ``` 在游戏中,可以通过以下代码来创建并显示伤害飘字: ```csharp public class Player : MonoBehaviour { public GameObject damageNumberPrefab; public void TakeDamage(int damage) { // 创建伤害飘字的预制体 var damageNumber = Instantiate(damageNumberPrefab, transform.position, Quaternion.identity); // 设置伤害数字的值 var damageNumberComponent = damageNumber.GetComponent<DamageNumber>(); damageNumberComponent.SetDamageNumber(damage); // 设置伤害飘字的目标位置 var targetPosition = transform.position + new Vector3(0f, 2f, 0f); damageNumberComponent.targetPosition = targetPosition; // 启动伤害飘字的Tween动画 damageNumberComponent.Start(); } } ``` 当玩家受到伤害时,通过调用TakeDamage方法来显示伤害飘字

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值