Hi there, I've already saw questions about this topic and I'm aware there is still not a real solution for this error. I couldn't find a workaround to allow my sketch to run. Wondering if form the community here I can get some help.

FYI what I'll want to achive is a creation of a "wordcloud" where the input is a microphone so that people can interact with it saying the word that will be part of the cloud. Still a work in progress. For now the input is a text file.

Here the code:

import java.util.Iterator;
import java.applet.*; 
import java.awt.*; 
import java.awt.image.*; 
import java.awt.event.*; 
import java.io.*; 
import java.net.*; 
import java.text.*; 
import java.util.*; 
import java.util.zip.*; 
import java.util.regex.*; 

PFont font;
String fontFile = "ArialRoundedMTBold-96.vlw";
int fSize = 96;
int maxSize = 192;
int minSize = 48; 
String wordFile = "processing.txt";

String[] words;
int[]  count;
int most;
int least;
float currentSize;
int currentIndex;

void setup(){
  size(900, 500, P2D);
  colorMode(HSB, TWO_PI, 1, 1, 1);
  rectMode(CORNER);
  background(color(0, 0, 1));
  smooth();
  font = loadFont(fontFile);
  initializeWords();  
  noLoop();

}

void draw() {
  while(currentIndex < words.length) {
    float relsize = map(count[currentIndex],least,most,minSize,maxSize);
    boolean drawn = false;  
    while (!drawn) {
      drawn = drawWord(words[currentIndex], relsize);
      if (!drawn)
       println("redrawing "+words[currentIndex]);
        relsize = relsize * 0.95;
    }
    currentIndex++;
  }  
}

boolean drawWord(String word, float wordSize) {
  int intSize = (int)wordSize;
  textFont(font, wordSize);
  int w = int(textWidth(word));
  PGraphics g = createGraphics(w, intSize, P2D);
  g.beginDraw();
  g.background(color(0, 0, 1, 0));
  g.fill(color(0,0,0));
  g.textAlign(CENTER, CENTER);
  g.translate(w/2, wordSize/2);
  g.scale(wordSize / fSize);
  g.textFont(font);
  g.text(word, 0, 0);
  g.endDraw();

  PGraphics gMask = createGraphics(w, intSize, P2D);
  gMask.beginDraw();
  //gMask.background(color(0, 0, 1, 1));
  gMask.image(g, 0, 0);
  gMask.filter(ERODE);  
  gMask.filter(ERODE);
  gMask.endDraw();

  for (int tries=50; tries>0; tries--) {
    int x = (int)random(width-w);
    int y = (int)random(height-intSize);

    boolean fits = true;
    for (int dx = 0; dx< w && fits; dx++) {
      for (int dy = 0; dy<intSize && fits; dy++) {
        if (brightness(gMask.get(dx, dy))<0.5) {
          if (brightness(get(x+dx, y+dy))<0.5) {
            fits = false;
          }
        }
      }
    }
    if (fits) {
      image(g, x, y);
      return true;
    }
  }
  return false;
}

boolean equalColor(color c1, color c2) {
  String h1 = hex(color(c1));
  String h2 = hex(color(c2));
  return h1.equals(h2);
}


void initializeWords() {
  ArrayList ignore = new ArrayList();
  String[] ignoreStrs  = loadStrings("ignore.txt");
  for (int i = 0; i < ignoreStrs.length; i++) {
    ignore.add(ignoreStrs[i].trim().toUpperCase());
  }
  HashMap wordcount = new HashMap();
  String[] lines = loadStrings(wordFile);
  for (int i = 0; i < lines.length; i++) {
    String[] words = split(lines[i], " ");  
    for (int j = 0; j < words.length; j++)  {
      String word = clean(words[j]).toUpperCase();
      if (word.length() == 0) {
        continue;
      }
      if (ignore.contains(word)) {
        continue;
      }
      Integer count = (Integer)wordcount.get(word); 
      if (count == null) {
         wordcount.put(word, new Integer(1));
       }
       else {
         int newCount = count.intValue() + 1;
         wordcount.put(word, new Integer(newCount));
       }
    }
  }
  words = new String[wordcount.size()];
  count = new int[wordcount.size()];
  int idx = 0;
  Iterator it = wordcount.entrySet().iterator();  // Get an iterator
  while (it.hasNext()) {
      Map.Entry me = (Map.Entry)it.next();
      words[idx] = (String)me.getKey();
      count[idx] = ((Integer)(me.getValue())).intValue();
      idx++;
  }
  sortWords();
  String[] sorted = new String[words.length];
  for (int i = 0; i < words.length; i++) {
    sorted[i] = count[i]+" "+words[i];
  }
  most = count[0];
  least = count[count.length-1];
  //saveStrings("totals.txt", sorted);

}

String clean(String word) {
  word = word.trim();
  if (word.endsWith(".") || word.endsWith(",") || word.endsWith(";"))
    word = word.substring(0, word.length() - 1);
  return word.trim();    
}


void sortWords() {
  boolean changed = true;
  while (changed) {
    boolean madeChange = false;
    for (int i = 0; i < count.length-1; i++) {
      if (count[i] < count[i+1]) {
        int temp = count[i];
        String tempW = words[i];
        count[i] = count[i+1];
        words[i] = words[i+1];
        count[i+1] = temp;
        words[i+1] = tempW;
        madeChange = true;
      }
    }
    changed = madeChange;
  }
}

Info: Processing 3.3.7 macOS High Sierra 10.13.6 Early 2015 Intel Iris Graphics 6100 1536 MB

Thanks

class Player {
  PVector position;
  PVector center;
  PVector up;
  PVector right;
  PVector forward;
  float pan;
  float tilt;
  PVector velocity;
  float angle;
  PVector vel2D;

  Player() {
    center = new PVector(0, 0, 1000);
    position = new PVector(0, 0, 0);
    up = new PVector(0f, 1f, 0f);  
    right = new PVector(0f, 0f, 0f);
    forward = new PVector(0f, 0f, 1f);
    velocity = new PVector(0f, 0f, 0f);
    pan = HALF_PI;
    tilt = 0;
  }


