Jump to content

Collision won't work by two of the four things


KnTproject
 Share

Recommended Posts

Hello,

I have a problem with collisions, because I added four times collisions, but by two of that it won't work (names "steen" and "steen1"). I don't know why it doesn't work, because I did the same things as the other two. The only difference is that by "steen" and "steen1" I won't refer to a function, which I do by the other two because of kill(). 

The function of the "steen" and "steen1" is that the car won't drive over the grass. I placed an opacity wall over the background, so that you can't drive from the road.

Does anybody knows a solution/

Code:

var road;
var turtle;
var steen;
var steen1;
var cursors;
var controls = {};
var auto;
var melon;

 

var playState = {
    preload: function(){
        game.load.image('turtle',     'assets/turtles.png');
        game.load.image('road',     'assets/road.jpg');
        game.load.image('steen',    'assets/steen.jpg');
        game.load.image('steen1',    'assets/steen.jpg');
        game.load.image('auto',     'assets/car.png');
        game.load.image('melon',     'assets/watermelon.png');
        
    },

    create:function(){
        game.physics.startSystem(Phaser.Physics.ARCADE);

        //Background
        road = game.add.tileSprite(0,0,1250,700,'road');
        game.physics.arcade.enable(road);

        //MuurLinks
        steen = game.add.sprite(97,0,'steen');
        game.physics.arcade.enable(steen);
        steen.body.immovable = true;
        steen.width = 92;
        steen.height = 700;
        steen.alpha = 1;

        //MuurRechts
        steen1 = game.add.sprite(1078,0,'steen1');
        game.physics.arcade.enable(steen1);
        steen1.body.immovable = true;
        steen1.width = 92;
        steen1.height = 700;
        steen1.alpha = 1;

        //SchildpadKarakter
        turtle = game.add.sprite(546,250,'turtle');
        game.physics.arcade.enable(turtle);
        turtle.width = 162;
        turtle.height = 226;
        turtle.body.immovable = true;

        //VerzamelobjectMeloen
        melon = game.add.sprite(830,100,'melon');
        game.physics.arcade.enable(melon);
        melon.body.immovable = true;
        melon.anchor.setTo(0.5);
        melon.scale.setTo(0.3);


       //VijandAuto
       auto = game.add.sprite(440,0,'auto');
       game.physics.arcade.enable(auto);
       auto.anchor.setTo(0.5);
       auto.scale.setTo(0.3);
       auto.body.immovable = true;
           
           //Besturing
        cursors = game.input.keyboard.createCursorKeys();

        controls = {
          right: this.input.keyboard.addKey(Phaser.Keyboard.D),
          left: this.input.keyboard.addKey(Phaser.Keyboard.A),
          
        }; 

    },

    update:function(){
         //Achtergrond verandering
        road.tilePosition.y += 3;

        //Besturing turtle
        turtle.body.collideWorldBounds = true;
        turtle.body.velocity.x = 0;

        if (controls.left.isDown){
          turtle.body.velocity.x = -200;  
        }

        if (controls.right.isDown){
            turtle.body.velocity.x = 200;
        }

        //Collision auto
        auto.body.velocity.y = 200;
        game.physics.arcade.collide(turtle,auto,this.gameover,null,this);

        //Collision melon
        melon.body.velocity.y = 100;
        game.physics.arcade.collide(turtle,melon,this.collectMelon,null,this);

        //Collision steen
        game.physics.arcade.collide(turtle,steen);
        game.physics.arcade.collide(turtle,steen1);
    },


    collectMelon:function(){
        melon.kill();

 

    },

    gameover:function(){
        game.state.start('over');

    },


    Finish:function(){
        game.state.start('win');
    }


};

Link to comment
Share on other sites

try to add gravity, like:

physics.startSystem(Phaser.Physics.ARCADE);
physics.arcade.gravity.y = 0;
    
road = this.add.tileSprite(0,0,1250,700,'road');
physics.arcade.enable(road);
    
steen = this.add.sprite(97,0,'steen');
steen.enableBody=true;
physics.arcade.enable(steen);
steen.body.immovable = true;
steen.width = 92;
steen.height = 700;
steen.alpha = 1;
...

 

Link to comment
Share on other sites

13 hours ago, rufflezs said:

try to add gravity, like:


physics.startSystem(Phaser.Physics.ARCADE);
physics.arcade.gravity.y = 0;
    
road = this.add.tileSprite(0,0,1250,700,'road');
physics.arcade.enable(road);
    
