Changing resolution in game (Solved)

Discussion in 'Javascript/Plugin Support' started by orcomarcio, Aug 14, 2019 at 7:02 AM.

Thread Status:
Not open for further replies.
  1. orcomarcio

    orcomarcio Veteran Veteran

    Messages:
    97
    Likes Received:
    19
    First Language:
    Italian
    Hey there,
    I need to make the game change resolution during fights (to be precise I need 960x540 during exploration and 1920x1080 in combat).
    Initially i solved the problem re-initializing the Graphics class each time i needed to change resolution, but apparently that creates a lot of garbage and after a few iterations it starts to slow down, break and the console gives this message "WARNING: Too many active WebGL contexts. Oldest context will be lost".
    I tried another way by basically calling this function
    Code:
    SceneManager.changeGraphicResolution = function(width, height) {
        this._screenWidth  = width;
        this._screenHeight = height;
        Graphics._width    = width;
        Graphics._height   = height;
        var resizeWidth = this._screenWidth - window.innerWidth;
        var resizeHeight = this._screenHeight - window.innerHeight;
        window.resizeBy(resizeWidth, resizeHeight);
    };
    The problem with this method is that if res scales up it increases the window size too and if done in full screen it scales the contents and i see only the top left corner. I tried some workarounds but are very scuffed, like switching full screen mode 2 times in the span of 2 cycles, which kinda solves the problem. Anyway this whole solution can work but I feel like there must be an easier and cleaner way.

    TL;DR I need to change resolution on command in-game, keeping the same window size if windowed mode and not giving problems if done while in full screen.

    Does anyone know how to either clear the garbage before re-initializing graphics or change resolution in real time?
     
    #1
  2. orcomarcio

    orcomarcio Veteran Veteran

    Messages:
    97
    Likes Received:
    19
    First Language:
    Italian
    I solved it, when the scene changes and i need to change resolution i call this fucntion

    Code:
    SceneManager.changeGraphicResolution = function(width, height) {
        this._screenWidth  = width;
        this._screenHeight = height;
        Graphics._width    = width;
        Graphics._height   = height;
    };
    
    This makes the games think the resolution changed and it's needed for stuff like camera position, windows width and such, but it doesn't really change the resolution. For that you need to change Graphics.width to a random value and change it back to the desired resolution the next cycle. this refreshes it and makes it work. It's not the most elegant solution (and gives a frame or two of glitched images while scaling, it is not that evident unless you pay close attention) but it works. Here is how I implemented it inside the SceneManager.changeScene function.

    Code:
    SceneManager.changeScene = function() {
        //added lines
        if (this._rescale > 1) { //scale to 1920
            Graphics.width    = 960; //this could probably be any value
            this._rescale--;
        } else if (this._rescale > 0) {
            Graphics.width    = 1920;
            this._rescale--;
        }
        if (this._rescale < -1) { //scale to 920
            Graphics.width    = 1920; //this could probably be any value
            this._rescale++;
        } else if (this._rescale < 0) {
            Graphics.width    = 960;
            this._rescale++;
        }
        //added lines end
        if (this.isSceneChanging() && !this.isCurrentSceneBusy()) {
            if (this._scene) {
                this._scene.terminate();
                this._previousClass = this._scene.constructor;
            }
            this._scene = this._nextScene;
            if (this._scene) {
                //added lines
                if (this._scene instanceof Scene_Battle) {
                    SceneManager.changeGraphicResolution(1920, 1080);
                    this._rescale = 2;
                } else {
                    SceneManager.changeGraphicResolution(960, 540);
                    this._rescale = -2;
                }
                //added lines end
                this._scene.create();
                this._nextScene = null;
                this._sceneStarted = false;
                this.onSceneCreate();
            }
            if (this._exiting) {
                this.terminate();
            }
        }
    };
     
    Last edited: Aug 14, 2019 at 7:27 PM
    #2
  3. slimmmeiske2

    slimmmeiske2 Little Red Riding Hood Moderator

    Messages:
    5,312
    Likes Received:
    3,957
    Location:
    Belgium
    First Language:
    Dutch
    Primarily Uses:
    RMXP

    This thread is being closed, due to being solved. If for some reason you would like this thread re-opened, please report this post and leave a message why. Thank you.

     
    #3
Thread Status:
Not open for further replies.

Share This Page