javascript 使用 Phaser.js 和 Ionic 开发游戏应用程序(缓慢/不稳定的渲染)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/25701356/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 04:52:30  来源:igfitidea点击:

Developing game app using Phaser.js and Ionic (slow/shaky rendering)

javascripthtmlangularjsionic-frameworkphaser-framework

提问by Vamshi Suram

Just to let you know (in case someone wants to develop).

只是为了让您知道(以防有人想开发)。

I developed a game app using Phaser.js. I sort of put the code into Ionic blank starter app. So basically the view is rendered using Ionic app and then Phaser picks up the div by the id and displays the game.

我使用 Phaser.js 开发了一个游戏应用程序。我有点将代码放入 Ionic 空白启动器应用程序中。所以基本上视图是使用 Ionic 应用程序渲染的,然后 Phaser 通过 id 获取 div 并显示游戏。

Problem:

问题:

Its a simple flappy bird clone. Its working fine but the blocks movement is a bit shaky (as though they were shivering). Since Phaser uses WebGL, could it be the reason for slow rendering or is it due to the ionic framework (/angularjs) ?

它是一个简单的飞扬的鸟克隆。它工作正常,但块运动有点不稳定(好像它们在发抖)。由于 Phaser 使用 WebGL,这可能是渲染缓慢的原因还是离子框架 (/angularjs) 的原因?

Should I have used some other tools to build the game app?

我应该使用其他一些工具来构建游戏应用程序吗?

Thanks in advance.

提前致谢。

Edit:

编辑:

You can checkout the code here: https://github.com/vamshisuram/ionic-flappybird-clone.gitI uploaded all code into Git. So, I guess you can directly install platforms/ant-build/Hello-Cordova-debug.apkinto your mobile and test it. Or try build again and install.

你可以在这里查看代码:https: //github.com/vamshisuram/ionic-flappybird-clone.git我将所有代码上传到 Git 中。所以,我猜你可以直接将platforms/ant-build/Hello-Cordova-debug.apk安装到你的手机中并进行测试。或者再次尝试构建并安装。

回答by krik

You can make it work. BUT ... there is no support for WebGL on any Android device using the stock webview (Ionic uses Cordova to package the app which is then being run inside a webview on the device): http://caniuse.com/#feat=webgl

你可以让它工作。但是......在任何使用股票 webview 的 Android 设备上都不支持 WebGL(Ionic 使用 Cordova 打包应用程序,然后在设备上的 webview 中运行):http: //caniuse.com/#feat=网页链接

Phaser.js is built on top of Pixie.js which will fall back to 2D canvas rendering. That's why your game is running slow.

Phaser.js 建立在 Pixie.js 之上,它将回退到 2D 画布渲染。这就是您的游戏运行缓慢的原因。

If you want to use Ionic and WebGL you should build your app using CrossWalk. I have done that and it is awesome: https://crosswalk-project.org/

如果您想使用 Ionic 和 WebGL,您应该使用 CrossWalk 构建您的应用程序。我已经做到了,这很棒:https: //crosswalk-project.org/

There's other options such as CocoonJS to get WebGL going, but I haven't used those myself.

还有其他选项(例如 CocoonJS)可以使 WebGL 运行,但我自己没有使用过这些选项。