Javascript 如何使用phaser在移动设备浏览器上运行html5游戏?
我刚刚发现了一个名为html5的游戏框架,它说这个框架只有在支持html5的情况下才支持PC浏览器和移动设备浏览器。因此,我编写了一个示例作为教程,它在我的电脑上使用Chrome运行良好,但当我在iphone上使用Chrome浏览器启动它时。它只是给了一个空白页,什么也没有 代码如下:Javascript 如何使用phaser在移动设备浏览器上运行html5游戏?,javascript,html,mobile-safari,phaser-framework,Javascript,Html,Mobile Safari,Phaser Framework,我刚刚发现了一个名为html5的游戏框架,它说这个框架只有在支持html5的情况下才支持PC浏览器和移动设备浏览器。因此,我编写了一个示例作为教程,它在我的电脑上使用Chrome运行良好,但当我在iphone上使用Chrome浏览器启动它时。它只是给了一个空白页,什么也没有 代码如下: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <ti
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Phaser - Making your first game, part 1</title>
<script type="text/javascript" src="js/phaser.min.js"></script>
<style type="text/css">
body {
margin: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });
var score = 0;
var scoreText;
function preload() {
game.load.image('sky', 'assets/sky.png');
game.load.image('ground', 'assets/platform.png');
game.load.image('star', 'assets/star.png');
game.load.spritesheet('dude','assets/dude.png', 32,48);
game.add.sprite(0,0,'star');
}
var platforms;
function create() {
game.physics.startSystem(Phaser.Physics.ARCADE);
game.add.sprite(0,0,'sky');
platforms = game.add.group();
platforms.enableBody = true;
var ground= platforms.create(0,game.world.height-64,'ground');
ground.scale.setTo(2,2);
ground.body.immovable=true;
var ledge = platforms.create(400,400,'ground');
ledge.body.immovable=true;
ledge = platforms.create(-150,250,'ground');
ledge.body.immovable = true;
player = game.add.sprite(32,game.world.height-150,'dude');
game.physics.arcade.enable(player);
player.body.bounce.y = 0.2;
player.body.gravity.y = 300;
player.body.collideWorldBounds = true;
player.animations.add('left',[0,1,2,3],10,true);
player.animations.add('right',[5,6,7,8],10,true);
cursors = game.input.keyboard.createCursorKeys();
stars = game.add.group();
stars.enableBody = true;
for(var i=0;i<12;i++){
var star = stars.create(i*70,0,'star');
star.body.gravity.y = 100;
star.body.bounce.y=0.7 + Math.random()*0.2;
}
scoreText = game.add.text(16,16, 'score:0',{fontSize:'32px',fill:'#000'});
}
function collectStar(player, star){
star.kill();
score = score + 10;
scoreText.text = 'Score: ' + score;
}
function update() {
game.physics.arcade.collide(player, platforms);
game.physics.arcade.collide(stars,platforms);
game.physics.arcade.overlap(player,stars,collectStar, null,this);
player.body.velocity.x=0;
if(cursors.left.isDown){
player.body.velocity.x=-150;
player.animations.play('left');
}
else if(cursors.right.isDown){
player.body.velocity.x=150;
player.animations.play('right');
}else {
player.animations.stop();
player.frame=4;
}
if(cursors.up.isDown && player.body.touching.down){
player.body.velocity.y = -350;
}
}
</script>
</body>
</html>
Phaser-打造你的第一场比赛,第1部分
身体{
保证金:0;
}
var game=new Phaser.game(800600,Phaser.AUTO,,{preload:preload,create:create,update:update});
var得分=0;
文本;
函数预加载(){
game.load.image('sky','assets/sky.png');
game.load.image('ground','assets/platform.png');
game.load.image('star','assets/star.png');
game.load.spritesheet('dude','assets/dude.png',32,48);
game.add.sprite(0,0,'star');
}
var平台;
函数create(){
游戏。物理。启动系统(相位器。物理。拱廊);
game.add.sprite(0,0,'sky');
platforms=game.add.group();
platforms.enableBody=true;
var ground=platforms.create(0,game.world.height-64,'ground');
地面刻度设置为(2,2);
地面。身体。不动=真;
var ledge=platforms.create(400400,'ground');
壁架。主体。不可移动=正确;
壁架=平台。创建(-150250,'ground');
ledge.body.immoved=真;
player=game.add.sprite(32,game.world.height-150,'dude');
游戏。物理。街机。启用(玩家);
player.body.bounce.y=0.2;
player.body.gravity.y=300;
player.body.collizeWorldBounds=真;
player.animations.add('left',[0,1,2,3],10,true);
player.animations.add('right',[5,6,7,8],10,true);
cursors=game.input.keyboard.CreateCursorWorkeys();
stars=game.add.group();
stars.enableBody=true;
对于(var i=0;i,根据我的经验,在使用自动检测时,由于某些原因,受支持的渲染器通常无法正确识别。请尝试使用
Phaser.CANVAS
在游戏构造器中。根据我的经验,在使用自动检测时,由于某些原因,支持的渲染器总是无法正确识别。请尝试使用
Phaser.CANVAS
在游戏构造器中。我使用iPhone上的CocoonJS launcher应用程序来测试我的游戏。我不熟悉Android,但对于iOS用户,只需将iPhone连接到计算机,打开应用程序文件夹,然后将游戏副本拖放到CocoonJS应用程序中,然后同步手机。然后你可以在y上测试游戏您可以像在包装器中一样使用手机(没有URL,或者有任何迹象表明它是一个web应用程序).我使用iPhone上的CocoonJS launcher应用程序来测试我的游戏。我不熟悉Android,但对于iOS用户,只需将iPhone连接到计算机,打开应用程序文件夹,然后将游戏副本拖放到CocoonJS应用程序中,然后同步手机。然后,你可以在手机上测试游戏,就好像它正在运行一样一个包装器(没有URL,或者它是一个web应用程序的任何迹象)。它工作了!谢谢,但根据规范,自动应该是更好的选择。从没想过这会造成问题。很高兴能提供帮助,特别是在我一直在努力解决的问题上:)它成功了!谢谢,但根据规范,汽车应该是更好的选择。从没想过这会造成问题。很高兴能提供帮助,特别是在我一直在努力解决的问题上:)