traxtrack

Members
  • Content count

    4
  • Joined

  • Last visited

  1. traxtrack

    Scaling Tilemap

    I am trying to scale things properly but I have huge issues, I read other topics like meine but the solutions did not work out, I cant figure out where my issue is. Thanks in advance guys. 1. So this part of the code makes my bg image look good on any device, but I cant use this to set the image to autoscroll on th Y axis: scaleRatio = window.devicePixelRatio / 3; var road = game.add.image(game.world.centerX, game.world.centerY, 'road'); road.scale.setTo(scaleRatio, scaleRatio); road.anchor.set(0.5); 2. So after some research I am doing this: road = game.add.tileSprite(scaleRatio, scaleRatio, 800, 600, 'road'); road.width = game.world.width; road.height = game.world.height; The problem with this code is that the background image wont scale right on mobile devices. on devices with window.devicePixelRatio == 2 the image will be huge, it wont even resize at all. In case some is wondering this is my config setup: console.log('Game state loaded'); scaleRatio = window.devicePixelRatio / 3; // var carTurnSpeed = 150; var countcars = 0; var car; var obstacleGroup; var canMove = true; var goleftonce = 2; var gorightonce = 2; // OBSTACLES vars var obstacleSpeed = 800; var obstacleDelay = 700; var platforms; var score; // Get device sizes var w = window.innerWidth * window.devicePixelRatio; var h = window.innerHeight * window.devicePixelRatio; var game = new Phaser.Game(w, h, Phaser.CANVAS, '', { render: render, }); game.state.add('boot', bootState); game.state.add('load', loadState); game.state.add('menu', menuState); game.state.add('play', playState); game.state.add('gameover', gameoverState); game.state.start('boot');
  2. traxtrack

    Issue with Obstacle velocity

    Hello, I have an issue which keeps me stuck and I could not yet figure it out after being stuck for quite some time. I have a simple game in which obstacles ( spirtes of other cars) drop down from the top of the screen and I am trying to avoid those with my own car not to crash into them. The issue is that on some mobile devices the cars drop WAY faster than on my own device, I tested this from several different phones, the velocity differs depending on the phone, on some the obstacles drop faster on some they drop really slow. What oculd cause such an issue? I can provide code if it helps. Thanks,
  3. Hey, So I am working on a car game and I have 1 issue with the speed at which car drops. My friend who owns a IPhone s6 complains that on his device the cars drop too fast, while on my Samsung s7 edge the car seems to drop slow enough. I dont know what might cause it. My obstacle velocity is set to 1200; // OBSTACLES vars var obstacleSpeed = 1200; var obstacleDelay = 400; var platforms; var score; And this is my Loop + update function // OBSTACLES OF THE CAR game.time.events.loop(obstacleDelay, function(){ var obstacleSpeed = 1200; var obstacleDelay = 400; for(var i = 0; i < 1; i++){ if(game.rnd.between(0, 1) == 1){ var obstacle = new Obstacle(game, i); obstacle.scale.setTo(scaleRatio, scaleRatio); game.add.existing(obstacle); obstacleGroup.add(obstacle); } } }); // Game on touch move car game.input.onTap.add(function() { if (game.input.x < w / 2 ){ if( canMove && goleftonce == 2 || goleftonce == 1) { canMove = false; goleftonce++; gorightonce--; game.add.tween(car).to({ angle: -30}, 100, Phaser.Easing.Linear.None, true).onComplete.addOnce(function(){ game.add.tween(car).to({ angle: 0}, 100, Phaser.Easing.Linear.None, true); canMove = true; }, this); game.add.tween(car).to({x: car.x - w/3}, 100, Phaser.Easing.Linear.None, true); } } else { if( canMove && gorightonce == 2 || gorightonce == 1) { canMove = false; goleftonce--; gorightonce++; game.add.tween(car).to({ angle: 30}, 100, Phaser.Easing.Linear.None, true).onComplete.addOnce(function(){ game.add.tween(car).to({ angle: 0}, 100, Phaser.Easing.Linear.None, true); canMove = true; }, this); game.add.tween(car).to({x: car.x + w/3}, 100, Phaser.Easing.Linear.None, true); } } }); }, update: function() { // Collide the car and with the obstacles aka other cars game.physics.arcade.collide(car, obstacleGroup, function(){ canMove = true; countcars = 0; goleftonce = 2; gorightonce = 2; game.state.start('gameover'); }); } } // Position where the obstacle spawns Obstacle = function (game) { var position = game.rnd.between(0, 2); Phaser.Sprite.call(this, game, (w/3) * position + 130 , 0, "obstacle"); game.physics.enable(this, Phaser.Physics.ARCADE); }; Obstacle.prototype = Object.create(Phaser.Sprite.prototype); Obstacle.prototype.constructor = Obstacle; Obstacle.prototype.update = function() { this.body.velocity.y = obstacleSpeed; if(this.y > game.height){ countcars++; score.setText("Score: " + countcars); this.destroy(); } };
  4. traxtrack

    PHASER 2 CAR GAME

    Hello, I am at my first game ever and I choose phaser2, latest CE version. Basically I have 3 lanes and I am trying to spawn cars on these lanes, and the player must avoid crashing into them. The game orientation I choose is portrait. I have a few questions that maybe you guys can help me with, if you are willing of course 1. I am using the default Phaser arcade Physics. Should I choose something else? I am unhappy with the collision point between the cars at the moment. 2. On Iphones and tablets I have issues with the scaling. The collision between cars is huge (I am talking about the area of collison). I have this in the index.html <meta name="viewport" content="width=device-width, initial-scale=1"> Then I am using this in my main js. scaleRatio = window.devicePixelRatio / 3; // Get device sizes var w = window.innerWidth * window.devicePixelRatio; var h = window.innerHeight * window.devicePixelRatio; var game = new Phaser.Game(w, h, Phaser.CANVAS, '', { init: init, preload: preload, create: create, update: update, render: render }); function init() { // make the game occuppy all available space, but respecting // aspect ratio – with letterboxing if needed this.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; this.game.scale.pageAlignHorizontally = true; this.game.scale.pageAlignVertically = true; this.game.canvas.style.width = '100%'; this.game.canvas.style.height = '100%'; this.game.scale.refresh(); } // Creating the car car = game.add.group(); // We will enable physics for any object that is created in this group car.enableBody = true; // Designate the car sprite to the VAR car car = game.add.sprite(0 , 0, 'car'); car.anchor.set(0.5); car.scale.setTo(scaleRatio, scaleRatio); game.physics.arcade.enable(car); car.x = game.world.centerX; car.y = game.world.height - car.height; // car.body.collideWorldBounds = true; // car.checkWorldBounds = true; // car.body.bounce.setTo(car.x + w/3, 0); // OBSTACLES obstacleGroup = game.add.group(); obstacleGroup.enableBody = true; obstacleGroup.scale.setTo(scaleRatio, scaleRatio); This would be it from now. If you can pinpoint me to some articles that can help me with my car game or have any advices I would be happy to hear them. Thanks,