Canvas: How do you make the Canvas as a chase camera for moving objects?

Game Mechanics
#1

Here’s Java-Gaming.org pastebin of my currently managed code.

StoryTime! ::slight_smile:

I have successfully managed to create a simple chase camera. The camera itself is the Canvas. The region of the camera is the region of the Canvas. The camera (Canvas) follows a stationary unit, while other objects move in opposite directions, creating the illusion that the stationary unit is moving and the camera is “chasing” it.

But, a friend of mine points that my simplistic design is a bad design if I were to expand on this. For example, if I were to add lots of objects to my game, I would have to calculate each and every single object. The friend thinks that the Canvas could just follow around the unit itself, while the unit moves around stationary obstacles, making the game more flexible and more easier to code. So I did a rewrite, albeit unsuccessful.

It’s like this diagram shown here:

The trouble I’m having is that, due to some technical difficulties, I can only obtain the center position, (x,y), of the Canvas. The map itself is loaded from a binary file, with everything from trees, to guns, to doors, etc. all fully created in the file. If I were to just load the file, my unit (the purple dot in the diagram) would spawn in at the top left corner.

The main problem, thus the question, is how do I map the Canvas’s center position onto the purple dot all the time?

The hint I’m getting is that, if I can obtain the unit’s position coordinates, then do something I have no clue on, I can then take the results from there, and offset all of the objects. But, wouldn’t that defeat the purpose of what my friend is thinking of? :clue: Thanks in advance.

#2

Is your code what you have now or what you had before your changes?

In either case you’ll need to process most of your objects each render pass (until you add viewport culling).

I would recommend storing the camera position e.g.:


int cameraX;
int cameraY;

Then your main render pass would appear as such:


for (entity <- all entities) {
  int xOffset = entity.x - cameraX;
  int yOffset = entity.y - cameraY;

  draw entity on your Canvas at (Display.width/2 + xOffset, Display.height/2 + yOffset)
}

Now you can either keep your camera stationary (fixed values) or update its position to be the location of your tracked entity each frame.

#3

Very tricky to pull it off, but I managed to successfully implement a working prototype. Thanks! ;D Credit goes to loom_weaver.

Code for Curious:

public void tick(RenderView view) {
		//Accelerometer static class from API
		//(x,y) = Object Position Coordinates
		//(vx,vy) = Vector of Object Velocity
		//RenderView is a subclass of Canvas. Variables "translateX" and "translateY" are
		//camera position.
		vx += Accelero.X * 0.1;
		vy += Accelero.Y * 0.1;
		x += vx;
		y += vy;
		view.translateX = x;
		view.translateY = y;
		vx *= 0.1;
		vy *= 0.1;
	}

	public void render(Canvas c, float translateX, float translateY, final float centerWidth, final float centerHeight) {
		if (bitmap == null || c == null)
			return;
		float xOffset = x - translateX;
		float yOffset = y - translateY;
		move(centerWidth + xOffset, centerHeight + yOffset);
		c.drawBitmap(bitmap, srcRect, dstRect, null);
	}