Warning: The magic method EDD_Blocks::__wakeup() must have public visibility in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php on line 101
Warning: The magic method EDD_Blocks::__wakeup() must have public visibility in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks/edd-blocks.php on line 101
Warning: The magic method GAINWP_Manager::__wakeup() must have public visibility in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/gainwp.php on line 78
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 555
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 585
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 617
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 651
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 686
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 745
Deprecated: Optional parameter $filter declared before required parameter $metric is implicitly treated as a required parameter in /home/wcc1969/public_html/phasergames.com/wp-content/plugins/ga-in/tools/gapi.php on line 785
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
Warning: Cannot modify header information - headers already sent by (output started at /home/wcc1969/public_html/phasergames.com/wp-content/plugins/edd-blocks-master/edd-blocks.php:101) in /home/wcc1969/public_html/phasergames.com/wp-includes/rest-api/class-wp-rest-server.php on line 1831
{"id":5714,"date":"2018-05-07T13:58:25","date_gmt":"2018-05-07T13:58:25","guid":{"rendered":"https:\/\/phasergames.com\/?p=5714"},"modified":"2018-05-07T14:01:29","modified_gmt":"2018-05-07T14:01:29","slug":"scaling-in-phaser-3","status":"publish","type":"post","link":"https:\/\/phasergames.com\/scaling-in-phaser-3\/","title":{"rendered":"Scaling in Phaser 3"},"content":{"rendered":"
How do I scale sprites in Phaser 3?<\/h2>\n
Often times when making a game, I will add a sprite to the stage to find out it looks bigger in the game than it did in the editing program. Often times this produces comical results. Think of a coin being twice as big as the player! If it is really much too big then I will re-edit the image and scale it down. Sometimes though scaling makes sense. I use scaling in all my game to make things fit nicely on the screen.<\/p>\n
Using Maths for scale<\/h3>\n
Personally, I like to scale objects based on the game’s dimensions.\u00a0For example, I might make the width of the player 10 percent of the game’s width and then scale it proportionally. This isn’t just for Phaser, this is maths. It will work in any game as long as you know the size of the stage or viewport in case of scrolling games and can set the height and width of objects. If you are able to set a scale it is even easier. Phaser has a lot of built-in things that make it easy for us.<\/p>\n
Getting the size of the game<\/h3>\n
We can get the size of the game by accessing the config object in the game.<\/p>\n
\n
var gameWidth=game.config.width;<\/li>\n
var gameHeight=game.config.height;<\/li>\n<\/ul>\n
Setting a scale<\/h3>\n
There are several ways to set a scale on a sprite.<\/p>\n
\n
sprite.setScale(.5); \nsets the scale of the sprite to 50% of the original size<\/li>\n
sprite.scaleX=.1; \nsets the width of the sprite to 10% of the original<\/li>\n
sprite.displayWidth=game.config.width*.1; sprite.scaleY=sprite.scaleX \nsets the displayWidth to a percentage of the game’s width, and then scales the object\u00a0proportionally<\/li>\n<\/ol>\n
What is the difference between displayWidth and width?<\/h3>\n
A sprite has width, height, displayHeight and displayWidth properties. So what’s up with that and which do you use?<\/p>\n
The width and height properties refer to the size of the sprite’s image as it was loaded into the game. The displayWidth and displayHeight are the width and height of the sprite itself. If you want to change the sprite’s dimensions use displayWidth, Thanks to browserGamesHubs.com<\/a> for providing information on this subject.<\/p>\n
![\"\"](\"https:\/\/media.publit.io\/file\/w_223,h_300,c_fit,q_80\/websiteImages\/phasergames\/faces.jpg\")
<\/p>\n\t