  void update(PGraphics a) {

    float xx = (Float)spaceNavigator.get("x");
    float yy = (Float)spaceNavigator.get("y");
    float zz = (Float)spaceNavigator.get("z");
    float rx = (Float)spaceNavigator.get("rx");
    float ry = (Float)spaceNavigator.get("ry");
    float rz = (Float)spaceNavigator.get("rz");
    float b0 = (Float)spaceNavigator.get("b0");
    float b1 = (Float)spaceNavigator.get("b1");

    pan   -=   ry*0.5;
    tilt  -=  -rx*0.5;

    forward = new PVector(cos(pan), tan(tilt), sin(pan));
    right = new PVector(cos(pan - PI/2), 0, sin(pan - PI/2));

    forward.normalize();

    velocity.add(PVector.mult(forward, (-zz*50.0)));
    velocity.add(PVector.mult(right, (-xx*50.0)));
    velocity.add(PVector.mult(up, (yy*50.0)));

    position.add(velocity);
    velocity.limit(0.5);

    center = PVector.add(position, forward);

    float fov = PI/2;
    float cameraZ = (height/2) / tan(fov);  // when i multiple this fov * 4, 8, the camera clips in different degrees up 180. maybe here is the problem

    a.perspective(fov, float(width)/float(height), 0.1, cameraZ*20);
    a.camera(position.x, position.y, position.z, center.x, center.y, center.z, up.x, up.y, up.z);
    velocity.mult(0);
  }
}

this is finally my player cam. but i have a clip problem on rx`s exes. when i rotate round 180º the image dissapear.. i think is a perspective problem. anybody has an idea? i want free rotating in all exes.

 float fov = PI/2;
        float cameraZ = (height/2) / tan(fov);  // when i multiple this fov * 4, 8, the camera clips in different degrees up 180. maybe here is the problem

translate() moves the canvas origin to 300, 300. It is reset when draw exits. Now image(p, -300, -300) aligns the image to the top corner of the canvas.

p.translate(300, 300) moves the drawing origin of the PGraphics or PImage. No matter where you choose to draw it with image(), all its content is offset by that amount. Now p.rect(-300,-300, 600, 600) aligns a rect to the top corner of the image.

So, you are either moving the piece of paper on the table, or moving where you start drawing on that piece of paper.

Oh thanks, I didn't know that was an option. For some reason, I thought translating functions such as translate, rotate and push and pop affect all PGraphics, along with the main sketch, ergo that they don't require the dot syntax at the beginning.

Hi,

I try to create something like this : https://www.youtube.com/watch?v=YBKkVpRxUfs, using a kinect. At the moment I made some test with something like this :

class User {
  PGraphics pgBodyBg; 
  PImage bodyImg; 
  float colorIndexCounter; 
  int id; 
  ArrayList<DelayImg> bodyImageList = new ArrayList<DelayImg>();
  PGraphics pgTotal; 
  DelayImg[] buffer;

  User(int i) {
    colorIndexCounter=random(10); 
    pgTotal=createGraphics(512, 424);  
    pgTotal.beginDraw(); 
    pgTotal.background(0, 0); 
    pgTotal.endDraw(); 
    buffer=new DelayImg[50];
  }


  void delayEffect() {
    fillBuffer(); 
    changeColor(); 
    display();
  }

  void fillBuffer() {
    PImage bi= bodyImg.copy(); 
    DelayImg di=new DelayImg(bi); 
    for (int i = buffer.length-1; i > 0; i--) {
      buffer[i] = buffer[i-1];
    }
    buffer[0]=di;
  }



  void changeColor() {
    pgTotal.beginDraw(); 
    pgTotal.clear(); 
    pgTotal.pushStyle(); 
    for (int j=buffer.length-1; j>=0; j--) { 
      if (buffer[j]!=null) buffer[j].changeColor(pgTotal);
    }
    pgTotal.popStyle();
    pgTotal.endDraw();
  }

  void display() {
    image(pgTotal, 0, 0);
  }
}



class DelayImg {
  PImage img; 
  float alf=255; 
  PShape shape; 
  PGraphics pgBg; 
  int partSize=200; 
  DelayImg(PImage _img) {
    img=_img; 
    img.filter(THRESHOLD); 
    pgBg=createGraphics(512, 424);
  }

  void display(PGraphics pg) {
    pg.tint(255, alf); 
    pg.image(img, 0, 0); 
    if (alf>0)alf-=0.5;
    else alf=0;
  }

  void changeColor(PGraphics pg) {
    pgBg.beginDraw(); 
    pgBg.background(random(255), random(255), random(255));  
     pgBg.mask(img);
    pgBg.endDraw();
    pg.image(pgBg, 0, 0);
  }
}

bodyImg is update each frame, coming from kinect.

I want to be able to change the color everytime, that why pgTotal is clear every frame and display fresh new images, but the way I do it is very slow (10 fps). Do you have any suggestion, different kind of algorithm to improve frameRate? I try to use some vertex and textures aswell, but no real improvement...

Thanks for your help!

A.

PGraphics p;
void setup() {
  size(600, 600);
  p = createGraphics(600, 600);
  p.beginDraw();
  p.rectMode(CENTER);
  translate(width/2, height/2);
  p.rect(0, 0, 50, 50);
  p.endDraw();
  image(p, 0, 0);
}

I have just begun and I'm already stuck :/

I have a program that requires textSize to increase over time. When running it gradually, i.e. textSize(4),5,6,7,etc., the number can reach a very high value without anything bad happening. However, if I try to start off with a high value (the same number as gradually approached), it throws an OutOfMemory exception:

java.lang.RuntimeException: java.lang.OutOfMemoryError: Java heap space at processing.opengl.PSurfaceJOGL$2.run(PSurfaceJOGL.java:484) at java.lang.Thread.run(Thread.java:745) Caused by: java.lang.OutOfMemoryError: Java heap space at java.awt.image.DataBufferInt.(DataBufferInt.java:75) at java.awt.image.Raster.createPackedRaster(Raster.java:467) at java.awt.image.DirectColorModel.createCompatibleWritableRaster(DirectColorModel.java:1032) at java.awt.image.BufferedImage.(BufferedImage.java:324) at processing.core.PFont.(PFont.java:232) at processing.core.PFont.(PFont.java:337) at processing.core.PGraphics.createFont(PGraphics.java:4078) at processing.core.PApplet.createFont(PApplet.java:6254) at processing.core.PApplet.createDefaultFont(PApplet.java:6188) at processing.core.PGraphics.defaultFontOrDeath(PGraphics.java:8219) at processing.core.PGraphics.textSize(PGraphics.java:4391) at processing.core.PApplet.textSize(PApplet.java:12688) at recaman.draw(recaman.java:150) at processing.core.PApplet.handleDraw(PApplet.java:2418) at processing.opengl.PSurfaceJOGL$DrawListener.display(PSurfaceJOGL.java:907) at jogamp.opengl.GLDrawableHelper.displayImpl(GLDrawableHelper.java:692) at jogamp.opengl.GLDrawableHelper.display(GLDrawableHelper.java:674) at jogamp.opengl.GLAutoDrawableBase$2.run(GLAutoDrawableBase.java:443) at jogamp.opengl.GLDrawableHelper.invokeGLImpl(GLDrawableHelper.java:1293) at jogamp.opengl.GLDrawableHelper.invokeGL(GLDrawableHelper.java:1147) at com.jogamp.newt.opengl.GLWindow.display(GLWindow.java:759) at com.jogamp.opengl.util.AWTAnimatorImpl.display(AWTAnimatorImpl.java:81) at com.jogamp.opengl.util.AnimatorBase.display(AnimatorBase.java:452) at com.jogamp.opengl.util.FPSAnimator$MainTask.run(FPSAnimator.java:178) at java.util.TimerThread.mainLoop(Timer.java:555) at java.util.TimerThread.run(Timer.java:505)

Any help would be appreciated.

Amazing.... we are getting much closer...

Regenerating the manifest didn't help...

Running the sample code did work.

And then modifying the stream as you suggested got us much closer.

The app launches on the device for a moment and then errors and quits with the following message...

FATAL EXCEPTION: GLThread 1202 Process: processing.test.pixelpetal_v09, PID: 12673 java.lang.NullPointerException: src == null at java.lang.System.arraycopy(Native Method) at processing.opengl.PGraphicsOpenGL.setImpl(Unknown Source) at processing.core.PImage.set(Unknown Source) at processing.opengl.PGraphicsOpenGL.backgroundImpl(Unknown Source) at processing.core.PGraphics.background(Unknown Source) at processing.core.PApplet.background(Unknown Source) at processing.test.pixelpetal_v09.pixelpetal_v09.draw(pixelpetal_v09.java:247) at processing.core.PApplet.handleDraw(Unknown Source) at processing.opengl.PGLES$AndroidRenderer.onDrawFrame(Unknown Source) at android.opengl.GLSurfaceView$GLThread.guardedRun(GLSurfaceView.java:1522) at android.opengl.GLSurfaceView$GLThread.run(GLSurfaceView.java:1239)

Thanks Kfrajer, I tried the code and got errors while compiling...

3. ERROR in /private/var/folders/71/whbl6c5x08gczcqq00k33m4w0000gn/T/android317694126990055572sketch/src/processing/test/pixelpetal_v09/pixelpetal_v09.java (at line 354)
    stream =  surface.getAssets().open(filename); //new FileInputStream(filename);//createInput(filename);
              ^^^^^^^
surface cannot be resolved
----------
3 problems (1 error, 2 warnings)

BUILD FAILED
/var/folders/71/whbl6c5x08gczcqq00k33m4w0000gn/T/android317694126990055572sketch/build.xml:15: The following error occurred while executing this line:
/var/folders/71/whbl6c5x08gczcqq00k33m4w0000gn/T/android317694126990055572sketch/build.xml:28: Compile failed; see the compiler error output for details.

Total time: 1 second

And here is my sketch....

Any ideas?

Thanks again.

Phil

`
import com.heroicrobot.dropbit.registry.*;
import com.heroicrobot.dropbit.devices.pixelpusher.Pixel;
import com.heroicrobot.dropbit.devices.pixelpusher.Strip;
import java.util.*;
import controlP5.*;
import java.io.*;
import android.graphics.*;


