captainHook Posted November 13, 2018 Share Posted November 13, 2018 Does anyone know how to use the CanvasRenderer class ( https://photonstorm.github.io/phaser3-docs/Phaser.Renderer.Canvas.CanvasRenderer.html )? I would like to do things like easily resize canvas, modify canvas background-color, etc - without having to use directly html5 canvas API. Is it possible? Link to comment Share on other sites More sharing options...
rich Posted November 13, 2018 Share Posted November 13, 2018 The Canvas Renderer is automatically used if you create a game with the renderer config set to CANVAS, or the browser doesn't support WebGL. The sort of things you describe doesn't sound like what the Canvas Renderer is for. Link to comment Share on other sites More sharing options...
captainHook Posted November 13, 2018 Author Share Posted November 13, 2018 Thanks for quick response. Is there an other way then to access canvas context in phaser3? For example I used Game.resize() method to resize the canvas, but dont find how to change other parameters (like background color I mentionned above). Where to search in Phaser API / any examples ? Link to comment Share on other sites More sharing options...
samme Posted November 14, 2018 Share Posted November 14, 2018 http://labs.phaser.io/edit.html?src=src/camera\background color.js Link to comment Share on other sites More sharing options...
captainHook Posted November 14, 2018 Author Share Posted November 14, 2018 That is what I was looking for. Thanks. myScene.cameras.main.setBackgroundColor('#000000') https://rexrainbow.github.io/phaser3-rex-notes/docs/site/camera/ LiadIdan and 8Observer8 1 1 Link to comment Share on other sites More sharing options...
rodrigezer Posted February 16, 2019 Share Posted February 16, 2019 I did it with this line this.cameras.main.backgroundColor.setTo(255,255,255); https://photonstorm.github.io/phaser3-docs/Phaser.Display.Color.html 8Observer8 1 Link to comment Share on other sites More sharing options...
8Observer8 Posted December 18, 2019 Share Posted December 18, 2019 And we can use this line: this.cameras.main.backgroundColor = Phaser.Display.Color.HexStringToColor("#3498db"); Link to comment Share on other sites More sharing options...
Eivan92 Posted July 13, 2021 Share Posted July 13, 2021 (edited) This is link of git for change background: https://github.com/photonstorm/phaser-examples/blob/master/examples/display/game background color. Example: function create() { // You can set the background color of your game in the following ways: game.stage.backgroundColor = "#4488AA"; // game.stage.backgroundColor = 0x4488aa; // game.stage.backgroundColor = 'rgb(68, 136, 170)'; // game.stage.backgroundColor = 'rgba(68, 136, 170, 0.5)'; game.add.image(game.world.centerX, game.world.centerY, 'hotdog').anchor.set(0.5); // Click for a new background color game.input.onDown.add(changeColor, this); } Edited July 13, 2021 by Eivan92 No show coding Link to comment Share on other sites More sharing options...
Recommended Posts