Camera in Processing (ViewPort)

Processing Coding Questions
1

Hello Community Processing.
I want to make a 2D game with a top view, I need the camera to follow the player, but how many times I have not tried it either “floated” or flew away.

2

I worked on a camera class for a processing-based 2D platformer a while ago. May be of use:

1 Like
3

we need to see your code to comment on this

1 Like
4 
int x;
int y;
void setup() {
 fullScreen(OPENGL);
}

void draw() {
  background (0);
  rect(0,0, 5000,5000); //background of game
  beginCamera();
  translate (x, 0);
  endCamera();
  
  println(x);
}

void mousePressed (){
  x+=50;
}
5

The camera() command is mainly meant for 3D purposes.

it’s not really cool for 2D purpose

For 2D

For 2D it’s easier to have a very big background image with path and towns and all.

You then move the image so that the player is always in the center of the screen, and when he’s running around, the background moves. This gives the impression of the camera moving with the player.

for example start with image at -2000,-2000

image ( bigBk, -2000,-2000); // negativ, so the background is far left

when he moves right it’s
image ( bigBk, -2500,-2000);

when he moves left it’s
image ( bigBk, -1000,-2000);
or image ( bigBk, 0,-2000);
or image ( bigBk, 1000,-2000);

so your line of code is just

 `image ( bigBk,  viewPortX, viewPortY);`

Example

This can be used for

  • a side scroller game or

see Side-scrolling video game - Wikipedia

  • an isometric game

see Isometric video game graphics - Wikipedia

ViewPort

this principle is called ViewPort of the game.

see Viewport - Wikipedia

Chrisir

2 Likes
6

Thank you! Im try this method

7

by the way,

from your initial approach:
I quote the reference

For this reason, camera functions should be placed at the beginning of draw() (so that transformations happen afterwards)

from reference and then beginCamera

Working Sketch


int x;
int y;

void setup() {
  fullScreen(OPENGL);
}

void draw() {
  background (0);

  beginCamera();
  camera();
  translate (x, 0);
  endCamera();

  fill(255, 0, 0); 
  rect(0, 0, 5000, 5000); //background of game

  pushMatrix(); 
  translate(width/2, height/2);
  rotateZ(PI/4.0); 
  fill(0, 255, 0); 
  box(133); 
  popMatrix(); 

  println(x);
}

void mousePressed () {
  x += 50;
}
2 Likes