steen = this.add.sprite(97,0,'steen');
steen.enableBody=true;
physics.arcade.enable(steen);
steen.body.immovable = true;
steen.width = 92;
steen.height = 700;
steen.alpha = 1;
...

 

Hello! Thanks for your response, but that also won't work....

I don't understand why it won't response to game.physics.arcade.collide(..,..); I did this a few times before, but there it worked. 

Link to comment
Share on other sites

http://funs2.com/funs2/games/ex/car_ex/

<html>
<head>
<title>
Car Example
</title>
    <meta charset="utf-8">
    <meta name="landscape" content="user-scalable=0, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, minimal-ui=1">
    <script type="text/javascript" src="js/phaser6.2.min.js"></script>
    
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div align="center">
    <div id="pgame"></div>   
</div>
<div id="wrongWay"></div>
<script>
var game= new Phaser.Game(this.window.innerWidth, this.window.innerHeight, Phaser.AUTO, "pgame",{preload: preload, create: create, update: update});

function preload()
{
    this.load.image('road','as/road.jpg');
    this.load.image('steen','as/steen.jpg');
    this.load.image('steen1','as/steen.jpg');
    this.load.image('auto','as/auto.jpg');
    this.load.image('melon','as/melon.jpg');
    this.load.image('turtle', 'as/turtle.jpg');
}
    
function create()
{
    this.physics.startSystem(Phaser.Physics.ARCADE);
    this.physics.arcade.gravity.y = 0;
    
    this.road = this.add.tileSprite(0,0,1250,700,'road');
    this.physics.arcade.enable(this.road);
    
    this.steen = this.add.sprite(97,0,'steen');
    this.steen.enableBody=true;
    this.physics.arcade.enable(this.steen);
    this.steen.body.immovable = true;
    this.steen.width = 92;
    this.steen.height = 700;
    this.steen.alpha = 1;
    //this.steen.body.allowGravity = false;
    this.steen1 = this.add.sprite(1078,0,'steen1');
    this.steen1.enableBody=true;
    this.physics.arcade.enable(this.steen1);
    this.steen1.body.immovable = true;
    this.steen1.width = 92;
    this.steen1.height = 700;
    this.steen1.alpha = 1;
    
    this.turtle = this.add.sprite(546,400,'turtle');
    this.turtle.enableBody=true;
    this.physics.arcade.enable(this.turtle);
    this.turtle.width = 162;
    this.turtle.height = 226;
    this.turtle.body.allowGravity = false;
    
    this.melon = this.add.sprite(830,100,'melon');
    this.physics.arcade.enable(this.melon);
    this.melon.body.immovable = true;
    this.melon.anchor.setTo(0.5);
    this.melon.scale.setTo(0.3);
    
    this.auto = this.add.sprite(440,0,'auto');
    this.physics.arcade.enable(this.auto);
    this.auto.anchor.setTo(0.5);
    this.auto.scale.setTo(0.3);
    this.auto.body.immovable = true;
    
    this.controls = {
          right: this.input.keyboard.addKey(Phaser.Keyboard.D),
          left: this.input.keyboard.addKey(Phaser.Keyboard.A),
          
        };
}
    
function update()
{
    this.road.tilePosition.y += 3;
    if (this.controls.left.isDown){
      this.turtle.body.velocity.x = -200;  
    }

    if (this.controls.right.isDown){
        this.turtle.body.velocity.x = 200;
    }
    
    this.auto.body.velocity.y = 200;
    this.melon.body.velocity.y = 100;
    
    this.physics.arcade.collide(this.turtle,this.melon,function(){alert("a melon!");this.melon.kill();},null,this);
    this.physics.arcade.collide(this.turtle,this.auto,function(){alert("gameover!");this.state.restart();},null,this);
    this.physics.arcade.collide(this.steen,this.turtle);
    this.physics.arcade.collide(this.steen1,this.turtle);
}
</script>
</body>
</html>

 

Link to comment
Share on other sites

13 hours ago, rufflezs said:

http://funs2.com/funs2/games/ex/car_ex/


<html>
<head>
<title>
Car Example
</title>
    <meta charset="utf-8">
    <meta name="landscape" content="user-scalable=0, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, minimal-ui=1">
    <script type="text/javascript" src="js/phaser6.2.min.js"></script>
    
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div align="center">
    <div id="pgame"></div>   
</div>
<div id="wrongWay"></div>
<script>
var game= new Phaser.Game(this.window.innerWidth, this.window.innerHeight, Phaser.AUTO, "pgame",{preload: preload, create: create, update: update});

