javascript - 如何让我的 Phaser 游戏射出不止一支箭？-6ren

javascript - 如何让我的 Phaser 游戏射出不止一支箭？

转载作者：行者123 更新时间：2023-11-30 10:59:52

27

4

我正在使用 Phaser 框架在 JavaScript 中制作射箭游戏。到目前为止，我已经了解了箭头的去向和击中目标的位置，但是如果您希望箭头再次射出，则必须重新加载页面。如何让它可以多次射击？

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" />
    <title>TSA Video Game</title>
    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
    <style type="text/css">
        body {
            margin: 0;
        }
    </style>
</head>
<body>

<script type="text/javascript">

    var config = {
        type: Phaser.AUTO,
        width: 800,
        height: 600,
        physics: {
            default: 'arcade'
        },
        scene: {
            preload: preload,
            create: create,
            update: update,
            render: render
        }
    };

    //Start the game
    var game = new Phaser.Game(config);

    function preload ()
    {
        this.load.image('sky', 'assets/sky.png');
        this.load.image('archer', 'assets/archer.png');
        this.load.image('target', 'assets/target.png');
        this.load.image('ground', 'assets/ground.png');
        this.load.image('rings', 'assets/rings.png');
        this.load.image('arrow', 'assets/arrow.png');

    }

    function create ()
    {   
        //Load all the images
        this.add.image(400, 300, 'sky');
        this.add.image(200, 200, 'ground');
        this.add.image(530, 365, 'target');
        this.add.image(300, 100, 'rings');

        //Create the archer/player
        this.player = this.physics.add.sprite(100, 410, 'archer');
        //Create the arrow to shoot
        this.arrow = this.physics.add.sprite(100, 430, 'arrow');

        //Get keypresses
        this.cursors = this.input.keyboard.createCursorKeys();
        //Assign input for spacebar
        this.spacebar = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE);

    }

    function update ()
    {   
        //Declare constants for movement
        const moveAmt = 1500;
        const moveYamt = 0;
        this.player.setDrag(2000); 

        //Move the player left or right
        if (this.cursors.right.isDown) 
        this.player.setVelocityX(moveAmt);
        if (this.cursors.left.isDown)
        this.player.setVelocityX(-moveAmt);

        //Rotation of the player
        if (this.cursors.up.isDown && this.player.angle > -45) {
            this.player.angle -= 1;}
        if (this.cursors.down.isDown && this.player.angle < 0) {
            this.player.angle += 1;}

        //Shooting with the spacebar
        if (Phaser.Input.Keyboard.JustDown(this.spacebar)) {
            this.arrow.setVelocityX(moveAmt);
            this.arrow.setVelocityY(moveYamt);
        }

        //Stop the arrow once it hits the bullseye
        if (this.arrow.x > 480) {
            this.arrow.x = 480;
            this.arrow.setVelocityX(0);
            this.arrow.setVelocityY(0);
        }

    }

    function render() {
    }

</script>
</body>
</html>

