cocos控制角色玩家飞机只可以在一定范围内移动,不能越界

控制玩家只可以在屏幕尺寸的范围内移动,不能越界,所以需要边界控制,需要先在cocos中确定最大最小的x和y的位置,然后在脚本中监听移动的时候,判断最大最小位置是否超出边界,是的话就设置为临界位置:

这里巧妙的使用了Math函数的最大值和最小值方法, 或者使用if判断也是可以的。

javascript 复制代码
// 限制玩家移动范围x (-230/230) y(-364/364)
const x = Math.max(-230, Math.min(230, playerPositon.x + event.getDeltaX()))
const y = Math.max(-364, Math.min(364, playerPositon.y + event.getDeltaY()))

然后设置玩家的位置:

javascript 复制代码
this.node.setPosition(x, y, 0)

控制玩家的脚本代码:

javascript 复制代码
import { _decorator, Component, EventTouch, Input, input, Node } from 'cc'
const { ccclass, property } = _decorator

@ccclass('player')
export class player extends Component {
    start() {
        input.on(Input.EventType.TOUCH_START, this.onTouchStart, this)
        input.on(Input.EventType.TOUCH_MOVE, this.onTouchMove, this)
        input.on(Input.EventType.TOUCH_END, this.onTouchEnd, this)
        input.on(Input.EventType.TOUCH_CANCEL, this.onTouchCancel, this)
    }

    onDestroy() {
        input.off(Input.EventType.TOUCH_START, this.onTouchStart, this)
        input.off(Input.EventType.TOUCH_MOVE, this.onTouchMove, this)
        input.off(Input.EventType.TOUCH_END, this.onTouchEnd, this)
        input.off(Input.EventType.TOUCH_CANCEL, this.onTouchCancel, this)
    }

    onTouchStart(event: EventTouch) {
        console.log('onTouchStart', event)
    }

    onTouchMove(event: EventTouch) {
        console.log('onTouchMove', event)
        const playerPositon = this.node.position
        // 限制玩家移动范围x (-230/230) y(-364/364)
        const x = Math.max(-230, Math.min(230, playerPositon.x + event.getDeltaX()))
        const y = Math.max(-364, Math.min(364, playerPositon.y + event.getDeltaY()))
        this.node.setPosition(x, y, 0)
    }

    onTouchEnd(event: EventTouch) {
        console.log('onTouchEnd', event)
    }

    onTouchCancel(event: EventTouch) {
        console.log('onTouchCancel', event)
    }

    update(deltaTime: number) {}
}
相关推荐
宁风NF7 小时前
JavaScript:内存、垃圾回收、性能优化
开发语言·前端·javascript·学习·性能优化·es6
勾勾圈圈蛋蛋7 小时前
DOM、BOM、DOM操作详解 + 结合Vue响应式关联梳理
前端
打妖妖灵滴哪吒8 小时前
IOS模态窗口的作用与设计原则
前端·ui
午安~婉8 小时前
挑战二:博客预览卡片
前端·javascript·html
环境栈笔记8 小时前
指纹浏览器安全评测方法:核对环境、数据与权限后再选型
前端·人工智能·后端·自动化
打妖妖灵滴哪吒8 小时前
前端开发/UI设计师-APP中如何进行可发现性设计
前端·ui
Kinghiee8 小时前
从使用场景切入前端常见设计模式
前端·设计模式
郭老二18 小时前
【前端】vue3:编译步骤
前端
不在逃避q19 小时前
Trae/Vs Code/Cursor命令行无法跑npm命令
前端·arcgis·npm
夏殇之殁19 小时前
包中创建自定义列表项。 . 使用自定义列表项进行数据绑定 . 将天气预报数据保存到本地内存表,通过LiveBindings进行显示。 ...
服务器·前端·javascript