function preload()
{
    this.load.image('road','as/road.jpg');
    this.load.image('steen','as/steen.jpg');
    this.load.image('steen1','as/steen.jpg');
    this.load.image('auto','as/auto.jpg');
    this.load.image('melon','as/melon.jpg');
    this.load.image('turtle', 'as/turtle.jpg');
}
    
function create()
{
    this.physics.startSystem(Phaser.Physics.ARCADE);
    this.physics.arcade.gravity.y = 0;
    
    this.road = this.add.tileSprite(0,0,1250,700,'road');
    this.physics.arcade.enable(this.road);
    
    this.steen = this.add.sprite(97,0,'steen');
    this.steen.enableBody=true;
    this.physics.arcade.enable(this.steen);
    this.steen.body.immovable = true;
    this.steen.width = 92;
    this.steen.height = 700;
    this.steen.alpha = 1;
    //this.steen.body.allowGravity = false;
    this.steen1 = this.add.sprite(1078,0,'steen1');
    this.steen1.enableBody=true;
    this.physics.arcade.enable(this.steen1);
    this.steen1.body.immovable = true;
    this.steen1.width = 92;
    this.steen1.height = 700;
    this.steen1.alpha = 1;
    
    this.turtle = this.add.sprite(546,400,'turtle');
    this.turtle.enableBody=true;
    this.physics.arcade.enable(this.turtle);
    this.turtle.width = 162;
    this.turtle.height = 226;
    this.turtle.body.allowGravity = false;
    
    this.melon = this.add.sprite(830,100,'melon');
    this.physics.arcade.enable(this.melon);
    this.melon.body.immovable = true;
    this.melon.anchor.setTo(0.5);
    this.melon.scale.setTo(0.3);
    
    this.auto = this.add.sprite(440,0,'auto');
    this.physics.arcade.enable(this.auto);
    this.auto.anchor.setTo(0.5);
    this.auto.scale.setTo(0.3);
    this.auto.body.immovable = true;
    
    this.controls = {
          right: this.input.keyboard.addKey(Phaser.Keyboard.D),
          left: this.input.keyboard.addKey(Phaser.Keyboard.A),
          
        };
}
    
function update()
{
    this.road.tilePosition.y += 3;
    if (this.controls.left.isDown){
      this.turtle.body.velocity.x = -200;  
    }

    if (this.controls.right.isDown){
        this.turtle.body.velocity.x = 200;
    }
    
    this.auto.body.velocity.y = 200;
    this.melon.body.velocity.y = 100;
    
    this.physics.arcade.collide(this.turtle,this.melon,function(){alert("a melon!");this.melon.kill();},null,this);
    this.physics.arcade.collide(this.turtle,this.auto,function(){alert("gameover!");this.state.restart();},null,this);
    this.physics.arcade.collide(this.steen,this.turtle);
    this.physics.arcade.collide(this.steen1,this.turtle);
}
</script>
</body>
</html>

 

Wow.... thank you very very much! It works! Why did you add 'this' in the whole code? And can I split the sentence below for example in a sentence and a function?

this.physics.arcade.collide(this.turtle,this.melon,function(){alert("a melon!");this.melon.kill();},null,this);
 

And does anybody has an idea of how to drive cars from y = 0 to y = 1000 at different positions the whole time? I want to make a game where you have to avoid cars, because if you collide with them then it's game over. (Rival Rush, Flappy bird). Do you have good ideas of how to make that? 

 

Link to comment
Share on other sites

You really dont need to use "this." in this example, you can take it off... As the example runs inside the game object, the "this." keyword is used most of the times here to replace the "game." keyword, as you can see in comparisson to your code... As as we dont have more objects here there is no reason to use it, but I don't like to use global vars for some reason... :P

Yes, you can replace the code:

function(){alert("a melon!");this.melon.kill();}

For a normal function(as you did in your code). This is a anonymous function and I some use it to avoid to write a new function for the test.

For the cars spawn you probably will need randoms (to spawn in different positions) and groups(to make a group of cars and recycle them, if you need multiple cars on the screen). I think this examples can help you to start.

http://phaser.io/examples/v2/misc/random-generators

http://phaser.io/examples/v2/groups/recycling

Link to comment
Share on other sites

Hello,

I am sorry, but a new question :wacko:.

I just add a code a car appears the whole time on a screen, but know I want to have the cars every time on one of these numbers 150, 300, 450, 600. There may also appear more cars, so two or three at the same time or just one, that doesn't matter. 

