Event called when canvas is resized

Hi,

Is there an event that is called when the canvas is resizable, and the canvas is resized? In p5.js there’s windowResized(), but I can’t seem to find anything for Processing besides using the native Java functions.

Thanks!

2 Likes

As far as I know there’s no built in methods in Processing that have the same functionality of windowResized() but there maybe a library that I don’t know of that makes this easier.

Edit: I looked into this more and found there has been talk of adding a resize() method to Processing however no one has implemented it because it’s difficult to account for all the different renders. I suspect this is also the reason no one has added a windowResized() method.

1 Like

Thanks for your quick reply! :slight_smile:

I’ll probably just use the standard Java way of doing it then, hopefully, in the future they’ll add an event.

1 Like

not sure why a event is needed,
if you make a resizable sketch you just check if it changed
the easy way

// example / demos / test / resize /

int mywidth=500, myheight=400;

void settings() {
  //  fullScreen();
  size(mywidth, myheight);
}


void setup() {
  //  size(400, 400);
  surface.setResizable(true);
  surface.setTitle("myTitle");
}

void draw() {
  background(255, 0, 0);
  ellipse(width/2, height/2, 100, 50); 
  if ( check_window() ) {
    println(" window changed to w: "+width+" h: "+height);
    mywidth = width;
    myheight = height;
  }
}

boolean check_window() {
  boolean changed = false;
  if ( mywidth != width )   changed = true;
  if ( myheight != height ) changed = true;
  return changed;
}


2 Likes

I was considering doing something like that before, but if the frame rate of the program is low, it might not check often enough.

I was looking for a solution just like the p5.js event, but since there doesn’t seem to be one, I’ll probably use it.

Thanks!

hi,
i try to compare processing and p5.js
and not see a problem,
processing resize window resize window and canvas
p5.js has the need of the event function.

// https://discourse.processing.org/t/event-called-when-canvas-is-resized/6643

int mywidth=500, myheight=400;

void settings() {
  //  fullScreen();
  size(mywidth, myheight);
}


void setup() {
  //  size(400, 400);
  surface.setResizable(true);
  surface.setTitle("myTitle");
}

void draw() {
  background(200, 0, 0);
  draw_obj();
  if ( check_window() ) {
    println(" window changed to w: "+width+" h: "+height);
    mywidth = width;
    myheight = height;
  }
}

boolean check_window() {
  boolean changed = false;
  if ( mywidth != width )   changed = true;
  if ( myheight != height ) changed = true;
  return changed;
}


void draw_obj(){
  translate(width / 2, height / 2);
  fill(0,0,200);
  ellipse(0,     0,        80,          50);
  fill(200,200,0);
  ellipse(50,   50, width / 5, height / 10);  // test where object size depends on windows
}

like
https://editor.p5js.org/kll/sketches/SkZFY5Qg4

// https://discourse.processing.org/t/event-called-when-canvas-is-resized/6643

function setup() {
//  createCanvas(windowWidth, windowHeight);
  createCanvas(200,200);
}

function draw() {
  background(200, 0, 0);
  draw_obj();
}

function windowResized() {
  resizeCanvas(windowWidth, windowHeight); // disable that for test
  print(" windowinfo width: " + width + " height: " + height + " windowWidth " + windowWidth + " windowHeight " + windowHeight);
}

function draw_obj(){
  translate(width / 2, height / 2);
  fill(0,0,200);
  ellipse(0,     0,        80,          50);
  fill(200,200,0);
  ellipse(50,   50, width / 5, height / 10);  // test where object size depends on windows
}

but i see possible conflicts about:
p5.js window resize or browser zoom

add, anyhow for resizable sketches must plan
carefully if want use objects what size depends on
that settings, so i make a example with

  • a fix radius and
  • a window dependable radius
1 Like

This shows the same approach using pre().

Kf

2 Likes

Hi @Sarah! Here’s a sketch I’ve been working w/ many months ago. :construction_worker_man:
It’s about creating a class callback which triggers every time the canvas resizes. :robot:
It’s still experimental. :man_scientist: Yet to finish it :100:% . But it’s runnable already: :running_man:

4 Likes

Thanks, that’s what I needed. Can’t wait till it’s finished!

It’s just some more refinements and a Python Mode version too. :innocent:

1 Like