Jump to content
GameMonetize.com © The leading broker of high quality cross-platform HTML5 games ×

How to correctly create ground?

Draxy

By Draxy,
in Phaser 2

 Share

Recommended Posts

Draxy Newbie

Draxy

Posted
Posted (edited)

Hi, I am noob, and this is a nooby question.

I've looked everywhere for a fix, but I can't get my ground to show, I'm not sure if it's even there.

My code: (updated to show all my code so far) 

   <!doctype html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>hello phaser!</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

        <script src="phaser.js"></script>

        <link rel="stylesheet" href="game.css">
    </head>
    <body>

    <script type="text/javascript">

window.onload = function() {

  var width = $( document ).width();
  var height = $( document ).height();

  var game = new Phaser.Game(width, height, Phaser.AUTO, '', { preload: preload, create: create });

  function preload () {

                                                          //800 336
    game.load.spritesheet("background" , "backgroundgif1.png", 800, 336);
    game.load.image("ground","red.png");
    game.load.spritesheet("blue_player", "player_sprites/playertwo standing.png", 96, 96);

  }

  function create () {
    game.physics.startSystem(Phaser.Physics.ARCADE);
    platforms = game.add.group();
    platforms = game.add.physicsGroup();
    platforms.enableBody = true;
    var ground = platforms.create(400, 450, 'ground');
    platforms.setAll('body.immovable', true);
    ground.scale.setTo(2, 2);

    var background = game.add.sprite(0, 0, 'background');
    background.animations.add("background", [0,1,2,3,4,5,6,7,8], 10, true);
    background.animations.play("background");
    background.width = game.width;
    background.height = game.height;

    blue_player = game.add.sprite(-10, game.world.height -490, 'blue_player');
    game.physics.arcade.enable(blue_player);
    blue_player.body.bounce.y = 0.2;
    blue_player.body.gravity.y = 300;
    blue_player.body.collideWorldBounds = true;
    blue_player.animations.add('left', [0, 1, 2], 2, true);
    blue_player.animations.play("left");

  }

  function update() {
    game.physics.arcade.collide(blue_player, platforms);

  }

};

    </script>

    </body>
    <script src="update.js"></script>
</html>

 

Any ideas as to what I'm doing wrong?

Edited by Draxy
Shows all my code
Link to comment
Share on other sites
Draxy Newbie

Draxy

Posted
  • Author
Posted
6 hours ago, Tom Atom said:

your code works for me and shows ground. Make sure your image loading code is in preload() function and it has correct path to asset.

I've updated it to show all my code, could you please take another look? I'd really appreciate it.

Link to comment
Share on other sites
ncil Newbie

ncil

Posted
Posted

Hi Draxy,

I took a quick look at your code and have a couple notes.  

 var ground = platforms.create(400, 450, 'ground');

Here you're creating the ground at (400, 450). Try creating it at (0, 450) and you will see your player fall from the top left onto the platform instead of the bottom of the world. It seems like maybe you are having trouble getting the asset to load and the player isn't being dropped on the platform.

You're creating the platform correctly, but the group has some unneeded code. 

    platforms = game.add.group();
    platforms = game.add.physicsGroup();
    platforms.enableBody = true;

In the above code, you only need the second line, add physicsGroup. physicsGroup is a type of group, so you're basically defining a group variable and then redefining it as a physicsGroup. Physics groups automatically set enableBody to true on any sprites created in the group, so you shouldn't need that third line either.

Reference: http://phaser.io/docs/2.4.4/Phaser.GameObjectFactory.html#physicsGroup

Link to comment
Share on other sites
Draxy Newbie

Draxy

Posted
  • Author
Posted
7 hours ago, ncil said:

Hi Draxy,

I took a quick look at your code and have a couple notes.  


 var ground = platforms.create(400, 450, 'ground');

Here you're creating the ground at (400, 450). Try creating it at (0, 450) and you will see your player fall from the top left onto the platform instead of the bottom of the world. It seems like maybe you are having trouble getting the asset to load and the player isn't being dropped on the platform.

You're creating the platform correctly, but the group has some unneeded code. 


    platforms = game.add.group();
    platforms = game.add.physicsGroup();
    platforms.enableBody = true;

In the about code, you only need the second line, add physicsGroup. physicsGroup is a type of group, so you're basically defining a group variable and then redefining it as a physicsGroup. Physics groups automatically set enableBody to true on any sprites created in the group, so you shouldn't need that third line either.

Reference: http://phaser.io/docs/2.4.4/Phaser.GameObjectFactory.html#physicsGroup

Thanks for the reply! I did fix this with game.world.sendToBack(background); to place the background behind the ground, that was the main problem. Thanks for your time!

Link to comment
Share on other sites
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...