Button myButton1;
Button myButton2;
Button myButton3;
Button myButton4;
Button myButton5;
Button myButton6;
Button myButton7;
Button myButton8;
Button myButton9;
Button myButton10;
Button myButton11;


boolean noStrips = true;
int buttonYpos = 0;

ControlP5 cp5;

// Set this to true to enable a debug display of the current frame.
boolean onscreenDebug = true;

int currentFrame = 0;

// setup file path a durations for the image sequences

String[] pathBases = {"null", "black", "grad", "buddah", "wipe", "orange", "embers", "psych", "petals", "sunrise", "smoke", "allseq"};
int[] durations =     {0,   1,   2000,  1500, 1250, 750, 500, 1000, 1000, 1000, 240,  9704};
int[] buttonOffsets = {0,   250, 350,   450,  550,  650, 750, 850,  950,  1050, 1150, 1250};

String pathBase = pathBases[1]; // set start patern to "all off"
int numFrames = durations[1];
int whichMovie=1;

PImage mainMovie;



DeviceRegistry registry;
PusherObserver observer;
PGraphics offScreenBuffer;
PImage bg;
PImage errorScreen;
PImage loadingScreen;


// flags to control whether we redraw the UI
boolean uiChanged = true;

int Yoffset = -50; // this helps me quickly modify the position of the buttons 

ArrayList<PImage[]> imageSequences;


PImage[] loadImageSequence(String basename, int numFrames) {
  // create the array of references
  println("Loading image sequence "+basename+", "+numFrames+" frames.");
  PImage[] imageSequence = new PImage[numFrames];

  // now loop over the sequence loading them
  for (int i=0; i<numFrames; i++) {
    String imageName = "sequences/" + basename + "_pixelData/pixelData" + nf(i, 5) + ".png";
    imageSequence[i] = loadImage(imageName);
    println("Image "+imageName+" was loaded as "+imageSequence[i]);
  }
  return imageSequence;
}