The other thing is that the collision, which we discussed in earlier comments, they disappear. It won't work anymore?

Does anybody knows a solution for the collision problem and the cars problem? Sorry if my questions are annoying :unsure:

 

var road;
var turtle;
var steen;
var steen1;
var cursors;
var controls = {};
var auto;
var melon;
var rect;
var car;

 

var playState = {
    preload: function(){
        this.load.image('turtle',     'assets/turtles.png');
        this.load.image('road',     'assets/road.png');
        this.load.image('steen',    'assets/steen.jpg');
        this.load.image('steen1',    'assets/steen.jpg');
        this.load.image('auto',     'assets/car.png');
        this.load.image('car',     'assets/car.png');
        this.load.image('melon',     'assets/watermelon.png');
        
    },

    create:function(){
    this.physics.startSystem(Phaser.Physics.ARCADE);
    this.physics.arcade.gravity.y = 0;

    this.road = this.add.tileSprite(0,0,1250,700,'road');
    this.physics.arcade.enable(this.road);

    this.steen = this.add.sprite(25,0,'steen');
    this.steen.enableBody = true;
    this.physics.arcade.enable(this.steen);
    this.steen.body.immovable = true;
    this.steen.width = 92;
    this.steen.height = 700;
    this.steen.alpha = 0;

    this.steen1 = this.add.sprite(889,0,'steen1');
    this.steen1.enableBody = true;
    this.physics.arcade.enable(this.steen1);
    this.steen1.body.immovable = true;
    this.steen1.width = 92;
    this.steen1.height = 700;
    this.steen1.alpha = 0;
    
    this.turtle = this.add.sprite(440,450,'turtle');
    this.turtle.enableBody = true;
    this.physics.arcade.enable(this.turtle);
    this.turtle.anchor.setTo(0.5);
    this.turtle.scale.setTo(0.2);
    this.turtle.body.allowGravity = false;
    this.turtle.body.immovable = true;
    
    this.melon = this.add.sprite(830,100,'melon');
    this.physics.arcade.enable(this.melon);
    this.melon.body.immovable = true;
    this.melon.anchor.setTo(0.5);
    this.melon.scale.setTo(0.2);
    
     //this.auto = this.add.sprite(200,0,'auto');
    // this.physics.arcade.enable(this.auto);
     //this.auto.anchor.setTo(0.5);
    // this.auto.scale.setTo(0.3);
    // this.auto.body.immovable = true;
    
    this.controls = {
          right: this.input.keyboard.addKey(Phaser.Keyboard.D),
          left: this.input.keyboard.addKey(Phaser.Keyboard.A),   
        };


    this.cars = game.add.group(); 
    this.timer = game.time.events.loop(4000, this.addRowOfPipes, this); 

    },

    update:function(){
   this.road.tilePosition.y += 3;
   this.turtle.body.collideWorldBounds = true;
   this.turtle.body.velocity.x = 0;
   
    
    if (this.controls.left.isDown){
      this.turtle.body.velocity.x = -300;  
    }

    if (this.controls.right.isDown){
        this.turtle.body.velocity.x = 300;
    }

 


    this.physics.arcade.collide(this.turtle,this.cars,this.gameover,null,this);
    // this.auto.body.velocity.y = 200;

    this.physics.arcade.collide(this.turtle,this.melon,function(){this.melon.kill();},null,this);
    this.melon.body.velocity.y = 100;

    this.physics.arcade.collide(this.turtle, this.steen);
    this.physics.arcade.collide(this.turtle, this.steen1);
        
    },

    addOnePipe: function(x, y) {
    var car = game.add.sprite(130, -250, 'car');

    this.cars.add(car);

    car.scale.setTo(0.3);
    game.physics.arcade.enable(car);
    car.body.velocity.y = 200; 
    car.checkWorldBounds = true;
    car.outOfBoundsKill = true;
    car.body.immovable = true;
    },

    addRowOfPipes: function() {
    // Randomly pick a number between 1 and 5
    // This will be the hole position
    var hole = Math.floor(Math.random() * 5) + 1;

    // Add the 6 pipes 
    // With one big hole at position 'hole' and 'hole + 1'
    for (var i = 0; i < 4; i++)
        if (i != hole && i != hole + 1) 
            this.addOnePipe(i, 10000); 
    },


    collectMelon:function(){
        melon.kill();


    },

    gameover:function(){
        game.state.start('over');

    },


    Finish:function(){
        game.state.start('win');
    }


};

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

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