做视频网站要多大的主机,网站备案信息如何下载,网站维护页面模版,建设部网站注册查询简介
在许多移动游戏中#xff0c;虚拟操纵杆是一个重要的用户界面元素#xff0c;用于控制角色或物体的移动。本文将介绍如何在Unity中实现虚拟操纵杆#xff0c;提供了一段用于移动控制的代码。我们将讨论不同类型的虚拟操纵杆#xff0c;如固定和跟随#xff0c;以及如…简介
在许多移动游戏中虚拟操纵杆是一个重要的用户界面元素用于控制角色或物体的移动。本文将介绍如何在Unity中实现虚拟操纵杆提供了一段用于移动控制的代码。我们将讨论不同类型的虚拟操纵杆如固定和跟随以及如何在实际游戏中使用这些操纵杆。
unity2022版本实现虚拟操作杆可以查看这篇文章 点击查看
界面节点设置 1. 添加一个Canvas节点
首先我们需要创建一个画布节点这是我们整个界面的基础。这个节点将允许我们绘制和排列其他元素。
2. 在Canvas节点下添加一个Camera节点
接下来我们将在Canvas节点下创建一个Camera节点。这个Camera节点是查看操作按钮的摄像头
2. 在Canvas节点下添加一个Joystick节点
这个Joystick节点将充当容器用于组织和管理我们的界面元素。
3. 在Joystick节点下添加两个Sprite节点
在Joystick节点中我们将添加两个Sprite节点。这两个Image节点具有不同的用途
a. 背景节点第一个Sprite节点将用作背景为整个界面提供背景图像或颜色。
b. 操作按钮节点第二个Sprite节点将用于显示操作按钮或其他交互元素。
Canvas (画布)
│
└─ Camera (摄像机)
└─ Joystick (虚拟操作父节点)│├─ Bg(背景)│└─ Btn(操作按钮)
截图可以这样 脚本编写 简要说明 因为编写的是虚拟操作杆 需要添加三个事件
触摸开始(touchStart)拖动(touchMove)触摸结束(touchEnd)
在触摸开始记录拖动的一些起始坐标。
在拖动中移动操作按钮节点如果是操作角色移动这里就可以操作移动角色
在触摸结束的时候重置坐标 1.touchStart方法描述touchStart方法它处理当玩家触摸操纵杆时的行为。根据操纵杆类型固定或跟随它设置操纵杆的初始位置。 2.touchMove方法详细解释touchMove方法这是当玩家拖动操纵杆时执行的代码。说明如何计算操纵杆输入的方向以及如何限制操纵杆的移动范围。 3.touchEnd方法描述touchEnd方法用于当玩家释放操纵杆时重置相关变量和位置同时停止玩家的移动。在初始化引用的时候可以传入参数(JoystickType)控制虚拟操作杆是固定的还是跟随触摸点的 完整的脚本如下
import { Component, assetManager, _decorator, Node, Prefab, instantiate, JsonAsset, UITransform, Vec3, Widget, Graphics, Enum, input, Input, EventTouch, RichText, Label, sys, CCString, Vec2, Camera } from cc
import utils from ../../../utils;
const { ccclass, property, type } _decorator;// 定义操纵杆的类型
export enum JoystickType {FIXED, // 固定类型的操纵杆FOLLOW // 跟随类型的操纵杆
}// 定义操纵杆的显示类型
export enum JoystickShowType {ALWAYS_DISPLAY, // 一直显示NOT_ALWAYS_DISPLAY // 仅在操作时显示
}ccclass(Joystick)
export default class Joystick extends Component {// 绑定Camera组件用于获取屏幕触摸位置property(Camera)public camera: Camera;// 绑定操纵杆节点property(Node)public joystick: Node;// 绑定操纵杆背景节点property(Node)public joystickBG: Node;// 绑定操纵杆的父节点property(Node)public joystickParent: Node;// 存储操纵杆的移动向量public joystickVec: Vec3;// 指定操纵杆的类型固定或跟随property({type: Enum(JoystickType),tooltip: 类型})public joystickType: JoystickType JoystickType.FIXED;// 指定操纵杆的显示类型一直显示或仅操作时显示property({type: Enum(JoystickShowType),tooltip: 显示类型})public joystickShowType: JoystickShowType JoystickShowType.ALWAYS_DISPLAY;// 触摸开始时操纵杆的位置private joystickTouchPos: Vec3;// 操纵杆背景的原始位置private joystickOriginalPos: Vec3;// 操纵杆背景的半径private joystickRadius: number;// 标识是否开始拖动操纵杆public startDrop: boolean;// 初始化start() {// 根据操纵杆显示类型设置其初始显示状态if (this.joystickShowType JoystickShowType.NOT_ALWAYS_DISPLAY) {this.joystickParent.active false;} else {this.joystickParent.active true;}// 保存操纵杆背景的原始位置this.joystickOriginalPos this.joystickBG.position.clone();// 计算操纵杆背景的半径背景节点宽度的一半this.joystickRadius utils.getNodeSize(this.joystickBG).width / 2;// 绑定触摸事件的处理函数this.node.on(Input.EventType.TOUCH_END, this.touchEnd, this);this.node.on(Input.EventType.TOUCH_START, this.touchStart, this);this.node.on(Input.EventType.TOUCH_MOVE, this.touchMove, this);}// 在组件销毁时解除触摸事件的绑定protected onDestroy(): void {this.node.off(Input.EventType.TOUCH_END, this.touchEnd, this);this.node.off(Input.EventType.TOUCH_START, this.touchStart, this);this.node.off(Input.EventType.TOUCH_MOVE, this.touchMove, this);}/*** 获取触摸事件在节点坐标系中的位置** param e 触摸事件对象* returns 触摸事件在节点坐标系中的位置*/getEventPosInNodePos(e: EventTouch) {// 获取触摸点的屏幕坐标let p e.getLocation();// 将屏幕坐标转换为世界坐标let word this.camera.screenToWorld(utils.getVec3(p));// 获取UITransform组件将世界坐标转换为节点本地坐标let uiTransform this.node.getComponent(UITransform);let localPos uiTransform.convertToNodeSpaceAR(new Vec3(word.x, word.y));return localPos;}// 触摸开始事件处理函数touchStart(e: EventTouch) {this.startDrop true;this.joystickParent.active true;// 根据操纵杆类型设置初始触摸位置if (this.joystickType JoystickType.FIXED) {// 固定类型的操纵杆设置触摸位置为操纵杆背景的原始位置this.joystickTouchPos this.joystickOriginalPos.clone();} else if (this.joystickType JoystickType.FOLLOW) {// 跟随类型的操纵杆将操纵杆和背景设置为触摸位置this.joystick.setPosition(utils.nodePosToNodePos(this.getEventPosInNodePos(e), this.node, this.joystick.parent));this.joystickBG.setPosition(this.joystick.position);this.joystickTouchPos this.joystick.position.clone();}// 处理触摸移动this.touchMove(e);}/*** 触摸移动事件处理函数** param e 触摸事件对象*/touchMove(e: EventTouch) {// 如果没有开始拖动则不处理if (this.startDrop false) {return;}// 获取操纵杆触摸位置的副本let joystickTouchPos this.joystickTouchPos.clone();// 获取触摸事件在节点坐标系中的位置let dragPos this.getEventPosInNodePos(e);// 获取操纵杆背景相对于节点的本地坐标let nodePos utils.nodePosToNodePos(joystickTouchPos, this.joystickBG.parent, this.node);// 计算操纵杆的移动向量并归一化let joystickVec dragPos.clone().subtract(nodePos).normalize();// 计算触摸点与操纵杆触摸位置之间的距离let joystickDist Vec3.distance(dragPos, nodePos);// 限制操纵杆在指定半径范围内移动if (joystickDist this.joystickRadius) {// 如果距离小于半径直接设置操纵杆的位置let pos joystickTouchPos.add(joystickVec.multiplyScalar(joystickDist));this.joystick.setPosition(pos);} else {// 如果距离大于半径设置操纵杆到半径位置let pos joystickTouchPos.add(joystickVec.multiplyScalar(this.joystickRadius));this.joystick.setPosition(pos);}}/*** 触摸结束事件处理函数** param e 触摸事件对象*/touchEnd(e: EventTouch) {// 标识结束拖动this.startDrop false;// 根据操纵杆显示类型设置其显示状态if (this.joystickShowType JoystickShowType.NOT_ALWAYS_DISPLAY) {this.joystickParent.active false;} else {this.joystickParent.active true;}// 将操纵杆移动向量重置为零this.joystickVec Vec3.ZERO;// 将操纵杆和背景位置重置为原始位置this.joystick.setPosition(this.joystickOriginalPos);this.joystickBG.setPosition(this.joystickOriginalPos);}
}大致效果如下
固定 跟随 社交
QQ群859055710
