Unity3D学习笔记02:GUI主角跟随鼠标运动
2013-08-16 00:30
260 查看
今天我们来讲一下在2D平面内怎样使一个主角跟随鼠标进行移动和旋转,首先我们需要准备一张主角运动的帧动画序列图片,如下图所示:
![](https://img-blog.csdn.net/20130815235450140?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvanVrYWlibG9n/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
我们先来观察一下这张图片,我们需要使用的仅仅是下面两行的帧动画,这在后面的裁剪图片的方法中我们会定义初始的裁剪帧为第十帧,即第三行的第一列,这里需要注意一下。
下面我把实现代码贴出来,都添加了注释,但在某些地方还是存在疑问,希望了解的朋友能交流指导一下。
运行效果如下,主角图片会跟随鼠标运动,旋转,并播放动画。
![](https://img-blog.csdn.net/20130816001045812?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvanVrYWlibG9n/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
最后附上工程源码的下载地址:点此下载
我们先来观察一下这张图片,我们需要使用的仅仅是下面两行的帧动画,这在后面的裁剪图片的方法中我们会定义初始的裁剪帧为第十帧,即第三行的第一列,这里需要注意一下。
下面我把实现代码贴出来,都添加了注释,但在某些地方还是存在疑问,希望了解的朋友能交流指导一下。
using UnityEngine; using System.Collections; public class NewBehaviourScript : MonoBehaviour { //记录上一次帧动画的时间 float lasttime; //设置每帧播放的间隔时间 float stepTime = 0.08f; //设置主角的旋转角度 float angle; //播放第几帧动画 int frameCount = 10; //主角的初始位置,即屏幕中心 Vector2 center; //主角贴图 public Texture2D hero; // Use this for initialization void Start () { //初始化上一帧播放时间,即程序开始时间 lasttime = Time.time; //初始化主角位置 center = new Vector2(Screen.width / 2f,Screen.height / 2f); } void Update () { //如果当前时间大于上一帧播放时间 + 每帧的间隔时间,则记录播放第frameCount动画 if(Time.time > lasttime + stepTime) { frameCount = (frameCount + 1)%10; //上一帧播放时间等于当前时间 lasttime = Time.time; } //取得鼠标的点击位置,要转换成屏幕坐标系(原点在左下角) //屏幕坐标系转换成GUI坐标系即横坐标不变,纵坐标等于屏幕高度减去屏幕坐标系的纵坐标 Vector2 newMousePos = new Vector2(Input.mousePosition.x,Screen.height - Input.mousePosition.y); //取得主角需要旋转的角度,这里我还是不明白为什么需要180减去它的反正切角度 //希望了解的朋友指点一下 angle = 180 - Mathf.Atan2(newMousePos.x - center.x , newMousePos.y - center.y) * Mathf.Rad2Deg; if(Input.GetMouseButton(0)) { //开启一个协同程序,让下面这个方法延迟执行 StartCoroutine(PlayerMove(newMousePos)); } } IEnumerator PlayerMove(Vector2 movePosition) { Vector2 tempPos = center; for(int i =0;i<60;i++) { //Vector2.Lerp是求两点之间的插值,当第三个参数等于0时返回第一个参数的值, //0.5时返回两点中间值,1时返回第二个参数值,作用是防止主角瞬移 center = Vector2.Lerp(tempPos,movePosition,(i+1) / 60f); yield return null; } } void OnGUI() { //使GUI围绕一点旋转一定角度 GUIUtility.RotateAroundPivot(angle,center); //裁切绘制一幅图片, //第一个参数是放置裁剪后的图片位置 //第二个参数是需要裁剪绘制的图片 //第三个参数是需要裁剪的地方,这里我们需要从第三行开始裁剪两列,每个小图片的宽高为大图片的0.2倍和0.25倍(因为我们有四行五列) //我们定义frameCount的初始值为第三行第一个帧动画,那么就要设置初始值为10,然后分别%5得到列数,/5得到行数,即可得到裁剪图片的位置 GUI.DrawTextureWithTexCoords(new Rect(center.x - 75,center.y - 75,150,150),hero,new Rect(0.2f * (frameCount % 5),0.25f * (frameCount / 5),0.2f,0.25f)); } }
运行效果如下,主角图片会跟随鼠标运动,旋转,并播放动画。
最后附上工程源码的下载地址:点此下载
相关文章推荐
- 【jQuery】一个跟随鼠标运动的图层
- 拖拽及鼠标跟随div运动
- Unity3D GUI中的图片跟随鼠标旋转脚本
- Unity3d GUI中的图片跟随鼠标旋转脚本
- js鼠标跟随运动效果
- 跟随鼠标转动的眼球效果特效,鼠标跟随运动
- 鼠标跟随运动效果
- html5 鼠标跟随运动
- 3D 主角跟随鼠标转向 主角设置x轴摄像机上也挂一个设置y轴,按下q随机设置天空盒子和光照,主角移动
- 如何让窗体跟随鼠标运动
- js实现鼠标跟随运动效果
- Unity3D GUI中的图片跟随鼠标旋转脚本
- Dom编程(图片 在 某一区域内 跟随鼠标运动、仅IE浏览器支持)
- jQuery实现跟随鼠标运动图层效果的方法
- vb6.0如何让窗体跟随鼠标运动
- javascript鼠标跟随运动3种效果(眼球效果,苹果菜单,方向跟随)
- 原生js如何做一个链式运动,JavaScript怎么做鼠标跟随效果
- javascript运动系列第七篇——鼠标跟随运动
- javascript元素跟随鼠标在指定区域运动
- jQuery实现跟随鼠标运动图层效果的方法