1

我正在使用 Phaser 2 CE 为 Facebook 即时游戏开发游戏，我不喜欢在起点显示的加载进度，我该如何摆脱它？我正在使用快速启动页面中给出的默认示例

      FBInstant.initializeAsync()
      .then(function() {
        var images = ['phaser2'];
        for (var i=0; i < images.length; i++) {
         var assetName = images[i];
         var progress = ((i+1)/images.length) * 100;
         game.load.image('./assets/' + assetName + '.png'); 
         // Informs the SDK of loading progress
         FBInstant.setLoadingProgress(progress);  
        }
      });
4

4 回答 4

1

我尝试了一些有趣的东西，但它没有根据这个例子回答问题

var sprite;
var PixelW = window.innerWidth;
var PixelH = window.innerHeight;
var game = new Phaser.Game(PixelW, PixelH, Phaser.AUTO, 'game', { preload: preload, create: create, update: update });

function preload() {
  game.load.onLoadStart.add(loadStart, this);
  game.load.onFileComplete.add(fileComplete, this);
  startLoading();

}

function  startLoading () {
  game.load.image('logo1', 'assets/sprites/phaser1.png');
  game.load.image('logo2', 'assets/sprites/phaser2.png');
  game.load.image('dude', 'assets/sprites/phaser-dude.png');
  game.load.image('ship', 'assets/sprites/phaser-ship.png');
  game.load.image('mushroom', 'assets/sprites/mushroom.png');
  game.load.image('mushroom2', 'assets/sprites/mushroom2.png');
  game.load.image('diamond', 'assets/sprites/diamond.png');
  game.load.image('bunny', 'assets/sprites/bunny.png');
  game.load.start();
}

function create() {

  game.stage.backgroundColor = 0x3b5998;
  game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
  sprite = game.add.sprite(game.world.centerX, game.world.centerY, 'dude');
  sprite.inputEnabled = true;
  sprite.events.onInputDown.add(myHandler, this);
  var text = game.add.text(10, 10, PixelW + " " + " " + PixelH, { font: "65px Arial", fill: "#ffff00", align: "center" });
}

function loadStart() {

}

//	This callback is sent the following parameters:
function fileComplete(progress, cacheKey, success, totalLoaded, totalFiles) {
  
  FBInstant.setLoadingProgress(progress);
  //console.log(cacheKey + " " + progress);

}

function myHandler() {
  sprite.anchor.setTo(0.5, 0.5);
  sprite.x = Math.floor(Math.random() * PixelW);
  sprite.y = Math.floor(Math.random() * PixelH);
}

function update() {

}
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <script src="https://connect.facebook.net/en_US/fbinstant.6.0.js"></script>
    <script src="phaser.min.js" type="text/javascript"></script>
    <title></title>
  </head>
  <body>
    <script type="text/javascript">
      var p = 0;
      FBInstant.initializeAsync()
      .then(function() {
        //FBInstant.setLoadingProgress(50);
        //FBInstant.setLoadingProgress(100);    
      });

      // Once all assets are loaded, tells the SDK
      // to end loading view and start the game

      FBInstant.startGameAsync()
       .then(function() {
         // Retrieving context and player information can only be done
         // once startGameAsync() resolves
         var contextId = FBInstant.context.getID();
         var contextType = FBInstant.context.getType();

         var playerName = FBInstant.player.getName();
         var playerPic = FBInstant.player.getPhoto();
         var playerId = FBInstant.player.getID();

         // Once startGameAsync() resolves it also means the loading view has
         // been removed and the user can see the game viewport

//         game.start();
       });
    </script>
    <div id="game"></div>
    <script src="game.js" type="text/javascript"></script>
  </body>
</html>

于 2018-05-13T15:16:20.813 回答
1

你可以尝试这个例子中给出的类似下面的代码然后创建你的游戏，我知道它不干净但它可以工作

  FBInstant.initializeAsync()
  .then(function() {
    FBInstant.setLoadingProgress(50);
    FBInstant.setLoadingProgress(100);
  });
于 2018-05-13T10:05:02.120 回答
0

这是我的做法。你可以从那里开始建造。

function preload() {
    // Load some assets
    FBInstant.setLoadingProgress(100)
}

function create() {
    FBInstant
        .startGameAsync()
        .then(() => {
            // Here you can now get users name etc.
            console.log(this)
        })
}

FBInstant.initializeAsync()
    .then(() => {
        new Phaser.Game({
            type: Phaser.AUTO,
            width: window.innerWidth,
            height: window.innerHeight,
            scene: {
                preload,
                create
            }
        })
    })
于 2019-02-07T17:59:00.847 回答
0

我使用下面的方法，在每个文件用 Phaser 加载后增加加载百分比。我还包括一个尝试捕获，以便在测试本地游戏时游戏不会崩溃。

      preload: function () {
        try{
            FBInstant.initializeAsync()
                .then(function() {        
                });
            }
            catch(err) {
            console.log('FB Instant Games Error: No Internet Connected');
        }
        this.load.image('gameItem1', 'assets/sprite/game_item1.png');
        this.load.image('gameItem2', 'assets/sprite/game_item2.png');
      }

接着...

      startFacebookGame: function(){
        try{
          FBInstant.startGameAsync()
            .then(function() {
            // Retrieving context and player information can only be done
            // once startGameAsync() resolves
            var contextId = FBInstant.context.getID();
            var contextType = FBInstant.context.getType();

            var playerName = FBInstant.player.getName();
            var playerPic = FBInstant.player.getPhoto();
            var playerId = FBInstant.player.getID();

            // Once startGameAsync() resolves it also means the loading view has 
            // been removed and the user can see the game viewport
          });
        }
        catch(err) {
          console.log('Analytics Connection Error');
        }
      },

      fileComplete: function(progress, cacheKey, success, totalLoaded, totalFiles) {
        try{
          FBInstant.setLoadingProgress(progress);
        }
          catch(err) {
          console.log('FB Instant Games progress Failed: No Internet Connected.');
        }

        //console.log("Progress: " + progress);
      },
于 2018-07-31T19:36:35.333 回答