Question

将画布附加到iphone上的文档时出现问题。运行时：cordova编译然后：cordova启动浏览器添加画布并呈现正常。使用xcode和ios模拟器启动应用程序但看起来画布永远不会被渲染。我在这里做错了吗？

onDeviceReady: function() {
    this.receivedEvent('deviceready');

    var Container  = PIXI.Container,
        autoDetectRenderer = PIXI.autoDetectRenderer,
        loader = PIXI.loader,
        resources = PIXI.loader.resources,
        Sprite = PIXI.Sprite,
        Rectangle = PIXI.Rectangle,
        TextureCache = PIXI.TextureCache,
        Graphics = PIXI.Graphics,
        Text = PIXI.Text,
        ParticleContainer = PIXI.ParticleContainer,
        stage,
        renderer;

    stage = new Container();

    renderer = new autoDetectRenderer(window.innerWidth, window.innerHeight);

    document.body.appendChild(renderer.view);


},

Answer 1

在该代码示例中，您实际上从未实际呈现容器。检查PIXI示例，例如在这里：https://pixijs.github.io/examples/#/basics/basic.js

所以你还需要打电话： renderer.render（阶段）;

你很可能需要requestAnimationFrame（functionToCall）;当你有活动部件的时候，打电话到那里实际运行游戏。

Answer 2

与其他答案一样，您需要使用本机方法renderer.render(stage)递归调用requestAnimationFrame。此外，Cordova只是在Web View中运行的网页，此示例将在任何Web浏览器中运行。

 onDeviceReady: function() {
     this.receivedEvent('deviceready');
    var Container  = PIXI.Container,
    autoDetectRenderer = PIXI.autoDetectRenderer,
    loader = PIXI.loader,
    resources = PIXI.loader.resources,
    Sprite = PIXI.Sprite,
    Rectangle = PIXI.Rectangle,
    TextureCache = PIXI.TextureCache,
    Graphics = PIXI.Graphics,
    Text = PIXI.Text,
    ParticleContainer = PIXI.ParticleContainer,
    stage,
    renderer;
    stage = new Container();
    renderer = new autoDetectRenderer(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.view);        
    // requestAnimationFrame will make gameLoop recursive
    function gameLoop() {
      // Loop this function 60 times per second
      requestAnimationFrame(gameLoop);
      //HERE: <-- the logic of your game or animation 
      renderer.render(stage);
   }  
   gameLoop();

}，

有关requestAnimationFrame的其他说明，请阅读以下链接https://www.paulirish.com/2011/requestanimationframe-for-smart-animating/

Canvas不会在带有cordova和pixi.js的iphone上呈现

2 个答案: