• Content count

  • Joined

  • Last visited

  • Days Won


BdR last won the day on July 2 2016

BdR had the most liked content!


About BdR

  • Rank
    Advanced Member

Contact Methods

  • Website URL

Profile Information

  • Gender
  • Location
    The Netherlands

Recent Profile Visitors

3,252 profile views
  1. For a game idea I was wondering, what is the best way to do a searchlight effect? So I mean the entire screen is darkened, except for a few circles of light that move across the screen. Ideally the light circles could move independently from each other, so one moving up and another moving to the left. I understand that you can make the screen darker by adding a black Graphic rectangle over the entire screen, and then setting its Alpha to 0.5, but there need to be moving holes in it so to speak. See the video below for a scene from the Amiga game "Hostages", that is kind of the effect what I mean. Any ideas on how to go about this?
  2. I'm working on a Phaser3 game with a group of sprites, and I want to sort all the sprites based on the data values. So I tried the code below. this.bubbles =; for (var i = 0; i < 16; i++) { // add random bubble var b = Phaser.Math.RND.between(1, 8); newbub = this.bubbles.create(0, 0, 'sprites', 'bubble'+b); // store color in data newbub.setData("color", b); } this.bubbles.sort("data.values.color"); // TypeError: this.bubbles.sort is not a function But the .sort() gives this error: It seems the Phaser.Group doesn't have a .sort() function, is that correct? I'm looking at the docs here.
  3. Thanks yes that was the problem. The "pack:{files[] }" array has to be passed into the constructor.
  4. I'm also struggling with this payload concept. Looking at this example it seems to me that the "pack" property could be used to load assets before the .preload() function is called. So this would be ideal for loading the images for a loading bar or a "please wait while loading" image. However, when I try it like in the code below the image "nowloading.png" is not loaded. I mean when I try to display it in the .preload() function it just shows the green missing-graphic square. EDIT: Fixed the code below to work, the "pack:{files[]}" part has to be passed into the constructor. var Preloader = new Phaser.Class({ Extends: Phaser.Scene, initialize: function Preloader () {, { key: 'preloader', pack: { files: [ { type: 'image', key: 'nowloading', url: 'img/nowloading.png' } ] } }); }, preload: function () { // nowloading image is available in preload :) so like a pre-preloaded image this.add.sprite(400, 300, "nowloading"); // load all assets'coin', ['snd/coin.mp3', 'snd/coin.ogg']);'bomb', ['snd/expl.mp3', 'snd/expl.ogg']); //etc. }, create: function () { // start the game this.scene.start('mainmenu'); } }); // ..etc. var config = { type: Phaser.AUTO, width: 800, height: 600, backgroundColor: '#006060', parent: 'phaser-example' scene: [ Preloader, MainMenu, TutorScene, GameScene ] }; var game = new Phaser.Game(config);
  5. I've created a Phaser3 game template example, it's available on GitHub here: GitHub: Play demo: Phaser3 example game This is a Phaser v3 example game template, it's intended to show the structure of a typical Phaser3 game and using some of the key features of Phaser. It shows how to use separate scenes, a simple but effective loading bar, sprite atlas loading, sprite animation, buttons similar to Phaser v2 and more. It's a bare minimum game, a starting point of sorts. I hope it's useful for someone just starting out with Phaser development. Have fun with it let me know if you have any improvements. (Btw the only thing still missing is scaling or a scale manager, I'll add that at a later time)
  6. I'm working on a Phaser3 game with mulitple scenes, a mainmenu, a instructions scene and a maingame scene for the actual game. During the game I need an animation, so in the preload of the gamescene I do this preload: function () { // create coin animation this.anims.create({ key: 'cointurn', frames: [ { key: 'sprites', frame: 'coin1' }, { key: 'sprites', frame: 'coin2' }, { key: 'sprites', frame: 'coin3' }, { key: 'sprites', frame: 'coin4' }, { key: 'sprites', frame: 'coin5' }, { key: 'sprites', frame: 'coin6' }, { key: 'sprites', frame: 'coin7' }, { key: 'sprites', frame: 'coin8' } ], frameRate: 15, repeat: -1 // endless }); }, Ok this all works fine and the animation shows. Then, when the game is over it goes back to the menuscene to allow player to select another level, and then start the gamescene again to play another level. However, when I restart the gamescene again I get this warning; Evidently the preload of the gamescene is fired again, and everything loaded and created in that .preload() method is done again. So my question is: Where or when should I add the animations that only have to create once? So animations (and maybe other things?) that will be used throughout the entire session of the game.
  7. Thanks @NoxBrutalis I was focusing to much on the .createMultiple() method. Simply creating the coins in a loop and then adding them to the group worked for me this.gameitems =; for (var i = 0; i < 20; i++) { var x = Phaser.Math.RND.between(0, 800); var y = Phaser.Math.RND.between(0, 600); var newobj = this.gameitems.create(x, y, 'sprites', 'coin1'); } Btw is there a way to get the width and height values (800 and 600) from the current scene or game instead of using hardcoded numbers for the RND function?
  8. I've found an example with frames and the code below works for me btw somehow the "blendMode: ADD" seem to sometimes make the particles invisible, for example it does work in this example but it doesn't in this example. preload: function () { // sprites this.load.atlas('sprites', 'img/spritearray.png', 'img/spritearray.json'); }, // bomb explosion particles var expl = this.add.particles('sprites'); this.bombexpl = expl.createEmitter({ frame: [ 'bombexpl1', 'bombexpl2', 'bombexpl3' ], // random frames quantity: 10, scale: { start: 1.0, end: 0 }, // particles shrink speed: { min: -1000, max: 1000 }, // speed is variable lifespan: 800, on: false }); // set emitter to position and explode this.bombexpl.setPosition(100, 100); this.bombexpl.explode(); So you can start the emitter with .explode() to release a "quantity" amount of particles at once OR you can do .start() and it will continuously emit "quantity" amount of particles for every "frequency" milliseconds. But I have another question, is it possible to use .start() for a specific amount of times? So emit X particles every Y ms, but stop after let's say 5 times. So can you make the emitter do it 5 times and then automatically stop?
  9. I'm working on a Phaser 3 game and all my sprites are in a spriteatlas. All the examples about particles and emitters I could find on the forum (like here and here) are using a single image-key as parameter for the particles. But is it also possible to use a spriteatlas as particles? This is my code below, but it doesn't seem to work. There are no errors but nothing appears on the screen. code removed And I have another questions actually: When I'm stuck with a Phaser3 problem like this, where is the best place to look up the info or documentation? So for example I don't know how to use `scene.add.particles`, where can I find the documentation about this constructor? I've looked here, but AFAIK the info I'm looking for is not there. I found the v2 documentation very clear and legible, and I'm struggling a bit with this new v3 documentation. Is it there or am I over looking in the wrong place?
  10. In the distribution folder on GitHub there are 3 flavours of the Phaser3 library. phaser (~4.46 MB) phaser-arcade-physics 3.95 MB) phaser-core (~2.19 MB) (and also minified versions) I guess phaser-arcade-physics includes support for arcade-physics, but then why is Phaser actually bigger? And what is the difference between Phaser and Phaser-core? I've looked in the FAQ, wiki and download page but couldn't find aything on it.
  11. Thanks, that works. I was able to create a button similar to how it works in Phaser v2 Btw will the `Button` be added to Phaser3 in some shape or form at a later time?
  12. I've just started Phaser 3 development and I noticed there are no buttons, which I found a little odd. Buttons are a very important part of the interactivity of a game. In Phaser 2 I used them all the time for creating menus, select a level, restart level, quit game etc. But ok I understand that you can use a sprite and add .setInteractive() so it will act like a button. The button should change color when on mouse-over and another color when it is pressed down. I'm using a sprite atlas with the different frames for the button faces, and I've tried using the pointerover and pointerout and pointerdown events to change the of the sprite but this doesn't seem to work. preload: function () { this.load.multiatlas('sprites', 'img/sprite_demo.json', 'img'); }, create: function () { // back Button this.btnback = this.add.sprite(400, 480, 'sprites', 'btn_back').setInteractive(); this.btnback.on('pointerover', function (ptr, x, y) { = 'btn_back_hl'} ); this.btnback.on('pointerout', function (ptr) { = 'btn_back'} ); this.btnback.on('pointerdown', function(event){ = 'btn_back_down'; this.scene.start('mainmenu'); }); }, Changing doesn't seem to do anything, it stays the same frame as when the sprite was created, no interactivity. So how can I make buttons work in Phaser 3?
  13. Wait what, no buttons? Will they be added at a later time?
  14. In Phaser 3 is it possible to create a group and add multiple sprites at random positions? I've tried looking at the documentation here and the example here but couldn't figure out how to do it. This is my code so far, it does add one coin at a random position each time I run it, butit only seems to add one single coin. // add random coins var coins =; coins.createMultiple( { key: 'sprites', frame: 'coin1', setXY: { x: Phaser.Math.RND.between(0, 800), y: Phaser.Math.RND.between(0, 600) }, frameQuantity: 2, repeat: 5 }); Coming from Phaser v2, I've just started working with Phaser 3 and it takes some time to get to understand the differences.
  15. BdR

    Is it possible to debug-display sprite?

    If I may tag along with a similar question.. In Phaser 3 is it possible do display debug text in the scene, similar to game.debug.text() in Phaser v2?