I’m currently trying to make a arcade video game, with a vertical scrolling. I use eclipse and processing 3 as a library import into java classes and I don’t face any issue about it.
I now get two variables for screenHeight and screenWeight (768 and 1024).
My map is about 1024x15669
I try to load the map as a background image but i’m facing to a RuntimeException : background image must be the same size as your application. It’s logic, the issue is explicit.
Are you trying to draw the image doing background(img)?
If that’s the case, I think you should be calling image(img, x, y, width, height) instead, and then you change x and y to control which part of the background you want to see, probably using negative numbers to move the background left and up.
Do you actually have a 1024x15669 image file, like a jpg, that you are loading and want to scroll? Or is it many tiles, or are you generating the background image dynamically inside your sketch…?
Here is a very very simple example of a vertical scroller written in PDE (not Eclipse). It demonstrates using translate and the coordinate system to keep track of where you are, then check collision with the viewframe to decide what to render (e.g. only part of a very large graphic, or only certain tiles from a map).
// https://discourse.processing.org/t/processing-3-moving-through-a-map-bigger-than-the-screen/10393/2
// scrolling
PVector view;
PVector scroll;
PImage img;
int ymax = 400;
void setup() {
view = new PVector(0, -20); // starting location
scroll = new PVector (0, 1); // scrolling direction and speed
// example image to place on the map
img = loadImage("https://upload.wikimedia.org/wikipedia/commons/thumb/2/2e/Processing_3_logo.png/480px-Processing_3_logo.png");
img.resize(200,200);
}
void draw() {
background(192);
translate(view.x, -view.y); // align canvas to view
content(); // draw contents
view.add(scroll); // scroll
if (view.y > ymax) {
view.y = -height*1.5; // bounce from end to start
}
}
void content() {
if(view.y + height > 100 && view.y < 100 + img.height ){ // display image if in view
image(img, 20, 100);
}
for (int i=0; i<=ymax; i+=20) { // display lines
if (i > view.y && i < view.y + height + 20) { // ...if in view
line(0, i, width, i);
text(i, 0, i);
}
}
}
