上期2D子弹跟随大受欢迎,想要个3D版本的?

引言

实现子弹跟随的游戏开发技巧之3D版本

大家好,在上一篇文章 中,笔者介绍了如何在Cocos游戏开发 中实现2D子弹的跟随效果。

有许多感兴趣的小伙伴 私信我,有没有3D版本的呀?

3D 其实和2D 的子弹跟随效果大同小异 ,需要一些简单的数学知识

于是,本文将介绍一下如何实现3D版本的子弹跟随效果。

本文源工程在文末获取,小伙伴们自行前往。

还是直接上代码

typescript 复制代码
import { _decorator, CCFloat, Component, instantiate, Node, tween, v3, Vec3 } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('BulletFollow3D')
export class BulletFollow3D extends Component {
    // 属性定义
    @property(Node)
    target: Node;
    @property(Node)
    bulletPfb: Node;
    @property(Node)
    bumpPfb: Node;
    @property(CCFloat)
    internal: number = 5;
    @property(CCFloat)
    speed: number = 1;

    // 子弹数组和计时器
    bullets: Node[] = [];
    tick: number = this.internal;

    // update函数
    update(deltaTime: number) {
        // 计时器逻辑
        this.tick += deltaTime;
        if (this.tick >= this.internal) {
            this.tick -= this.internal;
            // 创建子弹并设置初始状态
            var bullet = instantiate(this.bulletPfb);
            bullet.scale = this.bulletPfb.scale.clone().divide3f(2, 2, 2);
            bullet.parent = this.bulletPfb.parent;
            tween(bullet).by(1, { position: v3(0, 1, 0) })
                .call(() => {
                    this.bullets.push(bullet);
                }).start();
        }
        // 子弹跟随逻辑
        for (let i = this.bullets.length - 1; i >= 0; i--) {
            let bullet = this.bullets[i];
            bullet.setWorldPosition(bullet.forward.clone().multiplyScalar(this.speed * deltaTime).add(bullet.worldPosition));
            bullet.lookAt(this.target.worldPosition);
            // 判断是否击中目标
            if (Vec3.distance(bullet.worldPosition, this.target.worldPosition) < 0.1) {
                this.bullets.splice(i, 1);
                bullet.destroy();
                // 创建击中效果
                let bump = instantiate(this.bumpPfb);
                bump.parent = this.bumpPfb.parent;
                bump.worldPosition = this.target.worldPosition;
                bump.active = true;
                tween(bump)
                    .delay(1)
                    .call(() => { bump.destroy(); })
                    .start();
            }
        }
    }
}

代码解析

让我们逐步解析代码:

  1. 属性:

    • target: 子弹跟随的目标节点。
    • bulletPfb: 子弹的预制节点。
    • bumpPfb: 撞击效果的预制节点。
    • internal: 子弹生成的间隔时间。
    • speed: 子弹移动的速度。
  2. 变量:

    • bullets: 保存子弹节点的数组。
    • tick: 计时器,用于控制子弹生成的时间间隔。
  3. update方法:

    • 处理子弹的生成和跟随逻辑。
    • 控制子弹生成的间隔时间。
    • 计算子弹的角度和位置,使其朝向目标节点移动。
    • 如果子弹接近目标节点,触发撞击效果并销毁子弹。

实现关键技巧

实现3D子弹跟随效果的关键在于以下几个方面:

  1. 子弹的创建和初始化: 首先,需要在适当的时机创建子弹,并设置其初始状态。这可能包括子弹的初始位置、缩放、旋转等属性。

  2. 子弹的移动逻辑: 子弹在发射后需要按照一定的逻辑进行移动。这通常包括在每一帧更新子弹的位置,使其沿着指定的方向前进。在3D场景中,你可以使用向量(Vector3)表示子弹的位置和移动方向。

  3. 子弹的朝向: 子弹应该始终朝向目标,以确保追踪效果。在Cocos Creator 3.x中,可以使用lookAt方法使子弹朝向目标节点。

  4. 碰撞检测: 实现子弹与目标的碰撞检测是实现追踪效果的重要一环。通过检测子弹与目标之间的距离或碰撞体是否相交,可以确定是否击中目标。

  5. 击中效果: 当子弹击中目标时,可能需要播放一些效果,比如爆炸、粒子效果等。这可以通过在击中位置实例化相应的效果节点并进行动画或渐隐来实现。

  6. 计时器或触发器: 控制子弹发射的间隔时间,以确保子弹按照设定的频率发射。这可以通过计时器或其他触发机制来实现。

适用场景

3D子弹跟随效果通常适用于各种类型的射击游戏,其中玩家需要与敌人或目标进行互动。以下是一些常见类型的游戏,其中可能会使用这种效果:

  1. 第一人称射击游戏(FPS): 在这类游戏中,玩家通过第一人称视角与敌人交战。实现3D子弹跟随效果可以增加射击的视觉冲击力,使射击体验更加真实和令人满足。

  2. 第三人称射击游戏(TPS): 类似于FPS,但玩家在第三人称视角中控制角色。3D子弹跟随效果可以用于增强射击的动态感和精准度。

  3. 战术射击游戏: 在这种类型的游戏中,玩家通常需要使用策略和团队合作来完成任务。3D子弹跟随效果可以在战术层面上提供更多选择和可能性。

  4. 射击类竞技游戏: 比如射击类电子竞技游戏,玩家需要在竞技场中与其他玩家对抗。3D子弹跟随效果可以提高比赛的紧张感和刺激感。

  5. 虚拟现实(VR)射击游戏: 在VR环境下,玩家可以更直观地感受到3D子弹跟随效果,增强沉浸感和互动性。

效果演示

结语

本文源工程 可通过私信BulletFollow3D获取。

我是"亿元程序员",一位有着8年游戏行业经验的主程。在游戏开发中,希望能给到您帮助, 也希望通过您能帮助到大家。

AD:笔者线上的小游戏《贪吃蛇掌机经典》《重力迷宫球》《填色之旅》大家可以自行点击搜索体验。

实不相瞒,想要个在看 !请把该文章分享给你觉得有需要的其他小伙伴。谢谢!

推荐专栏:

100个Cocos实例

8年主程手把手打造Cocos独立游戏开发框架

和8年游戏主程一起学习设计模式

从零开始开发贪吃蛇小游戏到上线系列

知识付费专栏

相关推荐
却尘8 小时前
Next.js 请求最佳实践 - vercel 2026一月发布指南
前端·react.js·next.js
ccnocare8 小时前
浅浅看一下设计模式
前端
Lee川8 小时前
🎬 从标签到屏幕:揭秘现代网页构建与适配之道
前端·面试
Ticnix9 小时前
ECharts初始化、销毁、resize 适配组件封装(含完整封装代码)
前端·echarts
纯爱掌门人9 小时前
终焉轮回里,藏着 AI 与人类的答案
前端·人工智能·aigc
twl9 小时前
OpenClaw 深度技术解析
前端
崔庆才丨静觅9 小时前
比官方便宜一半以上!Grok API 申请及使用
前端
星光不问赶路人9 小时前
vue3使用jsx语法详解
前端·vue.js
天蓝色的鱼鱼9 小时前
shadcn/ui,给你一个真正可控的UI组件库
前端
布列瑟农的星空9 小时前
前端都能看懂的Rust入门教程(三)——控制流语句
前端·后端·rust