- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使用 sprite 表通过箭头键移动 Angular 色,但它似乎不起作用。如果我将背景设置为大于 500、500,屏幕将随着 Angular 色移动,但我希望 Angular 色可以自由移动而背景不会随之移动。
我可以在我的代码中更改什么来使 Angular 色使用箭头键移动?并使动画真正起作用?
window.onload = function () {
var game = new Phaser.Game(500, 500, Phaser.AUTO, 'phaser-example',{ preload: preload, create: create });
function preload() {
game.stage.backgroundColor = '#fc6b84';
game.load.spritesheet('player', 'reddude.png', 64, 64);
}
function create() {
// This simply creates a sprite using the player image we loaded above and positions it at 200 x 200
var test = game.add.sprite(250, 250, 'player');
player.animations.add('walk');
player.anchor.setTo(0.5, 1);
game.physics.arcade.enable(player);
player.body.collideWorldBounds = true;
addItems();
addPlatforms();
cursors = game.input.keyboard.createCurosrKeys();
//game set up
}
function update() {
game.physics.arcade.collide(player, platforms);
game.physics.arcade.overlap(player, items, itemHandler);
game.physics.arcade.overlap(player, badges, badgeHandler);
player.body.velocity.x = 0;
// is the left cursor key presssed?
if (cursors.left.isDown) {
player.animations.play('walk', 10, true);
player.body.velocity.x = -50
player.scale.x = - 1
}
// is the right cursor key pressed?
else if (cursors.right.isDown) {
player.animations.play('walk', 10, true);
player.body.velocity.x = 50
player.scale.x = 1
}
else if (cursors.up.isDown) {
player.animations.play('walk', 10, true);
player.body.velocity.y = 50
player.scale.y = 1
}
else if (cursors.down.isDown) {
player.animations.play('walk', 10, true);
player.body.velocity.y = -50
player.scale.y = -1
}
// player doesn't move
else {
player.animations.stop();
}
}
}
最佳答案
您添加了一个名为 test
的 sprite 变量,但是您将动画添加到一个名为 player
的变量中。这可能是您犯的错误,我的意思是 var player
在哪里定义?
要使不同的动画起作用,您必须将每个动画分别添加到您的 sprite 变量中。您必须指出哪些帧用于“向左行走”动画,哪些帧用于“向上行走”动画等,并创建单独的动画。像这样:
// define variable globally, outside "create()", so then "update" can also use the variable
var playersprite;
// create a sprite in the "create()" function
// note: playersprite is the variable name and 'player' is the spritesheet name string
playersprite = game.add.sprite(250, 250, 'player');
// add animations to sprite
playersprite.animations.add('walk_down', [0,1,2,3]);
playersprite.animations.add('walk_left', [4,5,6,7]);
playersprite.animations.add('walk_right', [8,9,10,11]);
playersprite.animations.add('walk_up', [12,13,14,15]);
然后根据玩家移动的方向,播放不同的动画。
// when LEFT cursor key presssed
if (cursors.left.isDown) {
playersprite.animations.play('walk_left', 10, true);
// etc.
关于javascript - 无法在 Phaser.js 中为 Sprite 设置动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45555491/
关闭。这个问题需要更多 focused .它目前不接受答案。 想改进这个问题?更新问题,使其仅关注一个问题 editing this post . 3年前关闭。 Improve this questi
我一直在同时学习 Phaser 和 TypeScript,事情或多或少进展顺利。 我一开始只是通过脚本标签让我的index.html 调用phaser.js 和我的app.js,效果很好。我用了///
使用鼠标滚轮放大和缩小似乎有效。但是我想将鼠标位置扔到混音中。 如果用户放大,相机会(最好是缓慢的,但也可以立即工作)在放大或缩小时向鼠标位置移动。换句话说,在缩放时,相机应该以当前鼠标的 x、y 坐
嗨,请帮助我了解如何使用 Phaser3 创建真正的响应式游戏。 响应性至关重要,因为游戏(Blockly 工作区的表示层)应该能够在屏幕上扩展到更大的部分,并在 session 期间多次收缩。 问题
JSFiddle 演示是 here ,但我也粘贴下面的代码。我的问题很简单(尽管我似乎找不到任何如何实现这一点的示例):现在如果您在 JSFiddle 中启动游戏,您会看到矩形立即“掉落”下来。我想以
我有 4 个可重复使用的补间,它们应该相对于其当前位置移动目标。 它们中的每一个都与此示例基本相同,但是对于每个基本方向: goLeft = this.tweens.add({ targets:
点击按钮后如何重新开始游戏?我尝试了以下代码: this.scene.stop(); this.scene.start(); 场景重新加载,但预加载功能再次失效。 最佳答案 试试这段代码: this.
我在 fonts/ 中有一个字体目录。如何将其加载到游戏中,然后在游戏中的文本对象上使用它?我无法找到有关在 Phaser 3 中使用字体的任何信息。 最佳答案 首先使用 css 加载你的字体(@fo
在 Phaser 中从状态 A 切换到状态 B 之前,我是否需要杀死所有 Sprite 和动画,还是 Phaser 会自动清理它们? 最佳答案 Kamen Minkov 的回答几乎是正确的,但您需要考
首先,我使用的是 Phaser 3。我想从 spritesheet 中创建一个按钮。当鼠标悬停在按钮上时,我希望第二帧出现并在鼠标离开时消失。 this.load.spritesheet('butto
我目前正在尝试使用 Phaser 2d 游戏引擎。 我目前有这段代码: // Generated by CoffeeScript 1.10.0 (function() { var create,
首先,我使用的是 Phaser 3。我想从 spritesheet 中创建一个按钮。当鼠标悬停在按钮上时,我希望第二帧出现并在鼠标离开时消失。 this.load.spritesheet('butto
我在网上浏览了一些教程并查看了文档,但这似乎让我更加困惑。 问题: 所有 Sprite 的物理都在这段代码中初始化: // Store all Sprites in an Array for easy
在 Phaser 3 文档中,我可以看到 Sprite 之间的最大区别和 Image是您不能为 Image 设置动画或添加物理体。 ,但在 Image属性你可以看到一个animationManager
我正在尝试从随机生成的矩阵中绘制代表我的等级的小 map 。 为此,我逐个绘制黑色或白色的小方 block 来直观地表示矩阵(我不知道这是否是使用移相器实现这一点的最佳方法,实际上,我是这个框架的初学
已结束。此问题正在寻求书籍、工具、软件库等的推荐。它不满足Stack Overflow guidelines 。目前不接受答案。 我们不允许提出寻求书籍、工具、软件库等推荐的问题。您可以编辑问题,以便
我最近开始使用 3.18 版来开发一款早期在 3.9 版中开发的游戏。另外,我在配置中使用 Phaser.SCALE.FIT。 但是单击或触摸(如果是移动设备) Canvas 上的某些按钮图像没有任何
我正在构建一个两人棋盘游戏。我想从当前玩家的角度显示棋盘。因此,如果我是棋盘“底部”的玩家,我想反转 y 轴并将原点移动到 Canvas 的左下角。也可以转换鼠标点击。我只想影响 Sprite 的位置
我正在尝试将 Gravity.Y 街机物理应用到 Angular 色类(Phaser.Sprite)。但gravity.y并没有影响 Sprite 并保持在原来的位置。 应用物理学有什么特定的顺序吗?
我想在 Phaser.io 中使用多个 new Phaser.Game 实例,但是当我创建第二个 Phaser.Game 对象时,我得到以下错误 WebGL: INVALID_OPERATION: u
我是一名优秀的程序员,十分优秀!