Babsobar

Members
  • Content Count

    48
  • Joined

  • Last visited

About Babsobar

  • Rank
    Advanced Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Babsobar

    How to gets a tile from the Tilemap layer

    What you're looking for is here getTileAtWorldXY
  2. Babsobar

    Zooming out on tilemap layer?

    Just wanted to update that this problem was fixed by a recent update of Phaser.
  3. Babsobar

    Zooming out on tilemap layer?

    I'm still looking for an answer to this problem as well...
  4. Hello rich, Happy that I caught an actual live bug, that would be my first! So how would I go about setting the area visible in the camera? I've been trying to figure how to for days, zooming out using the camera doesnt show more of the dynamicTilemapLayer. Thanks
  5. Hello, I'm trying to use setDisplaySize method on a dynamicTilemap layer but I'm getting a 'this.frame is undefined' when trying to set it. It's supposed to take a width and a height as parameters as shown here. I've tried setting it to a frame but it returns the same error. . I believe this may be linked to the problem I've encoutered and posted about in this thread but I'm not sure. Any help much appreciated
  6. Babsobar

    Zooming out on tilemap layer?

    I've been trying to figure this out for a while now and I feel like there's a problem with tilemap Layers and zooming. Could you try adding zoomIn: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A), zoomOut: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.E), to your control config and check if that displays culled tiles? I've been pulling my hair out over this. Tilemap layers have a .setDisplayheight and .setDisplayWidth but I get a phaser error telling me no frame is specifed when I try to run them. I feel like I shouldnt have to resize the height and width of the camera every time I zoom because that would seem very clunky... I'm looking for the same behavior as in this example but with dynamic tilemaps, right now I'm always getting the tiles culled by some sort of camera frame. Thanks
  7. Hello, I'm trying to group together UI elements so that I don't have to assign properties like being locked on screen to each and every one of them every time. In phaser 2 this was done by manipulating groups. While looking through phaser 3's doc I noticed that groups don't exist as they used to, and I can't seem to find how to do groups for UI elements now. Is there a particular way of doing UI elements in phaser 3 or has this not been implemented yet? Thanks
  8. Babsobar

    Getting Started with Phaser 3

    For future reference, the docs are located at this address, and this is the git cloning link: https://github.com/photonstorm/phaser3-docs.git
  9. Babsobar

    Getting Started with Phaser 3

    Hello @fariazz; Thanks for the work you do , I had bought the entirety of your courses on phaser 2 a while ago, I got into them but work got into the way before I managed to finish them and learn everything. Now i'm switching to Phaser 3 and refactoring my project, which courses do you think will be rendered obsolete by Phaser 3 ? Thanks for the work you do.
  10. Works perfectly, thank you very much. This is new in phaser 3? I think I remember that in 2 you just called them the classic way
  11. Hello, I'm trying to call a function in another file called createButtons.js; which contains this: function createButtons (){ //Create Back to menu Button var menuButton = this.add.sprite(width-width+120,height-height+60,'menuButtons','editorb0.png'); menuButton.setInteractive(); menuButton.on('pointerdown', function(pointer){ this.scene.start('MainMenu') },this) menuButton.setScrollFactor(0); } The function is loaded in my index.html; then I call the function in my main file in the create section simply with "createButtons();". I get the TypeError: "this.add is undefined" in the console. Any help is greatly appreciated, I'm sort of a noob in all this but i'm learning
  12. Babsobar

    Zooming out on tilemap layer?

    I've switched to canvas by switching the config of my Phaser.game but the results are the same. As for the dynamic tilemap, it already is one. The water in the screenshot is created by the game by filling the whole layer with 0, and the land is created by the player on click. Here is my code should it interest you, there are some things commented out because this is just out of the oven so excuse the messiness. Thanks for your time! var controls; var marker; var map; var mapWidth; var mapHeight; var cameras; var BKey; var width var height var selectedTile = 1 class Editor extends Phaser.Scene{ constructor() { super({key:'Editor'}); } //PRELOAD <======================================================================================================================= preload(){ var spriteMap = "main" var textureURL = 'assets/main.png' var atlasURL = 'assets/main.json' var tileSetImage = 'terrain2' this.load.atlas(spriteMap, textureURL, atlasURL); this.load.atlas('buttons', 'assets/buttons.png', 'assets/buttons.json'); this.load.atlas('menuButtons', 'assets/menuButtons.png', 'assets/menuButtons.json'); //loads tileset reference file this.load.tilemapTiledJSON('terrain2','assets/terrain2.json', null) //Load tileset image this.load.image('terrain2', 'assets/terrain2.png'); } // CREATE<======================================================================================================================= create(){ //setting Map width and height in number of tiles mapWidth = 150 mapHeight = 150 //Layer creation map = this.make.tilemap({ width: mapWidth, height: mapHeight, tileWidth: 32, tileHeight: 32, }); //Adding Tileset var tiles = map.addTilesetImage('terrain2', null, 32, 64); //Creating blank tilemap layer var layer = map.createBlankDynamicLayer('layer1', tiles); //Randomly creates Water layer.randomize(0, 0, map.width, map.height, [0 /*add tile index here to add to rng distribution*/]); // Create Paintbrush marker marker = this.add.graphics(); //Black and 2 px wide marker.lineStyle(2, 0x000000, 1); marker.strokeRect(0,-32, 6 * map.tileWidth, 6 * map.tileHeight); //Set camera bounds to mapsize this.cameras.main.setBounds(0, 0, map.widthInPixels, map.heightInPixels); //Create cursors to be able to move camera around and their configuration var cursors = this.input.keyboard.createCursorKeys(); var controlConfig = { camera: this.cameras.main, left: cursors.left, right: cursors.right, up: cursors.up, down: cursors.down, speed: 0.5, disableCull: true, zoomIn: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A), zoomOut: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.E), }; controls = new Phaser.Cameras.Controls.Fixed(controlConfig); //Some basic text to show we're awesome and show version var text = this.make.text({ x: width-width+80, y: height-height+20, text: 'Biffin Editor refactor 0.01', origin: 0.5, wordWrap: { width: 300 }, style: { font: 'bold 12px Arial', fill: 'white', } }) // Sets anchored to screen text.setScrollFactor(0); //Create Back to menu Button // createButtons(); //Create Key for testing BKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.B); }//End of Create //UPDATE <======================================================================================================================= update (time, delta){ width = window.innerWidth; height = window.innerHeigth; controls.update(delta); var worldPoint = this.input.activePointer.positionToCamera(this.cameras.main); // Rounds down to nearest tile var pointerTileX = map.worldToTileX(worldPoint.x); var pointerTileY = map.worldToTileY(worldPoint.y); // Snap to tile coordinates, but in world space marker.x = map.tileToWorldX(pointerTileX); marker.y = map.tileToWorldY(pointerTileY); if (this.input.manager.activePointer.isDown) { // Fill the tiles within an area with grass (tile id = 1) map.fill(selectedTile, marker.x/32, marker.y/32, 6, 6); } /* if (this.input.manager.KeyCodes) if (BKey.isDown){ this.cameras.main.width += 200 this.cameras.main.x -=100 console.log('resizing') }*/ } }
  13. Babsobar

    Zooming out on tilemap layer?

    Hello, I've been fiddling with the new camera and tilemaps and I've encountered a problem. I have created a tile layer much like in this example for a level editor I'm working on. var controlConfig = { camera: this.cameras.main, left: cursors.left, right: cursors.right, up: cursors.up, down: cursors.down, speed: 0.5, disableCull: true, zoomIn: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A), zoomOut: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.E), }; controls = new Phaser.Cameras.Controls.Fixed(controlConfig); The problem with this way to handle the zoom is that it produces this kind of effect, The camera zooms out of the whole scene, including things that are fixed to it but leaves the rest of the tiles unrendered and culled. As you can see here, zooming should show more of the green tiles; but zooming out only made the tilemap layer and the contents of the scene smaller, when I'd like it to render more of the tilemap's tiles. I've tried updating with .setBounds, .setSize and .setViewport with a key call after zooming out but I may have missed something obvious... Any help greatly appreciated. EDIT: To clarify further; the camera has no trouble moving around inside the tilemap layer using the arrow keys but it shows black bars around on zooming out.
  14. Babsobar

    Getting Started with Phaser 3

    Hey, Both tutorials are very useful, they got me introduced to how scenes work compared to stages. Anyone know where I can get a look at the documentation for Phaser 3? Thanks.
  15. Hey @samme; Just a question: here you're using Layer.resize alone; but have you ever used it in conjunction with the code you're using here? : I tried it and having the scale manager set as RESIZE makes the zoom code scale the whole of the game window inside the window.