欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Unity3D利用DoTween实现卡牌翻转效果

程序员文章站 2023-11-21 12:19:40
利用unity的ugui制作了2d卡牌翻转的效果,如果是sprite对象的话,原理应该也是一样的,以下是效果图   图1 卡牌翻转效果 关于dotween...

利用unity的ugui制作了2d卡牌翻转的效果,如果是sprite对象的话,原理应该也是一样的,以下是效果图

 Unity3D利用DoTween实现卡牌翻转效果

图1 卡牌翻转效果

关于dotween

dotween是一款十分强大且好用的动画效果插件,有免费版和收费版,免费版就可以满足大部分需求了,在unity assets store里就可以下载,在本效果里就用了dotween的旋转功能。

设计思路

创建一个空物体,空物体下有两个image对象,一个是正面,一个是背面。假设我们从正面开始,则初始状态下正面的旋转角度为(0,0,0) (0,0,0)(0,0,0),让背面的旋转角度为(0,90,0) (0,90,0)(0,90,0),这样背面就看不见了。
触发旋转时,例如让正面在0.3秒内旋转到(0,90,0) (0,90,0)(0,90,0),这样正面就看不见了,等旋转完成后再让背面0.3秒旋转到(0,0,0) (0,0,0)(0,0,0),这样背面出现,整个翻转的过程就完成了,如果不明白,可以想象一下一张扑克牌从正面慢慢翻转到背面的情况,首先旋转到侧面对着你,然后再从侧面旋转到背面。

使用方法

  • 导入dotween插件
  • setup插件
  • 创建一个canvas
  • canvas下创建一个空物体命名为card
  • card下创建两个image(ui),分别命名为frontback,大小和位置均相同
  • backfront附上你选定的图片,如果没有可以用不同颜色替代
  • card附上cardturnover.cs脚本
  • frontback对象拖动到脚本的对应位置
  • 设置脚本的card state,意味着从正面开始还是背面开始
  • 设置脚本的time,即旋转所花费的时间
  • 创建两个button对象,增加onclick方法,将card对象拖进去,并分别调用startbackstartfront方法
  • 点击两个按钮就能看到卡牌翻转的效果了,注意只有在正面的时候才能翻到背面,背面同理。

脚本

using system.collections;
using system.collections.generic;
using unityengine;
using dg.tweening;//别忘了引用

//卡牌状态,正面、背面
public enum cardstate
{
 front,
 back
}
public class cardturnover : monobehaviour{
 public gameobject mfront;//卡牌正面
 public gameobject mback;//卡牌背面
 public cardstate mcardstate = cardstate.front;//卡牌当前的状态,是正面还是背面?
 public float mtime = 0.3f;
 private bool isactive = false;//true代表正在执行翻转,不许被打断

 /// <summary>
 /// 初始化卡牌角度,根据mcardstate
 /// </summary>
 public void init()
 {
  if(mcardstate==cardstate.front)
  {
   //如果是从正面开始,则将背面旋转90度,这样就看不见背面了
   mfront.transform.eulerangles = vector3.zero;
   mback.transform.eulerangles = new vector3(0, 90, 0);
  }
  else
  {
   //从背面开始,同理
   mfront.transform.eulerangles = new vector3(0, 90, 0);
   mback.transform.eulerangles = vector3.zero;
  }
 }
 private void start()
 {
  init();
 }

 /// <summary>
 /// 留给外界调用的接口
 /// </summary>
 public void startback()
 {
  if (isactive)
   return;
  startcoroutine(toback());
 }
 /// <summary>
 /// 留给外界调用的接口
 /// </summary>
 public void startfront()
 {
  if (isactive)
   return;
  startcoroutine(tofront());
 }
 /// <summary>
 /// 翻转到背面
 /// </summary>
 ienumerator toback()
 {
  isactive = true;
  mfront.transform.dorotate(new vector3(0, 90, 0), mtime);
  for (float i = mtime; i >= 0; i -= time.deltatime)
   yield return 0;
  mback.transform.dorotate(new vector3(0, 0, 0), mtime);
  isactive = false;

 }
 /// <summary>
 /// 翻转到正面
 /// </summary>
 ienumerator tofront()
 {
  isactive = true;
  mback.transform.dorotate(new vector3(0, 90, 0), mtime);
  for (float i = mtime; i >= 0; i -= time.deltatime)
   yield return 0;
  mfront.transform.dorotate(new vector3(0, 0, 0), mtime);
  isactive = false;
 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。