我试过创建三个箭头，并在“if (Phaser.Keyboard.Justdown”语句中嵌套另一个 if 语句，但这没有用。

最佳答案

您需要能够创建箭头数组。

这是一个快速、上手的示例:

在你的create()函数中

this.arrows = [];//创建你的数组

之后:

if (Phaser.Input.Keyboard.JustDown(this.spacebar)) {
  let arrow = this.physics.add.sprite(100, 430, 'arrow'); // Create a new arrow
  arrow.setVelocityX(moveAmt); // get it moving
  arrow.setVelocityY(moveYamt);
  this.arrows.push(arrow); // save it in the array
}

是的，您需要更多代码，但这应该有所帮助。

然后你需要循环遍历运动中的箭头并更新它们中的每一个

关于javascript - 如何让我的 Phaser 游戏射出不止一支箭？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58276265/

27

4

0

文章推荐： javascript - 你如何制作书签更改页面图标？

文章推荐： javascript - 一次只会影响一个元素的切换类

文章推荐： javascript - 如何找到 typedArray 的类型？

文章推荐： javascript - jquery点击事件不触发

phaser-framework - 我应该使用 Phaser 3 还是 Phaser 2/CE？
关闭。这个问题需要更多 focused .它目前不接受答案。想改进这个问题？更新问题，使其仅关注一个问题 editing this post . 3年前关闭。 Improve this questi
javascript - 如何编译我的 TypeScript Phaser 项目，使其仅使用 Phaser.d.ts 引用路径找到 "Phaser"命名空间？
我一直在同时学习 Phaser 和 TypeScript，事情或多或少进展顺利。我一开始只是通过脚本标签让我的index.html 调用phaser.js 和我的app.js，效果很好。我用了///
phaser-framework - 试图在 Phaser 中获得鼠标滚轮缩放效果
使用鼠标滚轮放大和缩小似乎有效。但是我想将鼠标位置扔到混音中。如果用户放大，相机会(最好是缓慢的，但也可以立即工作)在放大或缩小时向鼠标位置移动。换句话说，在缩放时，相机应该以当前鼠标的 x、y 坐
phaser-framework - Phaser 3. 在运行时更改游戏的尺寸
嗨，请帮助我了解如何使用 Phaser3 创建真正的响应式游戏。响应性至关重要，因为游戏(Blockly 工作区的表示层)应该能够在屏幕上扩展到更大的部分，并在 session 期间多次收缩。问题
phaser-framework - 在 Phaser 中开始游戏之前等待点击
JSFiddle 演示是 here ，但我也粘贴下面的代码。我的问题很简单(尽管我似乎找不到任何如何实现这一点的示例):现在如果您在 JSFiddle 中启动游戏，您会看到矩形立即“掉落”下来。我想以
phaser-framework - Phaser 3 使用更新的起始值重新启动补间
我有 4 个可重复使用的补间，它们应该相对于其当前位置移动目标。它们中的每一个都与此示例基本相同，但是对于每个基本方向: goLeft = this.tweens.add({ targets:
phaser-framework - 如何在 Phaser 3 上重新加载游戏？
点击按钮后如何重新开始游戏？我尝试了以下代码: this.scene.stop(); this.scene.start(); 场景重新加载，但预加载功能再次失效。最佳答案试试这段代码: this.
phaser-framework - 如何在 Phaser 3 中使用本地字体？
我在 fonts/ 中有一个字体目录。如何将其加载到游戏中，然后在游戏中的文本对象上使用它？我无法找到有关在 Phaser 3 中使用字体的任何信息。最佳答案首先使用 css 加载你的字体(@fo
phaser-framework - 在 Phaser 中切换状态之前是否需要杀死所有 Sprite ？
在 Phaser 中从状态 A 切换到状态 B 之前，我是否需要杀死所有 Sprite 和动画，还是 Phaser 会自动清理它们？最佳答案 Kamen Minkov 的回答几乎是正确的，但您需要考
phaser-framework - 如何在 Phaser 3 中创建动画按钮？
首先，我使用的是 Phaser 3。我想从 spritesheet 中创建一个按钮。当鼠标悬停在按钮上时，我希望第二帧出现并在鼠标离开时消失。 this.load.spritesheet('butto
javascript - Phaser.js 获取给定的无效 Phaser 状态对象
我目前正在尝试使用 Phaser 2d 游戏引擎。我目前有这段代码: // Generated by CoffeeScript 1.10.0 (function() { var create,
phaser-framework - 如何在 Phaser 3 中创建动画按钮？
首先，我使用的是 Phaser 3。我想从 spritesheet 中创建一个按钮。当鼠标悬停在按钮上时，我希望第二帧出现并在鼠标离开时消失。 this.load.spritesheet('butto
javascript - Phaser - 如何使用 Phaser.js 正确实现街机物理碰撞
我在网上浏览了一些教程并查看了文档，但这似乎让我更加困惑。问题: 所有 Sprite 的物理都在这段代码中初始化: // Store all Sprites in an Array for easy
phaser-framework - Phaser 3 中的图像和 Sprite 有什么区别？
在 Phaser 3 文档中，我可以看到 Sprite 之间的最大区别和 Image是您不能为 Image 设置动画或添加物理体。，但在 Image属性你可以看到一个animationManager
phaser-framework - Phaser 3 - 将形状固定到相机 View 中
我正在尝试从随机生成的矩阵中绘制代表我的等级的小 map 。为此，我逐个绘制黑色或白色的小方 block 来直观地表示矩阵(我不知道这是否是使用移相器实现这一点的最佳方法，实际上，我是这个框架的初学
phaser-framework - 决定 Pixi.js 还是 Phaser
已结束。此问题正在寻求书籍、工具、软件库等的推荐。它不满足Stack Overflow guidelines 。目前不接受答案。我们不允许提出寻求书籍、工具、软件库等推荐的问题。您可以编辑问题，以便
phaser-framework - Phaser 3 中的 setInteractive 函数存在问题
我最近开始使用 3.18 版来开发一款早期在 3.9 版中开发的游戏。另外，我在配置中使用 Phaser.SCALE.FIT。但是单击或触摸(如果是移动设备) Canvas 上的某些按钮图像没有任何
phaser-framework - 在 Phaser 中反转 y 轴
我正在构建一个两人棋盘游戏。我想从当前玩家的角度显示棋盘。因此，如果我是棋盘“底部”的玩家，我想反转 y 轴并将原点移动到 Canvas 的左下角。也可以转换鼠标点击。我只想影响 Sprite 的位置
javascript - Phaser 将物理应用到 Phaser.Sprite (ES6) 的子类
我正在尝试将 Gravity.Y 街机物理应用到 Angular 色类(Phaser.Sprite)。但gravity.y并没有影响 Sprite 并保持在原来的位置。应用物理学有什么特定的顺序吗？
javascript - phaser.io 多个 phaser.game 实例
我想在 Phaser.io 中使用多个 new Phaser.Game 实例，但是当我创建第二个 Phaser.Game 对象时，我得到以下错误 WebGL: INVALID_OPERATION: u

首页

博学

6Ren·AI

商城

javascript - 如何让我的 Phaser 游戏射出不止一支箭？