How to customize loading screen

Community Games showcase
1

how to customize the loading screen

1 Like
2

[url]Custom Screen Loading (HTML5) - #4 by RapaGameZ]
Might help, I got problem with it though. But try it out :slight_smile:

3

Do you remember this?:
http://www.forum.compilgames.net/viewtopic.php?f=19&t=6870
:confused: :confused: :confused: … :laughing:

4

Excellent question !

For a little mobile game which have a very little loading time (1 second), I wanted to remove load time display because it is only displayed for one second and player only see something like “63%” and nothing else.

As it is not pretty, and thanks to messages in this thread which put me on the track (with a link to this : Custom Screen Loading (HTML5) - #4 by RapaGameZ) I found a way to not display load time by overriding gdjs.RuntimeGame.prototype.loadAllAssets JS method in a separated source file, like this :

gdjs.RuntimeGame.prototype.loadAllAssets = function(callback) {
    var allAssetsTotal = this._data.resources.resources.length

    var that = this
    this._imageManager.loadTextures(function (count, total) {

    }, function() {
        that._soundManager.preloadAudio(function (count, total) {

        }, function() {
            callback()
        })
    })
}

inner and callback methods are left empty in order to not display percentage loading (a single number when loading takes less than 1 second !)

I have now a second issue : the black PIXI renderer does not fit my phone screen perfectly so when launching games I can see a black square. PIXI renderer are determinate by game properties “window width” and “window height” i.e. (javascript spoken) gdjs.projectData.properties.windowWidth and gdjs.projectData.properties.windowHeight. I would be glad to be able to override these properties with my separate script so PIXI renderer fit the screen entirely but my custom script is loaded before data.js (which contains game properties)

Another solution I consider is to redefine body background color directly in HTML after game export in order to have entirely white screen and not bi color (yes it’s a dirty mean to succeed), but I have’t tried it yet.

Which solutions would you consider to solve this problem ?

5

It isn’t the goal of GD, but I will help because it’s really easy…
In the current GD master branch on GitHub, the loadingScreenRenderer is an object in a separate file, you can found it here:
https://github.com/4ian/GD/blob/master/GDJS/Runtime/pixi-renderers/loadingscreen-pixi-renderer.js

Since PIXI only renders objects attached to the main renderer or any renderabla object added to it in any level, commenting the line where the text object is added to the renderer should stop it to render:

line 6:    // this._loadingScreen.addChild(this._text);

You could add an extra line to make the text object invisible instead:

line 6: this._loadingScreen.addChild(this._text); line 7: this._text.visible = false;

2 Likes