Search the Community

Showing results for tags 'scale'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 183 results

  1. jopcode

    problem with setScale on layers

    Hello, I'm trying to scale the layers of my map, but when I try it shows part of the following tiles, some idea of how to solve this ?, the map is created in tiled, the spritesheet is 16 x 16: CODE create function: map = this.make.tilemap({'key':'01'}); const TilesPacked = map.addTilesetImage('tiles_packed', 'tiles_packed'); const SnowExpansion = map.addTilesetImage('snow-expansion', 'snow-expansion'); groundLayer = map.createDynamicLayer('Wall', [TilesPacked,SnowExpansion], 0, 0).setScale(2); const Ground = map.createStaticLayer('Ground', [TilesPacked,SnowExpansion], 0, 0).setScale(2); const OverGround = map.createDynamicLayer('OverGround', [TilesPacked,SnowExpansion], 0, 0).setScale(2); const Npc = map.createDynamicLayer('NPC', [TilesPacked,SnowExpansion], 0, 0).setScale(2); player = this.physics.add.sprite(16*3, 16*3, 'characters', 1).setBounce(0.2).setScale(2); preload function: this.load.image('tiles_packed', 'sprites/tiles_packed.png'); this.load.spritesheet('characters', 'sprites/characters.png', {frameWidth:16, framaeHeight:16}); this.load.image('snow-expansion', 'sprites/snow-expansion.png'); this.load.tilemapTiledJSON('01', 'sprites/Maps/02.json');
  2. makalu

    How to tween scale in Phaser 3

    In Phaser 2 we could tween scale like in the topic linked below. How is this done in Phaser 3? It looks like the sprite Scale property has changed to scaleX and scaleY, which I thought maybe I could tween like this, but this didn't seem to work: this.scene.tweens.add({ targets : [ this.scaleX, this.scaleY ], x: 10, y: 10, ease : 'Linear', duration : duration, yoyo : false, repeat : 0, callbackScope : this });
  3. Hello all. I have a problem with Chrome on Android. When I switch to a fullscreen I can get different results: First one (all is ok): The Second one (a white band at the bottom): The third one when I leave fullscreen mode (white band at the top): I use the following code: this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; this.scale.fullScreenScaleMode = Phaser.ScaleManager.SHOW_ALL; this.scale.pageAlignHorizontally = true; this.scale.pageAlignVertically = true; this.scale.forceOrientation(true, false); this.scale.enterIncorrectOrientation.add(this.enterIncorrectOrientation, this); this.scale.leaveIncorrectOrientation.add(this.leaveIncorrectOrientation, this); I get such results only in Chrome on Android. Does anybody know why this occurs and how to solve the problem? Any tips would be appreciated!
  4. dev1-cpc

    Zoom by swipe

    Hello. How to make game zoom like a PIXI Viewport?
  5. matterjs always set 1 for body scale parametr after setScale. And it's ploblem for reScale game object. Any solve for it?
  6. Hi guys, How do I make it that the black square moves with the red square but NOT scale? Example: jsfiddle When you click on the small blue square the big white square gets smaller. The big red square scales with the white square. This is what I want but... the little black square should not scale but change position, is that possible? The black square should be in the red square BUT with the same height and width.
  7. Hello, community! I've just started using Phaser 3, and it's a pleasant experience. Special thanks to team for TypeScript definitions. I'm currently trying to implement scale logic for my game. I've read in this blog post that developers considered to change `ScaleManager` in Phaser 3, but I didn't find one in sources. I've also tried to take a look at how resize is handler in Mario platformer from pinned topic. Author used this: scaleMode: 0, //Phaser.ScaleManager.EXACT_FIT, ... but I didn't find `scaleMode` in Config.js object, and also didn't find any reference in Game.js object to this config property. It seems this was a way to scale game in Phaser 2, but not anymore. My current idea is to put all game objects in a 'parent' frame (not sure which object should I used for this btw..), and scale this 'frame' in each Scene on 'resize' event. This feels awkwardly wrong to me, and I'm looking for better approach. Would be very grateful for a hint where to look, or an advise on how to properly implement scaling. Thank you!
  8. NoobTW

    Scaling canvas makes text ugly

    Hi, I'm totally new in HTML 5 Games. If I resize my canvas (by calling resize function in preload), those text will become blurry, ugly. Any idea to handle this? Here's the example: https://codepen.io/anon/pen/wxdXKp .
  9. Doug

    Hi Rich.  @rgk mentioned that you might be able to please add a "patron" badge to my forum profile?  Thanks very much!

  10. sta-ger

    Scaling down big images quality

    Hello! I have a trouble when scaling down big assets. I just have a stage contains some sprite and i'm doing: stage.scale.x = stage.scale.y = 0.2; https://jsfiddle.net/n67xwb5w/ As a result I have an ugly ragged image. I found a solutions for a simple canvas drawing without pixi http://jsfiddle.net/qwDDP/ from here http://stackoverflow.com/questions/18761404/how-to-scale-images-on-a-html5-canvas-with-better-interpolation Can I achive the same smooth effect after rescaling in PIXI?
  11. I'm having a hard time trying to do something that should be quite straightforward, so I'm not sure what I'm missing. How do we scale an image (to use as a game background) to fit the window? This is my approach, which doesn't work: preload() { this.load.image('bg', 'space3.png'); } create() { const bg = this.add.image(0, 0, 'bg'); bg.width = window.innerWidth; bg.height = window.innerHeight - this.parent.canvasOffset; // I would like to use this.game.width and this.game.height but those values don't exist } If I use bg.scaleX and bg.scaleY and set the values to 2.0, it does work, but what I want is to scale it to fit the window/viewport.
  12. Hi everyone, I'm trying to figure out how to 'reset/readjust' a sprites collider after adjusting the sprites scale. The initial collider setup ( size/offset) is working perfectly at scale 1, with the following : sprite.setSize(44,64,true); sprite.body.offset.y = 44; scaling works great for both sprite and collider with : sprite.setScale(2); the issue is when i set the scale ( to 2 in this example ), the collider now has an offset. is there a built in way to 'reset' this collider so it aligns with the sprite? thanks for your help. var config = { parent: 'container', type: Phaser.WEBGL, width: 300, height: 300, parent: 'phaser-example', physics: { default: 'arcade', arcade: { debug: true } }, scene: { preload: preload, create: create } }; let game = new Phaser.Game(config); let sprite; function preload () { this.load.image('00', '00.png'); } function create () { sprite = this.physics.add.image(400, 300, '00'); sprite.setSize(44,64,true); sprite.body.offset.y = 44; sprite.setScale(2); sprite.setVelocity(100, 200).setBounce(1, 1).setCollideWorldBounds(true).setGravityY(200); }
  13. Hello everybody, Long time I haven't post anything here as my life with babylonjs is going smooth and well. But unfortunetly I am now stuck! I am looking for a way to adapt an advanced texture size depending on the mesh size so that the text on it will keep the same font and shape. I have made a playground to make my request more clear : https://playground.babylonjs.com/#RICIF8 Thanks a lot! Pichou
  14. I have sprites which are all anchored at 0.5 for x and y, and they are often "flipped" via (e.g.) someSprite.scale.x *= -1. Because their anchors are centered, they don't move immediately because of this. However, changing to a negative scale mucks with their size and coordinates, because now a 20px-wide sprite will report a width of -20px, and it also interprets changes to its position inverse to what they were before (sprite.x++ will cause it to move up on the screen). This makes sense and everything, but the sprites' movement and activity is not always related to their scale. I know there must be a simple way to make a mirrored "copy" of a texture which can be swapped out on a single sprite without having to change its scale from positive to negative constantly.
  15. Shex

    Scale a tilesprite

    Hi In Phaser2, it was possible to scale a TileSprite so the sprite inside was scaled while being tiled. It doesn't seem to be there anymore in Phase3. Is there a way to achieve this? Thanks!
  16. mattbrand

    Scaling and input fields

    In my game I have a form that I built with Orange Games' input plugin (https://github.com/orange-games/phaser-input). The input form working great on computer, but on mobile when you tap into an input field, it zooms in, and becomes impossible to see what you're doing, or go to the next field. I tried using scale prevention with meta tags: <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui"> and: <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=2, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> but my game uses "game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL" to look good on all resolutions. So when I put in the meta tags, it doesn't scale initially, and it is too big on mobile. Is there any way to use a meta tag that allows for initial scaling on mobile, but then freezes the scale in order to prevent zooming on input fields?
  17. hi, after get the examples from : https://phaser.io/examples/v2/tilemaps/tile-properties i'm searching to modify the object of the tiles, but i can't modify the alpha and the scale (=> see //HERE THE PROBLEM). how do you do to reach that ? var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update ,render: render}); function preload() { // tiles are 16x16 each game.load.image('tiles', 'tiles.png'); } var cursors; var currentDataString; function create() { // Create some map data dynamically // Map size is 128x128 tiles var data = ''; for (var y = 0; y < 128; y++) { for (var x = 0; x < 128; x++) { data += game.rnd.between(0, 20).toString(); if (x < 127) { data += ','; } } if (y < 127) { data += "\n"; } } // console.log(data); // Add data to the cache game.cache.addTilemap('dynamicMap', null, data, Phaser.Tilemap.CSV); // Create our map (the 16x16 is the tile size) map = game.add.tilemap('dynamicMap', 16, 16); // 'tiles' = cache image key, 16x16 = tile size map.addTilesetImage('tiles', 'tiles', 16, 16); // 0 is important layer = map.createLayer(0); // Scroll it layer.resizeWorld(); game.physics.startSystem(Phaser.Physics.ARCADE); cursors = game.input.keyboard.createCursorKeys(); // Our painting marker marker = game.add.graphics(); marker.lineStyle(2, 0xffffff, 1); marker.drawRect(0, 0, 32, 32); game.input.addMoveCallback(updateMarker, this); game.input.onDown.add(getTileProperties, this); cursors = game.input.keyboard.createCursorKeys(); } function getTileProperties() { var x = layer.getTileX(game.input.activePointer.worldX); var y = layer.getTileY(game.input.activePointer.worldY); var tile = map.getTile(x, y, layer); console.log(tile) //////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////// //HERE THE PROBLEM tile.scale.x=.1 tile.alpha=.1 // Note: JSON.stringify will convert the object tile properties to a string currentDataString = JSON.stringify( tile.properties ); tile.properties.wibble = true; } function updateMarker() { marker.x = layer.getTileX(game.input.activePointer.worldX) * 32; marker.y = layer.getTileY(game.input.activePointer.worldY) * 32; } function update() { if (cursors.left.isDown) { game.camera.x--; } else if (cursors.right.isDown) { game.camera.x++; } if (cursors.up.isDown) { game.camera.y--; } else if (cursors.down.isDown) { game.camera.y++; } } function render() { if(currentDataString){ game.debug.text('Tile properties: ' + currentDataString, 16, 550); } else { game.debug.text("Click on a tile to reveal the properties of the tile", 16, 550); } }
  18. I started working on game, which I would like to publish on Android and ios market. How I can set resolution or scale game to most popular devices? I found on google that the most popular resolution is (480, 320) var game = new Phaser.Game(480, 320, Phaser.CANVAS); I test my game (sample asstes) on Asus Zenphone GO (resolution: 720 x 1280 pixels) and this is how it looks (white space on top and sides). How developers scale their games to fit all phones?
  19. Noob here using Phaser. But here's my issue: I'm struggling to get to a perfect scale on the game I'm building. The best option for me so far is Phaser.ScaleManager.RESIZE; But this method doesn't have a limit to the canvas size. If an user has a huge screen, say 30 inches, he'd have a lot of advantage over an user with a medium size screen, say 17 inches. The 30 inches user would have much more view of the world. I've tried to set the canvas to a fixed size, like 1280x720, then dynamically resize the canvas style. And using Phaser.ScaleManager.SHOW_ALL; But it doesn't do the trick because it shows the black borders and I can't get rid of it. To make it clear what I want to achieve, I'm building an online multiplayer game (.io). If you notice the most famous .io games like agar.io, diep.io and slither.io, the game scale is perfect for any screen size. If the screen is too big, the game doesn't show more screen. It just adjusts for a more zoomed game. Here's a gif of what I need and how my game is now: agar.io: https://gyazo.com/94a41e06816b8dc9a1fd4608c0cfa525 Notice that in agario, the screen only goes so far before the game starts to scale. My game: https://gyazo.com/4269ecfb1253b9ddbcd6e917ad1a8602 Notice how much of the world I can see after scaling my game. Meaning that there is no limit for the canvas. Please let me know if you need more information in order to help me out here! Thanks in advance!
  20. I'm trying to make my mesh smaller during its linear velocity movement. But unfortunately, as soon as I set the scaling, it stops the movement. How can I scale down my mesh in size without interrupting the movement? Is there an elegant way without having to calculate positions myself? See my example, where the movement stops after 1sec when trying to scale: http://www.babylonjs-playground.com/#5WEAFN
  21. Hi, I'm currently making a litlle top-down shooter game with Phaser. I'm using the method bellow to aim towards the mouse's position. sprite.rotation = game.physics.arcade.angleToPointer(sprite); This work very well, but I would like to allow the player to zoom in and out. I was following this idea : http://jsfiddle.net/NMNJ7/25/ which use the game.world.scale.set() method; But when I change the world's scaling, the angleToPointer() method is completly lost and it's impossible to aim. You can try this little exemple I've made to understand what goes wrong : https://jsfiddle.net/TomLeGrand/uh7d10eu/127/ Do someone has an idea to fix this? Thanks for you futur help
  22. Hi. I'm new to phaser and to this forum. I have a problem that I would like to ask for some help with. I'm trying to import a level from a JSON file exported from a 3rd party level editor that is not meant to be used with Phaser or any other 3rd party engine. It is just me trying to use the JSON coming from the editor to load the level in Phaser and I have some problem with rotation and scale of the sprites. The level editor rotate the sprites around a center point and scale the sprites from the origin point. In Phaser, I set the position of the anchor point to match the position of the origin point and set the position of the pivot point to match the position of the center point for each sprite and it works for getting the position and the rotation of the sprites but when I scale a sprite in the editor, it does not appear right in Phaser. This is how it looks like in the editor: And this is how it looks like in Phaser after import: Notice the distance between the two sprites. It does not match and I think it is because in the editor the sprite is scaled from the top left corner of the sprite (origin/anchor point) while in phaser it is scaled from the center of the sprite (pivot point). At least If I don't change the position of the pivot point, the scale and position works but then rotation is off because in the editor the sprite is rotated around the center point which is in the middle by default. In any case I can't find a solution to this. I can't get the scale match without messing up the rotation or the rotation without messing up the scale because of the two points. When I check the values, everything seems to match. Position, rotation, scale but it still does not look the same in Phaser. I hope someone did have the same problem with rotating and scaling sprites in Phaser and already figured a solution. What I would like to know specifically, is there any way to rotate a sprite around a middle point without changing the position of the anchor and pivot point or is there any way to scale a sprite from the anchor point instead of the pivot point? Because the problem seems to be in Phaser the sprites are scaled and rotated around the pivot point but in this case I need to scale it and rotate it in two separated points to get the same result as in the level editor. I would appreciate any help. Thank you.
  23. Hi All. Maybe it seems strangely but how I can before use scale9 for sprite2D, scale this sprite without scale9 and after that applying to this sprite scale9? Why I need this? For optimization! I have canvas size 1280x720, then I am make the size for this canvas 640x360 and scale = 2 and for all sprite2D objects on this canvas I set scale = 0.5 and in results we have few resolution for canvas and good quality for all sprite2D objects. But some sprites uses scale9 and if I set scale 0.5 for this sprites, then this sprites at once uses scale9 but I need use just scale 0.5 and after that apply scale9. This is what I get if scale of canvas = 1 and the button scaleX = 1.5, scaleY = 1 (uses scale9) But what I get if scale canvas = 2 and button scaleX = 0.75, scaleY = 0.5 (uses scale9) Need to apply scale 0.5 as original scale and then apply for a new size of sprite the scale9 grid. How I can to do this? Thanks!
  24. satguru

    Matrix decompose scaling bug

    @Deltakosh The matrix decompose returns wrong scale value when scale is negative see https://www.babylonjs-playground.com/#ZXZI83 Here scling.z is being set to -2, decompose returns +2 I think the bug got introduced by this change https://github.com/BabylonJS/Babylon.js/commit/8d1b546a20b3398556f0fe98f6d57329bce92687#diff-ccd6f7b0cc7c001d6fdf41cff591c6a6 Fixed matrix decomposition with negative scaling
  25. Hello, Is there a way to get the size of an object after the window has been resized? (Whole scene gets scaled down/up). planet2.getBoundingInfo().boundingBox.vectorsWorld; but it only displays 1.25 no matter how much I resize my browser window