Search the Community

Showing results for tags 'phaser3'.

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 50 results

  1. Hi all, I'm trying to build a demo keeping it simple with ES5, and I'm trying to add a custom method to a scene, in a way similar to how it was done on Phaser 2. I realized this is not possible and was wondering if there is any recommended way to do this (without using ES6 to extend the Scene class, and without adding functions in the global scope either): var GameScene = { preload: ... create: ... update: function() { // custom logic if(...) { // if something happens, game over (doesn't work). this.gameOver is undefined this.time.delayedCall(500, this.gameOver, [], this); } }, // adding this custom method like in Phaser 2 - doesn't work on Phaser 3 gameOver: function() { console.log("game over"); } } var config = { type: Phaser.AUTO, width: 640, height: 360, scene: GameScene }; var game = new Phaser.Game(config);
  2. We are buying a couple of HTML 5 Phaser (preferably Phaser 3) games. It could be of any categories and being Mobile Friendly is a must. If you are interested, plz drop a line and I will contact. Thanks, Yan
  3. supersushi

    Game dimensions in Typescript

    Hi! I have been looking for 2 days how to get the full width and height of the game in Typescript. For example, I want to place a gameobject randomly but within the visible bounds. In javascript I have seen solutions mentioning ``, or `` etc. But nothing in TS. Thanks for your help, A super-novice
  4. Hello developers, I just start using phaser 3, and I bump into a question with the animation. Here is my code. var characterAnimConfig = { key: 'key-name', frames: scene.anims.generateFrameNumbers('spritenamehere', { start: 0, end: 7 }), repeat: -1, frameRate: 10, }; this means the animation will keep repeating from the first(frame 0) to the end(frame 7), my question is is there a way to let the animation only repeat the last two frame? expected frame goes like this: (0,1,2,3,4,5,6,7,6,7,6,7,6,7...). Thanks.
  5. Antriel

    Tap Tap Plane

    Test your tapping and timing skills in this fun game. Traditional flappy gameplay, tap to stay afloat! Avoid obstacles and get as far as you can. Unlock five different secrets, each funnier than the previous one. Can you unlock them all? Play the game here: Developed in Haxe, using phaser v3 You can put the game on your portal using this url. The game is also available for licensing.
  6. This plugin will help you build paths for pathfollowers and path tweens. Draw and edit Lines, Bezier Curves, Splines and Ellipses at runtime and export them to Phaser. A useful tool for editing and building paths. Explore your scene while building paths. Draw your path in-game during runtime. Export path as JSON Data. Load them into Phaser and create awesome animations using pathfollowers! Maximum usage of Phaser API. More cool features will be added soon! Demo. Src & Docs NPM Submit an issue
  7. Catrin

    loadTexture help

    Hello, I am new at this and I need help. I am using v3 to make a small game in which a sprite has to change appearance upon an event. I was trying to use the Phaser 2 example below: var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create }); function preload() { game.load.atlasJSONHash('bot', 'assets/sprites/running_bot.png', 'assets/sprites/running_bot.json'); game.load.spritesheet('mummy', 'assets/sprites/metalslug_mummy37x45.png', 37, 45, 18); } var bot; function create() { bot = game.add.sprite(200, 200, 'bot'); bot.animations.add('run');'run', 15, true); game.input.onDown.addOnce(changeMummy, this); } function changeMummy() { bot.loadTexture('mummy', 0); bot.animations.add('walk');'walk', 30, true); } But I keep getting "player.loadTexture is not a function" error. I assume the equivalent of in Phaser 3 is different, but I can't find it. Any help will be appreciated.
  8. NUGA

    Playing GIFs in Phaser 3

    Is it possible, and if so how, to play GIFs in phaser 3?
  9. wkd-aine

    Tilemap Resize

    Hi, I am updating a game from Phaser2 to 3, and was hoping someone can help! The game is a platformer game, somewhat similar to the Mario demo game, but the tilemap needs to resize on smaller screens to allow a range of browsers to be used to play the game. In Phaser2 the following code worked layer = map.createLayer( 'tiles' ); layer.setScale( scale_y ) layer.resizeWorld(); if( scale_y != 1) layer.resize(tile_width, tile_height); I have tried multiple approaches to getting the tiles to resize in Phaser 3 and realise that we don't have the same scaling functionality as before, but was hoping someone has some ideas on how this can be achieved. I have managed to resize the actual tiles, but then the extra tiles that are then displayed aren't rendered, see print screen below. You can see that the physics body is being added correctly, not sure if it makes any difference but am using matterJS, see code below if( utils.DEBUG ) { = true } let size = utils.TILE_SIZE * utils.scale_y var map = scene.make.tilemap({ key: 'map_level' }) var tiles = map.addTilesetImage('world_tiles') var layer = map.createStaticLayer( 'tiles', tiles, 0, 0 ) .setScale( utils.scale_y ) .setScrollFactor( 0 ) .setCollisionByProperty({ collides: true }) // if( utils.scale_y != 1 ) layer.resizeWorld( utils.TILE_WIDTH, utils.TILE_HEIGHT ) size, utils.TILE_HEIGHT ) layer ) If you need anything clarified please let me know. Many thanks in advance Áine
  10. LordLants

    Angular 5 CLI Integration

    Hi there. I am very partial to Angular, I use it for basically all of my personal projects and know that, in the long run, I would want to wrap any game that I make in an Angular shell eventually. Unfortunately, as far as I can tell, it is currently quite difficult to get Phaser 3 working with the Angular CLI due to two simple things: 1) if bundling with webpack (which Angular does by default) the .frag and .vert files need a raw-loader configuration, 2) the CANVAS_RENDERER and WEBGL_RENDERER need to be initialized. The Angular CLI does allow for these things by calling "ng eject" at the command line, adding module: { rules: [ { test: [ /\.vert$/, /\.frag$/ ], use: 'raw-loader' } ] }, plugins: [ new webpack.DefinePlugin({ 'CANVAS_RENDERER': JSON.stringify(true), 'WEBGL_RENDERER': JSON.stringify(true) }) ] but calling "ng eject" has its own set of adverse side effects that are not very ideal (you lose a lot of the CLI). Is there any way that these two small things can be handled so that Phaser 3 can easily be built and run in Angular without needing to use "ng eject"? Does anyone know of a way to currently use Phaser 3 with Angular without having to eject? Currently at any point if phaser.min.js is included as a script the bundler blows up, from all that I can tell. I know that part of the underlying problem is how the Angular CLI handles its webpack.config.js file in the first place, and how the CLI team doesn't want to allow more customization in the .angular-cli.json file, but that just kind of is what it is right now. Any feedback would be appreciated, thanks!
  11. Hello, I'm new here, so firstly I want to greet with all of you. Regarding my question, or maybe problem - some background here: I want to create minimal for My 2D space shooter. I check tutorials on labs.phaser where I saw example with creating MiniMap with second camera - it sounds good. So I created class for My MiniMap: import Phaser from 'phaser' export default class MiniMap extends Phaser.Cameras.Scene2D.Camera { constructor ({ scene, x = 10, y = 10, width = 192, height = 192, zoom = 0.1, scroll = { x: 960, y: 960 } }) { super(x, y, width, height) this.scene = scene this.zoom = zoom this.scroll = scroll } init () { this.scene.cameras.cameras.push(this) this.scene.cameras.addExisting(this) this.setZoom(this.zoom) this.setScroll(this.scroll.x, this.scroll.y) return this } } And I'm creating it in My GameScene in create() function: create () { this.bgImage = new BackgroundImage({ scene: this }).init() this.miniMap = new MiniMap({ scene: this }).init() this.miniMap.setBackgroundColor('black') this.player = new Spaceship({ scene: this, x: 0, y: 0 }).init() } About My sizing, BackgroundImage and Bounds are 1920 x 1920 px, so in MiniMap we had 192 x 192 and also zoom as 0.1 (1/10 of real game world). It should create Map with the whole world, but it is cut on left and top and have free space at right and bottom (attachment). How to fix it? Also, maybe you can give me some tips how to change Spaceship sprite on MiniMap (second camera) as for example dot? Thanks for advance! Best, DaaV
  12. theNeedle

    Audio Format Compatibility

    I know we can pass different sound formats in phaser3 to let browser choose the compatible format. 1. According to this this and this mp3 is supported in most of the major browsers. So is it wise choice to use only mp3 format? if not then which format should be used with mp3 to support wide range of browsers? 2. Does this issue with ios 9 that required user engagement to start audio playback is handled by Phaser 3? From documentation it looks like WebAudioSoundManager has unlock method to resolve this issue but I'm not quite sure.
  13. ddabrahim

    BUG:animationFrame is undefined

    Hi I get the following error message with Phaser 3.1.2 when trying to run the project from this tutorial:
  14. mat89c

    Set anchor in Phaser 3

    Hello, How can i set anchor point in Phaser 3? setOrigins not working for me. For example: Phaser2 Phaser 3 Sprite is "jumping" on resize. How can i fix it?
  15. alliell

    Looping background image

    Hello, is there any way haw to loop background image in Phaser 3? I tried to something like this : function preload() { game.load.image("background", "background.png"); }, function create() { var background = game.add.tileSprite(0, 0, 500, 500, "background"); }, function update() { background.tilePosition.x += 0.5; }, but this isn't working. Thanks for any help
  16. I am trying to learn Phaser 3 and I have created ground object 100x100px ground object to randomize, I decided to scarp that and made a image the length I need but now the old image wont change and the second ground object I created is still on the game screen even after I had erased the code. I even went as far as removing its image from function preload(). I am saving the code after every alteration. var game = new Phaser.Game(config); function preload () { this.load.image('bulld', 'assets/images/bulldozer.png'); this.load.image('world', 'assets/images/background1.png'); this.load.image('rock1', 'assets/images/rock1.png'); this.load.image('grnd1', 'assets/images/ground1.png'); } function create () { this.add.image(550,350, 'world'); rocks = this.physics.add.sprite(550, 540, 'rock1'); rocks.setBounce(0.1); rocks.setCollideWorldBounds(true); ground = this.physics.add.staticGroup(); ground.create(400, 652, 'grnd1').setScale(0.27).refreshBody(); }
  17. pancakegoescrazy

    Phaser3 load polygon

    Hello guys, what is the equivalent of this tutorial: in phaser3? I have some collision issues because my images/sprites are having a rectangular shape. After investigating possible solutions, I came across the loadPolygon function & PhysicsEditor but I do not know how to use loadPolygon function in Phaser3. Thank you!
  18. I'm making small turn based game tic-tac-toe using phaser 3. Is it possible to cache assets and all the files needed to run game so that game can be played offline so that no internet connection is needed and every file is loaded from cache (providing native like experience)? Does service worker would do the trick? What are the common approaches to speed up the loading process and caching in HTML5 games?
  19. arkaghosh024

    Detecting doubleTap in PhaserJS

    I am a complete newbie in PhaserJS. I am trying to develop a game in PhaserJS where tapping the screen once should make the user avatar move on the screen and double-tapping should make it jump. However, I am not being able to figure out how to detect the double tap event. I have seen this tutorial in their official documentation, but that didn't work. When I am putting this line game.input.onTap.add(onTap, this); in the function create(){ ..... } function, it is showing this error Uncaught TypeError: Cannot read property 'add' of undefined I am being able to detect single tap events using this code: if(game.input.onTap && player.body.touching.down){ player.setVelocity(-530); } I've read another thread where the members have commented that to detect double click, one should start a timer and check if both the clicks are coming within a threshold value. However, I think this is not a foolproof method and there must be a better way of doing it. Can anyone please help?
  20. Doug

    Video game object

    Hi All Forgive me if I've missed this, but I can't seem to find any examples or reference to being able to create video game objects / textures. Is this possible please? I am thinking of mp4 or ogg video playing on a game object within the game. Mainly for use in things like interactive product tours etc. I note that the Phaser.Device namespace has a "video" member. I also note that Rich mentioned the video.OnComplete event handler in one of his posts too. So I am wondering if there is support for actual playback too? Thanks very much!
  21. AdamRyanGameDev

    Coding Train Tutorial

    Found this and was curious if it-d be Phas3r or not.... unfortunately this doesn't state that it is actually Phas3r... but yeah it is! Anyways posting because there are not that many video tutorials out there
  22. In phaser3, it is possible to add scene at runtime, but how to destroy and free a scene instance? Or should scene instance be kept always?
  23. Lightnet

    nodejs project templates

    Hello! I am sharing my project template builds which tends to try out if worth trying out to develop game projects for prototyping things. I made a Nodjes project build script for easy way to setup the project on local pc build develop. The build is babel es5/6 javascript. I used gulp task build for auto scripts. Gulp default task will build the files and start a server. Just need to install nodejs and run command line. If you have Visual Studio Code that is setup by the project. Those projects are build to compile into bundle.js to put everything in to one file for client since loading and creating each scripts is time consuming. Here the simple project test build work folder. Simple Example game. I made another project that is multiplayer network but still a bit buggy and few messy code script that will try to clean up later. It base on lance-gg client and server. I ported the spaaace game github to used Phaser 3.x to render the game. There are links references and credits in the file. It just a space ship shooter game. As 2D physics for phaser 3.4.0 server side it doesn't have it. 2D physics is very simple collision using lance-gg package.
  24. Hemanthraj

    How to smooth tween animation

    How to smooth the tween animation in the android devices.
  25. Hey all, I'm using tween for my game in the android device it is too lacking and slowly working tween, then i tried with physics both too slow how to solve.