Camera following player jerky movement

(André Perdigão) #1

I’m trying to get a camera following a player. Not a completely static camera where the player is exactly in the middle of the screen and always stays there. I’m looking for a camera that follows the player in a sense that is a little bit elastic meaning the player is not in the center at all times.

I’ve been dealing with this for some time and can’t get it right. I’ve tried the following 2 approaches but there’s some jerky movement when the player is travelling diagonally and some text placed fixed on the screen (like an HUD) isn’t quite fixed because when the camera switches directions or goes diagonally you can notice a few pixels shifting in the text.

public function followPlayer1():void
{	
    var dist:Number = FP.distance(Globals.player.x - (FP.screen.width / 2), Globals.player.y - (FP.screen.height / 2), FP.camera.x, FP.camera.y);
    var spd:Number = dist / 10;
		
    FP.stepTowards(this, Globals.player.x - (FP.screen.width / 2) + 0, Globals.player.y - (FP.screen.height / 2), spd);

    FP.camera.x = x;
    FP.camera.y = y;
}		
	
public function followPlayer2():void
{
    FP.camera.x = int(FP.camera.x - (FP.camera.x - (Globals.player.x - FP.halfWidth)) * FP.elapsed * cameraSpeed);
    FP.camera.y = int(FP.camera.y - (FP.camera.y - (Globals.player.y - FP.halfHeight)) * FP.elapsed * cameraSpeed);
}

// none of them are quite working well

Player is being updated is the following way:

var moveX:Number = this._velocity.x * FP.elapsed;
var moveY:Number = this._velocity.y * FP.elapsed;

moveBy(moveX, moveY, this._collisionTypes);

The HUD (entity) is updating the following way:

override public function update():void
{
    x = FP.camera.x + xScreen;
    y = FP.camera.y + yScreen;
}

What’s wrong (in either the camera follow functions) and how to deal with it? I know they’re rounding errors but i cant seem to fix it…

EDIT: I’m using variable frame time and FPS set to 60;

(rostok) #2

here’s my solution

World class:

		public function setCamera(factor:Number=0.075):void 
		{
			if (!entityToFollow) return;
			if (Math.abs(entityToFollow.x - FP.halfWidth - camera.x) < 5 || 
				Math.abs(entityToFollow.y - FP.halfHeight - camera.y) < 5) factor = 1;
			camera.x = int(FP.lerp( camera.x, entityToFollow.x - FP.halfWidth , factor));
			camera.y = int(FP.lerp( camera.y, entityToFollow.y - FP.halfHeight, factor));
		}
		
		override public function update():void
		{
				super.update();
				setCamera(cameraFollowFactor);
		}