Jump to content

Translucent tiles disappear on scroll


cammil
 Share

Recommended Posts

I seem to have a problem with tiles disappearing when the camera scrolls. The tiles below that have been given an alpha property will disappear when the camera scrolls. I have tested this in Chrome and Firefox. In Chrome the tiles disappear completely. In Firefox, they just blur.

Is this a bug?

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });

function preload() {

game.load.image('ground', 'assets/ground_32.png');

game.load.image('ground2', 'assets/ground2_32.png');

game.load.spritesheet('dude', 'assets/ufo.png');

}

var map;

var map_size_x = 40;

var map_size_y = 40;

var layer1;

var cursors;

var player;

var player_speed = 290;

function create() {

game.stage.backgroundColor = '#2d2d2d';

game.physics.startSystem(Phaser.Physics.ARCADE);

// Creates a blank tilemap

map = game.add.tilemap();

map.addTilesetImage('ground2');

// Creates a new blank layer and sets the map dimensions.

// In this case the map is 40x30 tiles in size and the tiles are 32x32 pixels in size.

layer1 = map.create('level1', map_size_x, map_size_y, 32, 32); // ground

layer2 = map.createBlankLayer('level2',

map_size_x, map_size_y, 32, 32); // objects

// Resize the world

layer1.resizeWorld();

layer1.debug = true;

//layer2.debug = true;

var prob_passable = 0.9;

for(var i=0; i<map_size_x; i++){

for(var j=0; j<map_size_x; j++){

var tile1 = map.putTile(4+20*2, i, j, layer1);

if(Math.random() >= prob_passable){

var tile2 = map.putTile(9+20*9, i, j, layer2);

tile2.setCollision(true, true, true, true);

tile2.alpha = 0.5;

}

}

}

player = game.add.sprite(50, 120, 'dude');

game.physics.arcade.enable(player);

player.body.collideWorldBounds = true;

game.camera.follow(player);

cursors = game.input.keyboard.createCursorKeys();

}

function update() {

game.physics.arcade.collide(player, layer1);

player.body.velocity.x = 0;

player.body.velocity.y = 0;

var dx = 0;

var dy = 0;

if (cursors.left.isDown)

{

dx = -1;

}

else if (cursors.right.isDown){

dx = 1;

}

if (cursors.up.isDown){

dy = -1;

}

else if (cursors.down.isDown){

dy = 1;

}

var d = Math.pow(dx*dx+dy*dy, 0.5);

player.body.velocity.x = player_speed * dx / d;

player.body.velocity.y = player_speed * dy / d;

}

function render() {

//game.debug.bodyInfo(player, 32, 320);

}

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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