void setup() {
  size(800, 1280, P3D); // Must be first in setup()

  // Load all our images.  

  imageSequences= new ArrayList<PImage[]>();
  // Add a null object to compensate for the 1-based numbering.
  imageSequences.add(null);

  // Load each image sequence and add it to the ArrayList  
  for (int i=1; i<pathBases.length; i++) {
    imageSequences.add(loadImageSequence(pathBases[i], durations[i]));
  }

  bg = loadImage("UI_Background.jpg");
  errorScreen = loadImage("noLEDSs.jpg");
  loadingScreen = loadImage("noLEDSs.jpg");

  stroke(255);
  noFill();
  strokeWeight(4); 

  cp5 = new ControlP5(this); // 

  cp5.setAutoDraw(false);

  frameRate(24);

  // create a new buttons for the UI

  myButton1 = cp5.addButton("alloff")

    .setCaptionLabel("All Off")
      .setValue(0)
        .setPosition(100, 250+Yoffset)
          .setSize(500, 60)

            ;

  myButton2 = cp5.addButton("grad")

    .setCaptionLabel("Color Grad")
      .setValue(0)
        .setPosition(100, 350+Yoffset)
          .setSize(500, 60)

            ;

  myButton3 = cp5.addButton("buddah")

    .setCaptionLabel("Pink Buddah")
      .setValue(0)
        .setPosition(100, 450+Yoffset)
          .setSize(500, 60)

            ;

  myButton4 = cp5.addButton("colorwipe")
    .setCaptionLabel("Color Wipe")
      .setValue(0)
        .setPosition(100, 550+Yoffset)
          .setSize(500, 60)

            ;

  myButton5 = cp5.addButton("orange")
    .setCaptionLabel("Orange Blossom")
      .setValue(0)
        .setPosition(100, 650+Yoffset)
          .setSize(500, 60)

            ;



  myButton6 = cp5.addButton("rustySwirl")
    .setCaptionLabel("Embers")
      .setValue(0)
        .setPosition(100, 750+Yoffset)
          .setSize(500, 60)

            ;

  myButton7 = cp5.addButton("psych")
    .setCaptionLabel("psychedelic blue")
      .setValue(0)
        .setPosition(100, 850+Yoffset)
          .setSize(500, 60)

            ;

  myButton8 = cp5.addButton("petals")
    .setCaptionLabel("rainbow petals")
      .setValue(0)
        .setPosition(100, 950+Yoffset)
          .setSize(500, 60)

            ;

  myButton9 = cp5.addButton("sunrise")
    .setCaptionLabel("Sunrise")
      .setValue(0)
        .setPosition(100, 1050+Yoffset)
          .setSize(500, 60)

            ;

  myButton10 = cp5.addButton("smoke")
    .setCaptionLabel("Ice Drops")
      .setValue(0)
        .setPosition(100, 1150+Yoffset)
          .setSize(500, 60)

            ;

  myButton11 = cp5.addButton("allSeq")
    .setCaptionLabel("All Sequences")
      .setValue(0)
        .setPosition(100, 1250+Yoffset)
          .setSize(500, 60)

            ;


  whichMovie=1; //default

  offScreenBuffer = createGraphics(326, 7);// offscreen buffer to hold the pattern
  registry = new DeviceRegistry();
  observer = new PusherObserver();
  registry.addObserver(observer);
  registry.setAntiLog(true);
  registry.setAutoThrottle(true);
} 




void draw() {
  if (!uiChanged)
    cp5.draw();        // we must do this every frame, or the event handler never fires.

  if (uiChanged) {
    buttonYpos = buttonOffsets[whichMovie] + Yoffset;
    background(bg);
    cp5.draw();
    pushMatrix();
    translate(0, buttonYpos);
    rect (100, 0, 500, 60); // selection state for the buttons
    popMatrix();

    numFrames = durations[whichMovie];

    uiChanged = false;
  }

  currentFrame = (currentFrame+1) % numFrames;  // Use % to cycle through frames and loop
  mainMovie = (imageSequences.get(whichMovie))[currentFrame];      // we just reference the images we loaded earlier.

  if (noStrips) {
    image(errorScreen, 000, 0, 800, 1280);
    uiChanged = true;
  } // display error if there are no strips detected

  if (onscreenDebug)
    image(mainMovie, 0, 0); // blit it so we can see what's happening
  offScreenBuffer.beginDraw();
  offScreenBuffer.image(mainMovie, 0, 0);
  //println(mainMovie);
  scrape(); // scrape the offscreen buffer 
  offScreenBuffer.endDraw();

}





// UI selections
public void controlEvent(ControlEvent theEvent) {
  uiChanged = true;
  println("Took control event.");
  currentFrame = 0;
}

// ControlP5 automatic event handler methods.
public void alloff(int theValue) {
  whichMovie = 1;
}

public void grad(int theValue) {
  whichMovie = 2;
}



public void buddah(int theValue) {
  whichMovie = 3;
}

public void colorwipe(int theValue) {
  whichMovie = 4;
}

public void orange(int theValue) {
  whichMovie = 5;
}

public void rustySwirl(int theValue) {
  whichMovie = 6;
}

public void psych(int theValue) {
  whichMovie = 7;
}

public void petals (int theValue) {
  whichMovie = 8;
}


public void sunrise(int theValue) {
  whichMovie = 9;
}

public void smoke(int theValue) {
  whichMovie = 10;
}


public void allSeq(int theValue) {
  whichMovie = 11;
}


