How to run 2 java sketches in a single window

Hello, I need to run two independent sketches in a single window. Is there any way to divide the window into 2 frames and run each sketch in a frame?

Processing is capable of handling multiple windows, so you could therefore create an extra PWindow instance which we can then display data to.

PWindow win;

public void settings() {
  size(690, 700);
  
}

void setup() { 
  win = new PWindow(width-5,0,width,700,"Second Window");
  surface.setLocation(-5, 0);
}

void draw() {
  background(255, 0, 0);
  fill(255);
  rect(10, 10, frameCount, 10);
}

void mousePressed() {
  println("mousePressed in primary window");
}  
class PWindow extends PApplet {
  int x,y,w,h;
  boolean setLocation,setTitle,makeResizable;
  String title;
  
  PWindow() {
    super();
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  };
  
  PWindow(int x_,int y_) {
    super();
    x = x_;
    y = y_;
    setLocation = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  };
  
  PWindow(int x_,int y_,int ww, int hh) {
    super();
    x = x_;
    y = y_;
    w = ww;
    hh = hh;
    
    setLocation = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }
  
  PWindow(int x_,int y_,int ww,int hh,String s) {
    super();
    x = x_;
    y = y_;
    w = ww;
    h = hh;
    setLocation = true;
    title = s;
    setTitle = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }
  
  PWindow(int x_,int y_, String s, boolean k) {
    super();
    x = x_;
    y = y_;
    setLocation = true;
    title = s;
    setTitle = true;
    makeResizable = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }
  

  void settings() {
    if(w>0&&h>0)size(w, h);
    else size(500, 200);
  }

  void setup() {
    background(150);
    if(setLocation)surface.setLocation(x, y);
    if(setTitle)surface.setTitle(title);
    if(makeResizable)surface.setResizable(true);
  }

  void draw() {
    ellipse(random(width), random(height), random(50), random(50));
  }

  void mousePressed() {
    println("mousePressed in secondary window");
  }
}
1 Like

Yes it maybe possible to run the two sketches in the same window but it depends on the complexity of the sketches and on your programming skill level.

1 Like

Thank you for your help. I would consider this option of having 2 windows next to each others, as if it a single window, if I am not able to run both of the sketches in the same window.

The first sketch is about processing real time images captured by camera.
the second sketch is audio processing. It displays the amplitude in real time and i intend to add the FFT analysis too.

Actually, I have started working with processing 2 months ago, but i have a background working with Java.

Please if you have any suggestions how to do it, I will be happy to try them.

Why do you have to have two sketches in one window, im not sure if what you want is doable but it also seems impractical a sketch is a papplet object, and therefore is bound by its canvas. We can create other windows which further instance papplet but again they are bound by their canvas.

Now you can add more cangases to a singular sketch and draw those within tue sketch canvas and therefor display to different programs on each, but that means using one sketch.

Can you elaborate on your program, and why it must make use of two sketch instances.

I can totally understand the use case - for example making a “slideshow” of sketches in one window. When I did something similar, I refactored the code so that sketchA becomes a class that outputs the result to a PGraphics, and the main sketch renders the PGraphics in the order depending on the scene.

But if you are only working with 2 specific sketches and not intended to use more sketches in the same project, I would forget about those generic classes and simply try to merge 2 sketches manually.

1 Like

so something like this? Here I am using surface.setVisible (false); the sketch window is closed but the draw function is still running in the background and I get the pixels to a PImage which is drawn in the main sketch.

So then we can create 2 new windows, instance them in setup with the required location and width.

You suggested a similar approach with a PGraphics object, but I didnt quite understand how you retrieve the pixels as get doesnt work, and simply assigning the pixels array from one canvas to another returns nullPointer despite the fact that I use loadPixels() first.

import java.awt.Frame;
import processing.awt.PSurfaceAWT;
import processing.awt.PSurfaceAWT.SmoothCanvas;
PWindow win;

public void settings() {
  size(690, 700);
  
};

void setup() { 
  win = new PWindow(width-5,0,width/2,height,"Second Window");
  surface.setLocation(-5, 0);
};

void draw() {
  background(255, 0, 0);
  fill(255);
  rect(10, 10, frameCount, 10);
  if(win.canvas!=null)image(win.canvas,width/2,0);
};

void mousePressed() {
  println("mousePressed in primary window");
};
class PWindow extends PApplet {
  int x,y,w,h;
  boolean setLocation,setTitle,makeResizable;
  String title;
  PImage canvas;
  color bg = color(random(255),random(255),random(255));
  
  PWindow() {
    super();
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
    
  };
  
  PWindow(int x_,int y_) {
    super();
    x = x_;
    y = y_;
    setLocation = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
    
  };
  
  PWindow(int x_,int y_,int ww, int hh) {
    super();
    x = x_;
    y = y_;
    w = ww;
    h = hh;
    
    setLocation = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  };
  
  PWindow(int x_,int y_,int ww,int hh,String s) {
    super();
    x = x_;
    y = y_;
    w = ww;
    h = hh;
    setLocation = true;
    title = s;
    setTitle = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
    
  };
  
  PWindow(int x_,int y_, String s, boolean k) {
    super();
    x = x_;
    y = y_;
    setLocation = true;
    title = s;
    setTitle = true;
    makeResizable = true;
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  };
  

  void settings() {
    if(w>0&&h>0)size(w, h);
    else size(500, 200);
  };

  void setup() {
    background(150);
    if(setLocation)surface.setLocation(x, y);
    if(setTitle)surface.setTitle(title);
    if(makeResizable)surface.setResizable(true);
    surface.setVisible (false);
  };

  void draw() {
    background(bg);
    ellipse(random(width), random(height), random(50), random(50));
    fill(255);
    text(frameRate,20,20);
    canvas = get();
  };

  void mousePressed() {
    println("mousePressed in secondary window");
    closeWindow();
  };
  
  void closeWindow(){
    Frame frame = ( (SmoothCanvas) ((PSurfaceAWT)surface).getNative()).getFrame();
    frame.dispose();
  };
};

The project is to have kind of HMI, which should have one window that displays the progress of certain variables in order to evaluate the functioning of a product.

Actually, I need to develop two more sketches, so I will have 4 sketches that should run in parallel.

Could you please explain more about your project, was it about changing the display according to certain conditions or having different displays in the same window.

it’s nothing complicated but refactoring - basically something like this

class Scene1 {
  PGraphics pg;
  Scene1 () {
    pg = createGraphics(400, 400);
  }
  
  void draw() {
    float t = millis() * 0.001;
    pg.beginDraw();
    pg.background(0);
    float r = map(sin(t), -1, 1, 100, 300);
    pg.ellipse(pg.width / 2, pg.height / 2, r, r);
    pg.endDraw();
  }
}

class Scene2 {
  PGraphics pg;
  Scene2 () {
    pg = createGraphics(400, 400);
  }
  
  void draw() {
    float t = millis() * 0.001;
    pg.beginDraw();
    pg.background(0);
    pg.rectMode(CENTER);
    pg.translate(pg.width / 2, pg.height / 2);
    pg.rotate(t);
    pg.rect(0, 0, 100, 100);
    pg.endDraw();
  }
}

Scene1 s1;
Scene2 s2;
void setup() {
  size(800, 400);
  s1 = new Scene1();
  s2 = new Scene2();
}

void draw() {
  s1.draw();
  s2.draw();
  image(s1.pg, 0, 0);
  image(s2.pg, 400, 0);
}

Thank you for sharing.
I will try to merge them manually.