目标:拖动摇杆实现平面物体的移动
一、制作摇杆UI、平面物体
(1)新建画布Canvas,将Canvas的UI缩放模式设置为屏幕大小播放(如不设为该模式则会因界面缩放而导致UI消失)。![请添加图片描述](https://img-blog.csdnimg.cn/3d4e9e1b6376447b9e42c822baff36fa.png)
(2)在Canvas下新增图片,名为Bound,源图像设置为圆形图片,作为摇杆外圈。
(3)在Bound下新增图片,名为Center,源图像设置为圆形图片、缩小宽度和高度,作为摇杆外圈。
![请添加图片描述](https://img-blog.csdnimg.cn/b2e81a05effc4784bff6751c4e418a76.png)
(4)创建空对象,名为Actor,重置坐标并修改Sprite。
![请添加图片描述](https://img-blog.csdnimg.cn/4673386186094998b29f185d5b92d32e.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5oaL5bGIeQ==,size_20,color_FFFFFF,t_70,g_se,x_16)
(5)示例界面
![请添加图片描述](https://img-blog.csdnimg.cn/5d86c2ff6c3d451fa12ef0a5747a5521.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5oaL5bGIeQ==,size_20,color_FFFFFF,t_70,g_se,x_16)
二、实现代码
(1)JoyStick.cs //摇杆通用脚本
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.Events;
public struct JoyStickData
{
public Vector2 dir;
public float radius;
public JoyStickData(Vector2 d,float r)
{
this.dir = d;
this.radius = r;
}
public Vector2 GetPos()
{
return dir*radius;
}
}
public class JoyStick : MonoBehaviour,IPointerDownHandler,IPointerUpHandler,IDragHandler
{
public RectTransform bound;
public RectTransform center;
public float radius;
private JoyStickData HandleEventData(PointerEventData eventData)
{
Vector2 dir;
RectTransformUtility.ScreenPointToLocalPointInRectangle(bound,eventData.position,eventData.pressEventCamera,out dir);
float r =dir.magnitude;
dir =dir.normalized;
r=Mathf.Clamp(r,0,radius);
return new JoyStickData(dir,r);
}
public void OnDrag(PointerEventData eventData)
{
var data=HandleEventData(eventData);
center.localPosition=data.GetPos();
onJoystickMove(data.dir,data.radius);
}
public void OnPointerDown(PointerEventData eventData)
{
var data=HandleEventData(eventData);
center.localPosition=data.GetPos();
onJoystickDown(data.dir,data.radius);
}
public void OnPointerUp(PointerEventData eventData)
{
var data=HandleEventData(eventData);
center.localPosition=Vector2.zero;
onJoystickUp(data.dir,data.radius);
}
public virtual void onJoystickDown(Vector2 V,float R)
{
}
public virtual void onJoystickUp(Vector2 V,float R)
{
}
public virtual void onJoystickMove(Vector2 V,float R)
{
}
}
(2)MoveJoyStick.cs //移动摇杆脚本,继承JoyStick
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class MoveJoyStick : JoyStick
{
public ActorController actorController;
public override void onJoystickDown(Vector2 V, float R)
{
actorController.Move(V);
}
public override void onJoystickUp(Vector2 V, float R)
{
actorController.Move(Vector2.zero);
}
public override void onJoystickMove(Vector2 V, float R)
{
actorController.Move(V);
}
}
(3)ActorController.cs //角色控制脚本
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class ActorController : MonoBehaviour
{
private Vector2 moveDir;
public float moveSpeed;
public void Move(Vector2 dir)
{
moveDir = dir;
}
private void Update()
{
transform.Translate(moveDir * moveSpeed * Time.deltaTime);
}
}
三、为物体添加脚本
(1)为Bound挂上MoveJoyStick.cs,并为其中变量赋值。![请添加图片描述](https://img-blog.csdnimg.cn/7d10de10271541a887d8aedc277fc03d.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5oaL5bGIeQ==,size_20,color_FFFFFF,t_70,g_se,x_16)
(2)为ActorController挂上ActorController.cs,并为MoveSpeed赋值。![请添加图片描述](https://img-blog.csdnimg.cn/5736bafd7c474df1823e91f45f8093eb.png)
运行成功,这样我们就实现了利用UGUI自己手写一个简单的摇杆,欢迎小伙伴们在评论区留言!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)