Jump to content

load progress and the loading percentage is really fast


seekpunk
 Share

Recommended Posts

 var cw = 500, ch = 500,test,text;
            var game = new Phaser.Game(cw, ch, Phaser.AUTO, 'test', { preload: preload, create: create, update: update });
            function preload()
            {
                text = game.add.text(game.world.width / 4 + 20, game.world.height / 2, '', { fill: '#000000' });
 
                game.load.spritesheet('logo','img/LoadingCircle.png', 102, 102, 8);
                /* those images are just for test */
                game.load.image('buttonPlay', 'img/1912155.jpg');
                game.load.image('buttonleft', 'img/dream.jpg');
                game.load.image('wall','img/images/wallpaper-6.jpg');
                game.load.image('wall1','img/Wallpapers.jpg');
                game.load.image('wall1','img/Download.jpg');
                /* finish test images */
                game.load.onLoadStart.add(loadStart, this);
                game.load.onFileComplete.add(fileComplete, this);
                game.load.onLoadComplete.add(loadComplete, this);
                game.load.start();
             }
            function create() {
 
                game.stage.backgroundColor = "#FFFFFF";
                test = game.add.sprite(game.world.width / 4, game.world.height / 4, 'logo');
                test.animations.add('logo');
                test.animations.play('logo', 30, true);
             }
            
            function loadStart() { text.Text="loading..."; }
            function fileComplete(progress, cacheKey, success, totalLoaded, totalFiles) {
                console.log(progress);
                text.text = progress + "%";
            }
            function loadComplete() {  }
            function update() { }

if someone test this you can see that it's loading so fast and the progress is always 100%  , how can i make a work around so i can display the progress in a smooth way while the files are being loaded ( i saw the "loading event" example in phaser.io/example , but it is based on a button click , here i want it to be on the page load event ) can someone help me out please   

Link to comment
Share on other sites

  • 2 months later...

//Using timer to display a smooth changing progress bar is so easy.

var game = new Phaser.Game(500, 500, Phaser.AUTO, '', { preload: preload });

function preload(game){

// load assets

game.load.spritesheet('logo','img/LoadingCircle.png', 102, 102, 8);

game.load.image('buttonPlay', 'img/1912155.jpg');

game.load.image('buttonleft', 'img/dream.jpg');

game.load.image('wall','img/images/wallpaper-6.jpg');

game.load.image('wall1','img/Wallpapers.jpg');

game.load.image('wall1','img/Download.jpg');

        //create a progress display text

        var loadingText = game.add.text(200, 270, 'loading... 0%', { fill: '#ffffff' });

        var progressDisplay = 0;

 

        var timerEvt = game.time.events.loop(100, function (){

            if(progressDisplay < 100){

                if(progressDisplay < game.load.progress){

                    loadingText.text = 'loading... '+(++progressDisplay)+'%';

                }

            }else{

                loadingText.text = 'Ready, Go!';

                game.time.events.remove(timerEvt);

            }

        }, this);

}

Link to comment
Share on other sites

  • 1 year later...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...