PRSoluções

Golandy game - Camera follow and see around the player

Recommended Posts

Hi,

 

On my open-source game Golandy:

http://golandy.prsolucoes.com/

 

I want that the camera follow the player but see around the player and not the player move to top left corner and didnt see around the player or around the map.

Can anyone help me?

The source code of game state is here:

https://github.com/prsolucoes/golandy-web/blob/master/www/js/states/GameState.js

 

Thanks.

 

Screenshot 2017-05-19 20.54.07.png

Share this post


Link to post
Share on other sites

In the past, i only need change the camera. But it is not working more.

 

    var cameraX = Math.round((this.player.sprite.x) - (game.camera.width / 2));
    var cameraY = Math.round((this.player.sprite.y) - (game.camera.height / 2));

    if (cameraX != game.camera.X || cameraY != game.camera.Y) {
        game.camera.bounds = new Phaser.Rectangle(this.player.sprite.x + (game.camera.width / 2), this.player.sprite.y + (game.camera.height / 2), 0, 0);
        game.camera.x = cameraX;
        game.camera.y = cameraY;
    }

Share this post


Link to post
Share on other sites

Hi PRSolucoes,

Easy fix - this line sets the size of your world:

layer.resizeWorld();

But it resizes it to the tilemap layer, this is way the camera is "trapped" within the tilemap.

Instead of using the layer to resize your world do it yourself:

this.game.world.setBounds(-1000, -1000, 2000, 2000);

The map will still start at 0,0 but the camera will be able to show the space to the left and to the top of the map.

Adjust the world size as needed.

 

Share this post


Link to post
Share on other sites

Tried this code too:

 

var layerWidth = context.floorLayer.width * context.floorLayer.scale.x;
var layerHeight = context.floorLayer.height * context.floorLayer.scale.y;

game.world.setBounds(-(layerWidth/2), -(layerHeight/2), layerWidth * 2, layerHeight * 2);

 

And the result is near the same. Attached.

The camera show the out map area. But the map is cutted and the other objects no.

 

Screenshot 2017-05-22 17.10.50.png

Share this post


Link to post
Share on other sites

Hi, layerwidth/layerheight is only the visible (rendered) part of the tilemap - so that's not the way to go to size the word.

Layer.resizeWorld() resizes the world to exactly the tilemap size.

To make it bigger try this:

var layerWidth = context.floorLayer.layer.widthInPixels;
var layerHeight = context.floorLayer.layer.heightInPixels;
game.world.setBounds(-layerWidth, -layerHeight, layerWidth * 2, layerHeight * 2);

 

Share this post


Link to post
Share on other sites

I already tried it.

My current code:

var layerWidth = context.floorLayer.layer.widthInPixels * context.floorLayer.scale.x;
var layerHeight = context.floorLayer.layer.heightInPixels * context.floorLayer.scale.y;

game.world.setBounds(-(layerWidth/2), -(layerHeight/2), layerWidth * 2, layerHeight * 2);

 

And the result:

 

Screenshot 2017-05-22 20.05.32.png

Share this post


Link to post
Share on other sites

The problem now is, that while the world bounds are ok, the tilemap layer (context.floorLayer) only has a width of (in my debugging sesssion) 1280 pixels, while the game (on my browser) has a width of 1920.#

That's the reason it cuts of to the right.

For testing after creating it I set the width to 1920 (via breakpoint + console) and everything looks fine for that session.

I am not sure, why the layer is created with the wrong width - please try to add:

context.floorLayer.width = game.width;

after creating it, and see if this fixes anything for you.

Share this post


Link to post
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...

  • Recently Browsing   0 members

    No registered users viewing this page.