How to remove blur?

[BNF]

Hi, I've made simple plugin, that's allow user to control separately, both window size and in-game resolution (just like many MV plugins but now in MZ) everything works fine, but after upscaling game resolution to fill the window, the game looks kinda blurry sadly.

I managed to fix it using a Visustella Core plugin for MZ, where I choose Pixel Image Rendering. But I don't want to use this plugin just to remove blur. Sadly, this plugin is encrypted so I can't check how they remove blur...

So... if someone please be so kind and explain me how to remove this blur? :/

 

[Soulrender]

You can try other thing, open file gamefont.css in font directory of your project and paste it:

canvas{
  image-rendering: pixelated;
}

I don't know differences between plugin and this method to remove blur, but I'm very happy with the result just editing css file.

 

[ulosbal]

Very cool! Thank you! do you know how to remove blur when entering menus?
I know in mv it was necessary to enter and edit the file "rpg_managers" in the js folder at the line: SceneManager.snapForBackground (I believe)

but that has changed in mz

 

[caethyril]

I think this'll remove the blur filter from MZ's menu backgrounds:

(alias => {
    Scene_MenuBase.prototype.createBackground = function() {
        alias.apply(this, arguments);
        this._backgroundSprite.filters.shift();     // remove first filter (blur)
    };
})(Scene_MenuBase.prototype.createBackground);

You can probably apply Soulrender's CSS edit via plugin, too, if you like, e.g.

document.styleSheets[0].insertRule('canvas{ image-rendering: pixelated; }');

 

[Aesica]

You can try other thing, open file gamefont.css in font directory of your project and paste it:

canvas{
  image-rendering: pixelated;
}

I don't know differences between plugin and this method to remove blur, but I'm very happy with the result just editing css file.

In most cases, that's probably fine, but if you host it on a page that has other elements present, you run the risk of that rule affecting any other canvas elements that might exist on the page as well. While I haven't tested it personally, you should be able to target the game canvas specifically like this:

#gameCanvas {
image-rendering: pixelated;
}

 

[ulosbal]

caethyril, I failed to get your code to work,

I placed this line 2217, following the SceneManager (rmmz_manager.js file):

(alias => {
Scene_MenuBase.prototype.createBackground = function () {
alias.apply (this, arguments);
this._backgroundSprite.filters.shift ();
};
}) (Scene_MenuBase.prototype.createBackground);

it says: Scene_MenuBase is not defined

 

[Soulrender]

@ulosbal - you must save this code as plugin and place it in plugin manager.

 

[ulosbal]

@caethyril @Aesica ​

@Soulrender Thank you!