Tutorials

Find tutorial navigation menu on the right side –>

Please post your ideas on tutorials in comments section below.

Future tutorials

Animation editor
Basics
Create from code
Main timeline
Easing
Character animations

Advanced
Parallax background
Path-finding
Scaling game
Handle mobile screen rotation

User interface
Loading
Menu
Intro
Shop
Game Over

Games
Dungeon
Never-ending runner
Candy crush like game

16 comments on “Tutorials

  1. Is there a reason MightyEditor works not with most recent version of Phaser?
    Can I just exchange phaser.min.js or will that lead to problems of some sort?

  2. For editor itself – there are some changes in phaser object picking ( or bounds? ) since v2.0.7 – so picking won’t work with newer version of phaser. Also tilelayer part has beeen changed since v2.0.7 – probably will need to make changes to tilelayer plugin – as MightyEditor allows to “unfix” tilemaplayer from camera.

    For projects – you can update phaser to < 2.2.0 – as in 2.2.0 tweens has been rewritten. If you don't use tween animations – you can update to latest phaser version.

  3. Hello,
    I have written a code in play.js, that should say: generate a random integer between 0 and 10,

     
        if (this integer is 1)
    {
        create an object "meteorite"
        and move it constantly by  one random number of pixels to the left
    }
    

    My code:

    update: function() 
    	{
    		var randomnumber = Math.floor(Math.random()*11);
    		var randomheight = Math.floor(Math.random()*500)-250;
    		var randomspeed = Math.floor(Math.random()*50)+100;
    		if (randomnumber == 1)
    		{
    			this.meteorite = mt.create("Meteorite");
    			this.meteorite.body.velocity.x = - randomspeed;
    		}
             }
    

    Also when when the object appears I want it to appear on “randomheight” y axis, but not to change the location on y afterwards.

    How can I make this work?

  4. Hi Laura,

    you can write random integer function in more elegant way game.rnd.integerInRange(4, 8); Where integers are generated randomly from 4 to 8.

    after that you need operate with time. Create 2 variables in create method and assign current time and random time in ms for meteorite launch. I’ll set that launch will be in 1-2 seconds

    create: function(){
        this.lastTime = game.time.now;
        this.launchMeteorite = game.rnd.integerInRange(1000, 2000);
    }
    

    then in update method check if time is passed and if yes then launch meteorite

    update: function(){
        if(game.time.now >= this.lastTime + this.launchTime){
            // here create a meteorite sprite
            this.lastTime = game.time.now; // set current time as last time
            this.launchMeteorite = game.rnd.integerInRange(1000, 2000); // set new random launch time
        }
    }
    

    to change meteorite on y axis you need to do simple thing as

    this.meteorite.y = randomheight;

    Also I would recommend to store meteorite sprites in array. Like

    this.meteorites = [];

    and a new meteorite can be added to array with push method

    this.meteorites.push(meteorite);
    1. It works, except when I increase the launch time, nothing changes, it still creates a new meteorite about every second, also I can’t seem to make the object to move constantly on the x axis by “randomspeed” pixels.
      Code:

      "use strict";
      window.SpaceShooter.state.play = {
          create: function() {
              //here we add two tile sprites with parameters(locationX, locationY, width, height, key)
              this.wall = this.game.add.tileSprite(0, 0, 920, 500, '/BG.png');
              this.character = mt.create("character");
              this.meteorite = mt.create("Meteorite");
              this.lastTime = this.game.time.now;
              this.launchTime = this.game.rnd.integerInRange(50000, 60000);
              this.grass = this.game.add.tileSprite(0, 0, 920, 500, '/MeteoriteBG.png');
          },
      
          update: function() {
              var randomheight = this.game.rnd.integerInRange(0, 500);
              var randomspeed = this.game.rnd.integerInRange(-150, -50);
              if (this.game.time.now <= this.lastTime + this.launchTime) {
                  this.meteorite = mt.create("Meteorite");
                  this.meteorite.y = randomheight;
                  this.meteorite.body.velocity.x = randomspeed;
                  this.lastTime = this.game.time.now;
                  this.launchTime = this.game.rnd.integerInRange(50000, 60000);
              }
          }
      }
      

      Thank you for answer!

      1. I think that you have problem in if() statement. It should be greater or equal not less

        if(this.game.time.now >= this.lastTime + this.launchTime){...
        
    1. Check CocoonJS and Cordova. The first one has the best performance but you have to make game without DOM elements only canvas (and MightyEditor does that). Second – Cordova uses webview technology. Basically it opens native app with browser build in.

      Btw, soon we will have export option right from MightyEditor. So you would not have hassle to install any advanced tool. Just one click in your browser :)

  5. Hi,
    Wanted to ask if there is a way to get an objects current location on y and x axis?
    I’m guessing this.character.getPosition(); isn’t it?
    Thank you in advance.

  6. Have you tried highlighting the partten, left mouse click, choose copy and then opening your word program and pasting the partten on a blank document. Then print the partten from the word document? I do this a lot when I want to print out and also save a partten that is not available in pdf format.

Leave a Reply

Your email address will not be published. Required fields are marked *