Search the Community

Showing results for tags 'phaser 3'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • 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


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 44 results

  1. Hello, I'm new to Phaser 3 and I'm trying to make a vertical scrolling shooter as I learn. So far I've been able to make the player shoots bullets by translating this tutorial from Phaser 2 into Phaser 3: But I'm stumped when I try to implement the weapon changing system into Phaser 3. I'm not very experienced in javascript and how it handles classes/objects and I'm mainly a Unity developer. And as far as I know, Phaser 3 docs are still incomplete so I can't actually look through it to find equivalent or similar methods from Phaser 2. For now, I'd like to create a weapon type that slows enemy movement speed. Pointers on how to approach this in Phaser 3 would be very helpful. Thanks.
  2. I was trying with Phaser where i saw that this gets some kind of blurred when moving (ingame) Testet it in Canvas & WebGL both had the same result then i tried it to setting `pixelArt` to false in the gameconfig and when i tried it then, it worked smooth, but it seemd that it had activated some kind of antialiasing so it got washed-out but the moving was smooth Phaser 3.8 (Original) Tileset tiles 16x16 (no spaceing / margin) (Extruded) Tileset tiles 16x15 (1px margin / 2px spaceing) Map made with Tiled Vivaldi & Chrome & Windows Edge Tileset Extruder: Code Example / Project: Original Question: (moved to here)
  3. Hey guys, I am using Phaser 3.8.0 I was looking at this as an example\input\mouse\text input test.js and it appears to be working on Phaser 3.8.0 on the sample but when I use the code below in my scene's "create" method, I can see the event in my console logs and if I change the code to "setColor('red')" the text properly turns red... just curious what I am doing wrong here or missing with setting the tint of the font? encounterSceneContext.menuAttack = this.add.text(55, 210, "Attack", { fontSize: '10px', fill: '#ffffff' }); encounterSceneContext.menuRun = this.add.text(55, 225, "Escape", { fontSize: '10px', fill: '#ffffff' }); encounterSceneContext.menuAttack.setInteractive( new Phaser.Geom.Rectangle(0, 0, encounterSceneContext.menuAttack.width, encounterSceneContext.menuAttack.height), Phaser.Geom.Rectangle.Contains); encounterSceneContext.menuRun.setInteractive( new Phaser.Geom.Rectangle(0, 0, encounterSceneContext.menuRun.width, encounterSceneContext.menuRun.height), Phaser.Geom.Rectangle.Contains); this.input.on('gameobjectover', function (pointer, gameObject) { console.log("gameobjectover"); gameObject.setTint(0xff0000, 0xff0000, 0xffff00, 0xff00ff); }); this.input.on('gameobjectout', function (pointer, gameObject) { console.log("gameobjectout"); gameObject.clearTint(); });
  4. I have an old school RPG I am making and I have two main scenes, the Overworld and Encounter scenens. The overworld is fine when switching to it but the problem is the Encounter, before I switch to it, I reset it so I can recreate it from scratch with a random monster in it. The problem is, every time I switch/restart the Encounter scene, the animation of the creature gets progressively faster. I do remove the animation key so I dont get the warning when I switch back to the Overworld scene. Just curious if I am taking the right approach to this and if so, do I need to clean up the sprite of the monster before hand so it doesn't make the animation speed up?
  5. Hey guys, I have searched all over to figure this our but no luck. How do I enable the debug to show the bounding/collision boxes on sprites in Phaser 3? this was pretty easy to do in Phaser 2 but I dont see any docs on how to do this for 3. Thanks!!!
  6. Hey everyone, I looked around for details on this but I am trying to determine the difference between the Physic types: Arcade, Impact, Matter to see what would be best for my type of game or to experiment with. I read in the Dev blogs that "Arcade" was meant for very simple physics in a game, while somewhere else I read that "Matter" was meant for debugging... I would like to know what the real differences are and which would make the most sense for a given game type. Does anyone know what the differences between the Physic types are? Thanks!!!
  7. T0YN3TT

    UI Elements on Phaser 3

    I want to make an login system with phaser 3? how it is possible?
  8. NUGA

    Playing GIFs in Phaser 3

    Is it possible, and if so how, to play GIFs in phaser 3?
  9. So i'm trying to switch scenes when a tween is complete, however i get the titular error 'Cannot read property 'start' of undefined' , and i don't know why this is... Here's the code: class StartScreen extends Phaser.Scene{ constructor(){ super({key: "StartScreen"}); } preload() { this.load.image('Logo', 'assets/Logo.png'); this.load.spritesheet('background', 'assets/backs.png' , { frameWidth: 480, frameHeight: 320 }); } create() { this.anims.create({ key: 'stars', frames: this.anims.generateFrameNames('background', { start: 0, end: 127 }), repeat: -1 }); this.add.sprite(1024/2 , 400, 'background').play('stars', true).setScale(2.5); this.logo = this.add.image(1024/2 , 300, 'Logo').setScale(2); this.text = this.add.text(320, 450, 'Push Enter', { font: '50px NES', fill: '#FFF'}); this.enter = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.ENTER); } update(){ if(this.enter.isDown){ this.text.destroy(); this.enter = ''; this.tweens.add({ targets: this.logo, y: 150, duration: 2000, onComplete: this.onCompleteHandler }); } } onCompleteHandler(){ this.scene.start('MainMenu'); } } class MainMenu extends Phaser.Scene{ constructor(){ super({key: "MainMenu"}); } preload() { this.load.image('Logo', 'assets/Logo.png'); this.load.spritesheet('background', 'assets/backs.png' , { frameWidth: 480, frameHeight: 320 }); this.anims.create({ key: 'stars', frames: this.anims.generateFrameNames('background', { start: 0, end: 127 }), repeat: -1 }); this.add.sprite(1024/2 , 400, 'background').play('stars', true).setScale(2.5); this.add.image(150 , 300, 'Logo').setScale(2); } create() { } }
  10. Is web camera access is possible in phaser 3? If yes. Any one can, please provide me a sample code. How to use webcam.js plugin with phaser 3 game, To access the system web camera.
  11. TheScruffyGuy

    TILED_JSON headache!

    Hi! I am fairly new to Phaser 3 and I have 1 very simple game under my belt (a bulldozer moving rocks around). I am now trying my hand a tile maps so I downloaded Tile and made my map following a few tutorials and now I have my map I have everything set but I keep getting "Uncaught TypeError: Cannot read property 'TILED_JSON' of undefined". I have done alot of reading and I can't seem to find anything helping me with problem. This is all the code I have for right now I am just trying to get my head around tile maps. I have been trying to figure this out for about 2 hours now and I am starting to get a headache, also not asking for anyone to code it for me but pointing me in a direction would be AMAZING! function preload () { this.load.tilemap('store1', 'assets/images/untitled.json', null, Phaser.Tilemap.TILED_JSON); this.load.image('tileS','assets/images/spriteSbuild.png'); } function create () { = this.add.tilemap('store1', 32, 32, 64, 32 );'tileS','assets/images/spriteSbuild.png');'Tile Layer 1').resizeWorld(); }
  12. Hello, I am new to phaser and trying to learn phaser 3. I need a revolute constriant for a project. There are examples for phaser 2 using box2d and p2physics, but they wont work in phaser 3. I tried looking that in documentation but i don't think it is complete yet. Can anybody please tell me how to create a revolute constraint (or pin joint) in phaser 3 (preferably in matter js). Thanks
  13. Poasher

    Spine for phaser 3

    Hi, everyone! I have a question concerning spine suuport for phaser 3. Does phaser 3 supports spine? If does, some examples will be nice! Thanks!
  14. I have had a project html with Phaser 3. Then i had a issue with scrollview. I have seen the listview demo on and release that it used to Phaser 2. Can you give me an example or suggest me a solution about scrollview on Phaser 3. Thank you.
  15. KungFuFlames

    What are the major changes in Phaser 3

    I resently started working with Phaser 3 and so far I learn some of the differences compared to Phaser 2: Scenes No pixi engine Is there any other notable differences at this point?
  16. KungFuFlames

    Best way to handle event

    Hey there guys! I working on chess game with Phaser 3. And so far everything is amazing. Right now I'm working on event handlers for the pieces(figures). Take a look: for(let i = 0; i < this.pieces.length; i++) { this.pieces[i].setInteractive(); this.pieces[i].on('clicked', ()=>{ console.log('Piece clicked')); }, this); } This is taken from the example HERE. So my problem is this fragrament of the code: this.input.on('gameobjectup', function (pointer, gameObject) { gameObject.emit('clicked', gameObject); }, this); Can someone explain the whole structure? Or maybe suggest cleaner way to do it?
  17. 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!
  18. Hi everyone, just wanted to share my tutorial on how to make a simple frogger-style game in Phaser 3 (including some camera shake and fadeout effect) Hope you like it! How to make a game in Phaser 3
  19. erkerk7k

    my animations

    var fog = this.add.image(500, 200, 'dragon').setOrigin(0); this.tweens.add({ targets: fog, x: -300, ease: 'Circle', duration: 30000, repeat: -1 }); var light1 = this.lights.addLight(280, 400, 200,2332,50); var ellipse1 = new Phaser.Geom.Ellipse(light1.x, light1.y, 70, 100); var light2 = this.lights.addLight(500, 386, 200,200,20); var ellipse2 = new Phaser.Geom.Ellipse(light2.x, light2.y, 30, 40); this.time.addEvent({ delay: 100, callback: function () { Phaser.Geom.Ellipse.Random(ellipse1, light1); Phaser.Geom.Ellipse.Random(ellipse2, light2); }, callbackScope: this, repeat: -1 }); var light3 = this.lights.addLight(500, 400, 200,200,20); var dummy = this.add.image(400, 400, 'dragon').setVisible(false); this.tweens.add({ targets: [ light3, dummy ], y: 150, ease: 'Sine.easeInOut', yoyo: true, repeat: -1, duration: 3000 }); Im stuck on this example in the examples for phaser 3 First create lights to make candles more realistic and typescript demands 5 arguments. i have no clue what to fill in fourth "RGB" it onli accept integers though nothing else and this.lights(enable) is set too but it not showing on the screen here. The fog animation tween works perfectly fine but it refuses to light is it me doin anithing wrong or is it updated allready to new code what can be the issue? kind regards.
  20. Hemanthraj

    How to smooth tween animation

    How to smooth the tween animation in the android devices.
  21. RollinSafary

    How to remove matter colliders

    ``` setColliders (x, y, side, index) { // collider a this.colliderA = - side * 150, y, 7, { label: 'collider_a', isStatic: true, }) // collider b this.colliderB =, y, 7, { label: 'collider_b', isStatic: true, }) // collider basket this.colliderBasket = this.scene.matter.add.rectangle( x - side * 73, y, 120, 30, { label: `Basket${index}`, isStatic: true, isSensor: true, }, ) } ``` which function will remove them ?
  22. I am trying to following this example and I want to create multiple lines in a path using lineTo instead of circleTo, but instead the particle treats it like two points. var path = new Phaser.Curves.Path(0,0).lineTo(100, 200); Any help is appreciated.
  23. Hey i'm doing a small project in which, when i click on an object the game resets: positions, timers, everything goes back to the same way it was when it was first opened. Is there a way to do this? Something like game = new Phaser.Game(config) ?
  24. ghclark2

    SVG and tilemaps

    Hi, one of the things I was excited about for phaser 3 was the possibility of using svgs to make really crisp good looking games. Just wondering though whether there is any way of using svgs for a tilemap, or is there another way of getting good looking tilemaps without huge filesizes? Thanks, Gordon
  25. Hello, I am making a kind of flappy bird. I want the pipes to move only horizontally. They have physics, so i can use the setVelocityX method. But they are falling down because of the gravity. I can change the position changing the x value of the pipe in the update method, but i would like to use the setVelocityX, it is more clear. var columna =; ... columna.setVelocityX(-200); Thanks!