void displayLoading() {

  loadingScreen = loadImage("noLEDSs.jpg");
  image(loadingScreen, 000, 0, 800, 1280);

}



  public PImage loadImage(String filename) { //, Object params) {
  //    return loadImage(filename, null);

  println("Processing CUSTOM loading image....");

  InputStream stream=null;
  try {
    stream =  surface.getAssets().open(filename); //new FileInputStream(filename);//createInput(filename);
  }
  //catch(FileNotFoundException e) {}
  catch(IOException e) {}


  if (stream == null) {
    System.err.println("Could not find the image " + filename + ".");
    return null;
  }
  //    long t = System.currentTimeMillis();
  Bitmap bitmap = null;
  try {
    bitmap = BitmapFactory.decodeStream(stream);
  } 
  finally {
    try {
      stream.close();
      stream = null;
    } 
    catch (IOException e) {
    }
  }
  //    int much = (int) (System.currentTimeMillis() - t);
  //    println("loadImage(" + filename + ") was " + nfc(much));
  if (bitmap == null) {
    System.err.println("Could not load the image because the bitmap was empty.");
    return null;
  } else {
    PImage image = new PImage(bitmap);
    image.parent = this;
    return image;
  }
}`

hey guys. in this time i need some help to optimize a system to pick shaders in real time (fragment shaders, and vertex shaders). This code is a mix that i recoleted in internet with code writing by myself.

Theres a lot of problem and i need help:

the idea of the program is that user can pick the shader in real time. there are two problems, first, i dont know how uploading the vertexShader, when i save it and reload it i need to click in another frag and then vertex upload.

second, it seems very inestable.the window of shaders crash very often, specially when frame rate is lowest. I wondering how to fix that. maybe with thread(), but it dont know exactly how apply this method..

If someone have time and wants to help, im sure that this code needs to be re writing. Thanks!

ShaderWindow shaderWin;

boolean recording = false;


import netP5.*;
import oscP5.*;

OscP5 oscP5;
NetAddress myRemoteLocation;

import themidibus.*;
MidiBus bus;
MidiBus apc;
float cc [] =new float [256];


boolean record, load;
double folderTime;
File folderShader;
float desmouse = 0.5;

// BUFFERS-SHADERS

String dirFolderShaders;
String dirFolderShaders2;
String dirFolderShadersvertex;

PGraphics [] buffers = new PGraphics [4];
PGraphics buffer;

LoadShader loadshader;

LoadShader loadshader2;
LoadShader loadshaderVertex;

ArrayList<ViewShader>vs = new ArrayList<ViewShader>();
ViewShaderVertex ss;

PShader sh, buffer1;
float count;
float angle = random(0, 0.005);

int choiceSize =1;
//int ww =  1920;
//int h = 1080;

void settings() {
  if (choiceSize==0) fullScreen(P3D, 2);
  if (choiceSize==1) size(1000, 1000, P3D);
  if (choiceSize==2) size(720, 1280, P3D);
}

void setup() {

  // BUFFERS-SHADERS

  dirFolderShaders = sketchPath("frag/");  //PUT SOME FRAGMENT IN THIS FOLDER

  dirFolderShadersvertex = sketchPath("vertex/"); PUT SOME VERTEX IN THIS FOLDER

  loadshader = new LoadShader(dirFolderShaders);

  loadshaderVertex = new LoadShader(dirFolderShadersvertex);


  for (int i = 0; i < buffers.length; i++) {
    buffers[i] = createGraphics(width, height, P3D);
  }


  ss = new ViewShaderVertex(loadshaderVertex.shadersPaths[1], loadshaderVertex, buffer);
  vs.add(new ViewShader(loadshader.shadersPaths[0], loadshader, buffer, ss));

  shaderWin = new ShaderWindow();
}

void draw() {

  background(0);


  for (ViewShader s : vs) {
    s.update();
  }


  if (folderShader.listFiles().length != loadshader.shadersNames.length) {
    loadshaderVertex.loadFolderShader();
  }

  if (folderShader.listFiles().length != loadshader.shadersNames.length) {
    loadshader.loadFolderShader();
  }




  buffers[0].beginDraw();
  buffers[0].background(0);
  buffers[0].translate(width/2, height/2);


  buffers[0].sphere(100);
  buffers[0].endDraw();

  image(buffers[0],0,0);
}



// LOAD SHADER CLASS

class LoadShader {

  String dirFolderShaders;

  String[] shadersNames;
  String[] shadersPaths;

  LoadShader(String _dirFolderShaders) {
    dirFolderShaders= _dirFolderShaders;
    loadFolderShader();
  }

  void loadFolderShader() {
    load = true;
    folderShader = new File(dirFolderShaders);
    File files[] = folderShader.listFiles();
    shadersNames = new String[files.length];
    shadersPaths = new String[files.length];
    for (int i = 0; i < files.length; i++) {
      shadersNames[i] = split(files[i].getName(), ".")[0];
      shadersPaths[i] = files[i].getAbsolutePath();
      //println(shadersNames[i]);
    }
    load = false;
  }
}

class ViewShader {

  boolean reload, error, loaded;
  File fileShader;

  long timeModi;
  long timeModis;
  String src;

  PShader shader;
  PShader shader1;
  PShader shader2;
  float a;
  LoadShader loadshader;
  ViewShaderVertex ss;
  PGraphics b;

  ViewShader(String _src, LoadShader _loadshader, PGraphics _b) {
    src = _src;
    fileShader = new File(src);
    openShader(fileShader);
    //shader1 = loadShader("blur.glsl", "bloomVert.glsl");
    //shader2 = loadShader("blur_vertical.glsl", "bloomVert.glsl");
    loadshader = _loadshader;
    b = _b;
  }

  ViewShader(String _src, LoadShader _loadshader, PGraphics _b, ViewShaderVertex _s) {
    ss = _s;

    //shader = loadShader("test2.glsl", "defaultVertex2.glsl");
    //shader1 = loadShader("blur.glsl", "bloomVert.glsl");
    //shader2 = loadShader("blur_vertical.glsl", "bloomVert.glsl");

    src = _src;
    fileShader = new File(src);
    openShader(fileShader);
    loadshader = _loadshader;
    b = _b;
  }


  void update() {
    if (reload) {      
      openShader(fileShader);
      reload = false;
    }
    if (shader != null) {

      //float p = map(cc[15], 0, 1, 0, 1);
      //float amt = map(cc[16], 0, 1, 1, 50);
      //float  h = map(cc[48], 0, 1, 0, 0.1);
      // //float  h = map(cc[14], 0, 1, 0, 0.5);


      shader.set("u_time", random(10));

      //shader1.set("u_time", angle);
      //shader2.set("u_time", angle);

      //shader.set("var2", p);
      //shader.set("amt", amt);

      //shader1.set("var2", p);
      //shader2.set("var2", p);


      if (fileShader.lastModified() != timeModi) {
        openShader(fileShader);
      }
    }
  }


  void newShader(String _srcc) {
    src = _srcc;
    fileShader = new File(src);
    reload = true;
    openShader(fileShader);
  }

  void openShader(File file) {
    if (file != null) {
      fileShader = file;
      timeModi = fileShader.lastModified();  
      try {
        shader = loadShader(file.getAbsolutePath(), ss.fileShader.getAbsolutePath());

        buffers[0].shader(shader);


        println(file.getAbsolutePath());
        error = false;
        loaded = true;
      }
      catch (RuntimeException e) {
        if (error == false) {
          error = true;
          // String time = nf(str(hour()),2) + ":" + nf(str(minute()),2) + ":" + nf(str(second()),2);
          println("\n");
          // println("At", time, "loadShader() returned the following error: \n");
          println("loadShader() returned the following error: \n");
          e.printStackTrace();
        }
        loaded = false;
      }
    }
  }
}

public class ShaderWindow extends PApplet {

  ShaderWindow() {
    super();
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }

  boolean mover;

  void settings() {
    size(600, 800, P2D);
  }

  void setup() {
    this.frameRate(30);
  }


  void draw() {

    background(25);


    for (int i = 0; i < vs.size(); i++) {
      ViewShader sss = vs.get(i);
      selector(i*100, 16, 100, width-16, sss, sss.loadshader, this);
    }

    ViewShaderVertex s = ss;  
    selector2(400, 16, 100, width-16, s, ss.loadshader, this);

  }

  void selector(float xx, float yy, float ww, float hh, ViewShader vs, LoadShader loadshader, PApplet p) {
    p.fill(150);
    p.noStroke();
    p.rectMode(CORNER);

    int cant = loadshader.shadersNames.length;
    p.rect(xx, yy+cant*16, ww, hh-cant*16);
    for (int i = 0; i < cant; i++) {
      boolean sobre = false;
      if (p.mouseX >= xx && p.mouseX < xx+ww && p.mouseY >= yy+i*16 && p.mouseY < yy+(i+1)*16) {
        sobre = true;
      }
      if (sobre) {
        p.fill(125);
      } else {
        p.fill(100, 50);
      }
      boolean selec = vs.src.equals(loadshader.shadersPaths[i]);
      if (p.mousePressed && sobre && !selec) {
        vs.newShader(loadshader.shadersPaths[i]);
      }

      if (selec) {
        p.fill(100);
        if (vs.error) {
          p.fill(200, 10, 10);
        }
      }

      p.rect(xx, yy+i*16, ww, 16);
      p.textAlign(LEFT, TOP);
      p.fill(250);
      if (i < loadshader.shadersNames.length && !load)
        text(loadshader.shadersNames[i], xx+5, yy+i*16);
    }
  }

  void selector2(float xx, float yy, float ww, float hh, ViewShaderVertex vs, LoadShader loadshader, PApplet p) {
    p.fill(150);
    p.noStroke();
    p.rectMode(CORNER);

    int cant = loadshader.shadersNames.length;
    p.rect(xx, yy+cant*16, ww, hh-cant*16);
    for (int i = 0; i < cant; i++) {
      boolean sobre = false;
      if (p.mouseX >= xx && p.mouseX < xx+ww && p.mouseY >= yy+i*16 && p.mouseY < yy+(i+1)*16) {
        sobre = true;
      }
      if (sobre) {
        p.fill(125);
      } else {
        p.fill(100, 50);
      }
      boolean selec = ss.src.equals(loadshader.shadersPaths[i]);
      if (p.mousePressed && sobre && !selec) {
        vs.newShader(loadshader.shadersPaths[i]);
      }

      if (selec) {
        p.fill(100);
        if (vs.error) {
          p.fill(200, 10, 10);
        }
      }

      p.rect(xx, yy+i*16, ww, 16);
      p.textAlign(LEFT, TOP);
      p.fill(250);
      if (i < loadshader.shadersNames.length && !load)
        p.text(loadshader.shadersNames[i], xx+5, yy+i*16);
    }
  }
}

class ViewShaderVertex {

  boolean reload, error, loaded;
  File fileShader;
  long timeModi;
  String src;
  String src2;

  PShader shader;

  float a;
  LoadShader loadshader;
  ViewShader ss;

  ViewShaderVertex(String _src, LoadShader _loadshader, PGraphics b) {

    src = _src;
    fileShader = new File(src);
    openShader(fileShader);

    loadshader = _loadshader;
  }



  void update() {
    if (reload) {      
      openShader(fileShader);
      reload = false;
    }
    if (shader != null) {

      if (fileShader.lastModified() != timeModi) {
        openShader(fileShader);

      }
    }
  }


  void newShader(String src) {
    this.src = src;
    fileShader = new File(src);
    reload = true;
    openShader(fileShader);
  }

  void openShader(File file) {

    if (file != null) {
      fileShader = file;
      timeModi = fileShader.lastModified();

      try {
                for (ViewShader s : vs) {
          s.update();
        }
        //shader = loadShader("test.glsl", file.getAbsolutePath());
        shader.setVertexShader(file.getAbsolutePath());
        buffers[0].shader(shader);

        println(file.getAbsolutePath());
        error = false;
        loaded = true;
      }
      catch (RuntimeException e) {
        if (error == false) {
          error = true;
          // String time = nf(str(hour()),2) + ":" + nf(str(minute()),2) + ":" + nf(str(second()),2);
          println("\n");
          // println("At", time, "loadShader() returned the following error: \n");
          println("loadShader() returned the following error: \n");
          e.printStackTrace();
        }
        loaded = false;
      }
    }
  }
}

solved, if someone is interested, here the code:

PWindow win;
PGraphics pg;

public void settings() {
  size(640, 480);
}

void setup() { 
  win = new PWindow();
  pg = createGraphics(width, height);
  println(width, height);
}

void draw() {
  pg.beginDraw();
  pg.background(255, 0, 0);
  pg.fill(255);
  pg.rect(10, 10, abs(sin(frameCount*.02)*width), 10);
  pg.endDraw();
  image(pg, 0, 0, width, height);
  win.setPG(pg);
}

void mousePressed() {
  println("mousePressed in primary window");
}  

class PWindow extends PApplet {
  PGraphics pg1;

  PWindow() {
    super();
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }

  void settings() {
    size(320, 240);
  }

  void setup() {
    background(150);
    pg1 = createGraphics(width, height);
    println(width, height);
  }

  void setPG(PGraphics pg1) {
    pg1.beginDraw();
    this.pg1=pg1;
    pg1.endDraw();
  }

  void draw() {
    image(pg1, 0, 0, width, height);
  }

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

i try to use a PGraphi but it not clone the main window, any suggestion?

PWindow win;
PGraphics pg;

public void settings() {
  size(320, 240);
}

void setup() { 
  win = new PWindow();
  pg = createGraphics(width, height);
}

void draw() {
  pg.beginDraw();
  pg.background(255, 0, 0);
  pg.fill(255);
  pg.rect(10, 10, frameCount, 10);
  win.draw(pg);
  pg.endDraw();
  image(pg, 0, 0);
  //win.draw();
}

void mousePressed() {
  println("mousePressed in primary window");
}
class PWindow extends PApplet {
  PWindow() {
    super();
    PApplet.runSketch(new String[] {this.getClass().getSimpleName()}, this);
  }

  void settings() {
    size(500, 200);
  }

  void setup() {
    background(150);
  }

  void draw(PGraphics pg) {
    image(pg, 0, 0, width, height);
  }

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

I am afraid that I do not know how to do this without an offscreen buffer.

Not sure if this is exactly what you were after but is a proof of concept I suppose.

It was a challenge tuning in the depth value.

There should be another way... :-?

Most likely a step in the matrix math that I am missing.

Fragment shader:

varying vec4 vertColor;

void main() {
    gl_FragColor = vertColor;
}

Vertex shader:

uniform mat4 projection;
uniform mat4 modelview;

attribute vec4 position;
attribute vec4 color;
attribute vec2 offset;

varying vec4 vertColor;
varying vec4 vertTexCoord;

uniform int getZ;
uniform float maxDepth;

void main() {

  vec4 pos = modelview * position;
  vec4 clip = projection * pos;
  vec4 posit = clip + projection * vec4(offset, 0., 0.);

  float depth = -vertTexCoord.z * 8.0; // Not fond of this magic multiplier...
  vec4 deep = vec4((depth/maxDepth).xxx, 1.0);

  vertColor = getZ != 0 ? deep : color; // Choose colored dots or depth value

  gl_Position = posit;
}

I wound up using the modified blur shader from your other post. https://forum.processing.org/two/discussion/27807/how-to-combine-a-z-buffer-with-a-blur-fragment-shader

Blur shader:

#define PROCESSING_TEXTURE_SHADER

uniform sampler2D texture;
uniform sampler2D depthBuffer;

// The inverse of the texture dimensions along X and Y
uniform vec2 texOffset;
varying vec4 vertColor;
varying vec4 vertTexCoord;

uniform int blurSize;       
uniform int horizontalPass; // 0 or 1 to indicate vertical or horizontal pass
uniform float sigma;        // The sigma value for the gaussian function: higher value means more blur
                            // A good value for 9x9 is around 3 to 5
                            // A good value for 7x7 is around 2.5 to 4
                            // A good value for 5x5 is around 2 to 3.5
                            // ... play around with this based on what you need <span class="Emoticon Emoticon1"><span>:)</span></span>
const float pi = 3.14159265;

void main() {  
  vec4 effx = texture2D(depthBuffer, vertTexCoord.st);
  //float numBlurPixelsPerSide = float(blurSize / 2); 
  int numBlurPixelsPerSide = int((blurSize - effx.x*blurSize) / 2); // <--    Using depth info here, farther away, more blur

  vec2 blurMultiplyVec = 0 < horizontalPass ? vec2(1.0, 0.0) : vec2(0.0, 1.0);

  // Incremental Gaussian Coefficent Calculation (See GPU Gems 3 pp. 877 - 889)
  vec3 incrementalGaussian;

  incrementalGaussian.x = 1.0 / (sqrt(2.0 * pi) * sigma);
  incrementalGaussian.y = exp(-0.5 / (sigma * sigma));

  incrementalGaussian.z = incrementalGaussian.y * incrementalGaussian.y;

  vec4 avgValue = vec4(0.0, 0.0, 0.0, 0.0);
  float coefficientSum = 0.0;

  // Take the central sample first...
  avgValue += texture2D(texture, vertTexCoord.st) * incrementalGaussian.x;
  coefficientSum += incrementalGaussian.x;
  incrementalGaussian.xy *= incrementalGaussian.yz;

  // Go through the remaining 8 vertical samples (4 on each side of the center)
  for (float i = 1.0; i <= numBlurPixelsPerSide; i++) { 
    avgValue += texture2D(texture, vertTexCoord.st - i * texOffset * 
                          blurMultiplyVec) * incrementalGaussian.x;         
    avgValue += texture2D(texture, vertTexCoord.st + i * texOffset * 
                          blurMultiplyVec) * incrementalGaussian.x;         
    coefficientSum += 2.0 * incrementalGaussian.x;
    incrementalGaussian.xy *= incrementalGaussian.yz;
  }

  gl_FragColor = (avgValue / coefficientSum);
}

Sketch:

import peasy.*;
import peasy.org.apache.commons.math.*;
import peasy.org.apache.commons.math.geometry.*;

// Multipass. No, not that kind. Shaders. https://en.wikipedia.org/wiki/Deferred_shading

PGraphics zbuff, starbuff;

PeasyCam rendercam, bufcam;
PShader pointShader, blurShader;
PShape shp;
ArrayList<PVector> vectors = new ArrayList<PVector>();

void setup() {
  size(900, 900, P3D);
  frameRate(120);
  //smooth(8);

  zbuff = createGraphics(width, height, P3D);
  starbuff = createGraphics(width, height, P3D);

  // Camera settings need to match
  bufcam = new PeasyCam(this, zbuff, 500);
  bufcam.setMaximumDistance(width);
  zbuff.perspective(60 * DEG_TO_RAD, width/float(height), 2, 6000);

  rendercam = new PeasyCam(this, starbuff, 500);
  rendercam.setMaximumDistance(width);
  starbuff.perspective(60 * DEG_TO_RAD, width/float(height), 2, 6000);

  double d = bufcam.getDistance()*3;

  // Shader setup, adjust as needed
  blurShader = loadShader("blurfrag.glsl");
  blurShader.set("sigma", 1.25);
  blurShader.set("blurSize", 9);

  pointShader = loadShader("pointfrag.glsl", "pointvert.glsl");
  pointShader.set("maxDepth", (float) d);

  for (int i = 0; i < 5000; i++) {
    vectors.add(new PVector(random(width), random(width), random(width)));
  }

  // Star depth
  zbuff.shader(pointShader, POINTS);
  zbuff.strokeWeight(2);
  zbuff.stroke(255);

  // Stars
  starbuff.shader(pointShader, POINTS);
  starbuff.strokeWeight(2);
  starbuff.stroke(255);

  // We can use the same shape object
  shp = createShape();
  shp.setStroke(255);
  shp.beginShape(POINTS);
  shp.translate(-width/2, -width/2, -width/2);
  for (PVector v: vectors) {
    shp.stroke(255);
    // We can color the stars too
    // The selection of depth or color is in the shader
    //shp.stroke((int)random(255),(int)random(255),(int)random(255));
    shp.vertex(v.x, v.y, v.z);
  }
  shp.endShape();

  shader(blurShader);
}

void draw(){
  zbuff.beginDraw();
  zbuff.background(0);
  pointShader.set("getZ", 1);
  zbuff.shape(shp, 0, 0);
  zbuff.endDraw();

  starbuff.beginDraw();
  starbuff.background(0);
  pointShader.set("getZ", 0);
  starbuff.shape(shp, 0, 0);
  starbuff.endDraw();

  // pass in the z depth info
  blurShader.set("depthBuffer", zbuff);

  // and draw the star field
  blurShader.set("horizontalPass", 0);
  image(starbuff, 0, 0);
  blurShader.set("horizontalPass", 1);
  filter(blurShader);

  // Match render to zbuff positions
  rendercam.rotateY(.0001);
  rendercam.rotateX(.00005);
  bufcam.rotateY(.0001);
  bufcam.rotateX(.00005);

  //println(frameRate);
}

Seems the next thing I need to do is sign up at the new forum...

My attempt using JAVA2D renderer instead of P2D, extending from @koogs. There is only one small difference when calling the copy() function.

Kf

final color C1=color(0, 20, 220);
final color C2=color(250, 250, 0);

PGraphics textLayer;
PImage bc;

int recX, recY;
int recW = 30;
int recH = 60;

void setup() {
  size(800, 600);  

  // grid of numbers
  textLayer = createGraphics(width, height);
  textLayer.beginDraw();
  textLayer.textSize(16);
  textLayer.clear();  // transparent
  textLayer.fill(255, 0, 0);
  int i = 0;
  for (int y = 0; y < height; y += 50) {
    for (int x = 0; x < width; x += 50) {
      textLayer.text(i, x, y);
      textLayer.text(i, x+1, y);  //Offset by 1px to create bold effect
      i++;
    }
  }
  textLayer.endDraw();

  //Background img
  bc=createImage(width, height, ARGB);
  bc.loadPixels();
  for (int k=0; k<bc.pixels.length; k++) {
    bc.pixels[k]=lerpColor(C1, C2, (k%width)*1.0/width);
  }
  bc.updatePixels();

  randomise();
}

void draw() {
  background(bc);

  copy(textLayer.get(), (int)random(textLayer.width), 
    (int)random(textLayer.height), 
    recW, 
    recH, 
    (int)random(width), (int)random(height), recW, recH);

  noLoop();
}

void mousePressed() {
  randomise();
  loop();
}

void randomise() {
  recX = (int)random(width / 2);
  recY = (int)random(height / 2);
  recW = (int)random(width/2, width);
  recH = (int)random(height/2, height);
}

this creates a text layer full of red numbers on a transparent background and then copies a rectangular section of that onto the grey background.

press mouse to redraw

note that the numbers do not move, but you can only see the ones within the random rectangle.

PGraphics textLayer;

int recX, recY;
int recW = 30;
int recH = 60;

void setup(){
  size(800, 600, P2D);

  // grid of numbers
  textLayer = createGraphics(width, height);
  textLayer.beginDraw();
  textLayer.clear();  // transparent
  textLayer.fill(255, 0, 0);
  int i = 0;
  for(int y = 0; y < height; y += 50){
    for(int x = 0; x < width; x += 50){
      textLayer.text(i, x, y);
      i++;
    }
  }
  textLayer.endDraw();

  randomise();
}

void draw(){
  background(128);

  copy(textLayer, (int)random(textLayer.width), (int)random(textLayer.height), recW, recH,
    (int)random(width), (int)random(height), recW, recH);

  noLoop();
}

void mousePressed() {
  randomise();
  loop();
}

void randomise() {
  recX = (int)random(width / 2);
  recY = (int)random(height / 2);
  recW = (int)random(width/2, width);
  recH = (int)random(height/2, height);
}

This is a code that demonstrate the second concept above. Check this for reference: https://processing.org/reference/PImage_mask_.html

Kf

final color C1=color(250, 0, 0);
final color C2=color(250, 250, 0);

final int SHOWBACKGROUNDONLY=0;
final int SHOWIMAGE=1;
final int SHOWMASKEDIMAGE=2;

PImage bc;
PGraphics pg;
PGraphics mask;

int state=SHOWBACKGROUNDONLY;

float recX = 0;
float recY = 30;
float recW = 30;
float recHigh = 60;

void setup() {
  //fullScreen();
  size(600, 400);
  mask = createGraphics(width, height);
  pg = createGraphics(width, height);

  bc=createImage(width, height, ARGB);
  bc.loadPixels();
  for (int i=0; i<bc.pixels.length; i++) {
    bc.pixels[i]=lerpColor(C1, C2, (i%width)*1.0/width);
  }
  bc.updatePixels();

  pg.beginDraw();
  pg.background(0);
  pg.fill(255);
  pg.noStroke();
  for (int i=1; i<20; i++) {
    pg.text("hello world", random(0, width), random(0, height));
  }
  pg.ellipse(width/2, height/2, width*0.3, 25);
  pg.endDraw();

  noLoop();
  surface.setTitle("Current state="+state);
}

void draw() {
  background(color(0, 102, 153));

  if (state==SHOWBACKGROUNDONLY)
    return;


  if (state==SHOWMASKEDIMAGE)
    bc.mask(pg);

  image(bc, 0, 0);
}

void mousePressed() {
  redraw();

  state=(state+1)%3;
  surface.setTitle("Current state="+state);
}

In this sample code I'm trying to get masked red text on white background. But the area that's supposed to be unmasked gets a black background. Assuming that the background for the text pgraphics should be transparent so any image on the regular canvas could be seen.

here I made one custom:

PGraphics pg;
PGraphics mask;

float recX = 0;
float recY = 30;
float recW = 30;
float recHigh = 60;

void setup(){
  fullScreen();
  mask = createGraphics(width, height);
  pg = createGraphics(width, height);
  pg.beginDraw();
  pg.fill(255,0,0);
  for(int i=1; i<20; i++){
    pg.text("hello world", random(0,width), random(0,height));
  }
  pg.endDraw();

}

void draw(){
  background(255);

  if(frameCount%20 == 0){
    recX = random(0,width/2);
    recY = random(0,height/2);
    recW = random(width/2, width);
    recHigh = random(height/2, height);
  }

  mask.beginDraw();
  mask.clear();
  mask.fill(255);
  mask.noStroke();

  mask.rect(recX, recY, recW, recHigh);
  mask.endDraw();
  mask.mask(pg);
  pg.mask(mask);
  println("mask format is: "+mask.format);
  image(pg, 0, 0);

}

also manually changing both PGraphics.format to either 0,1,2 made no impact.

I'm trying to mask one PGraphics (that has text) with another (shape) and show the masked text over the "regular" canvas that's showing images.

The masked area becomes entirely opaque (the black rect). I would have used blending mode but I'm not using 100% white or black text.

I've looked here: https://forum.processing.org/two/discussion/23886/masking-a-shape-with-another-shape

but I see that also that has similar behavior.

here's the masked pgraphics:

mask = createGraphics(width, height);
pg = createGraphics(width, height);
for (int x=0; x< labels.length/2; x++){
pg.beginDraw();
pg.fill(0,0,255);
pg.text("#"+labels[x].labelText.toUpperCase(), labels[x].xLoc, labels[x].yLoc);
pg.endDraw();
}

here's the code for the masking:

  mask.beginDraw();
  mask.clear();
  mask.fill(255);
  mask.noStroke();
  mask.rect(random(0,width/2), random(0,height/2), random(width/2, width), random(height/2, height));
  mask.endDraw();
  pg.mask(mask);
  image(pg, 0, 0);