Processing does not provide any direct mechanism for manipulating the look of the sketch Window, but Java natively supports tricks like turning off the window chrome, explicitly setting window position and making a window “float” over all other UI elements. All of this can be accessed via PApplet’s internal “frame” field, which holds an instance of a Frame object representing the window your sketch is running in. But even so, Java won’t let you have free reign without a little trickery.
The following hack demonstrates how to make a window that has no OS chrome, always stays on top of the UI and has an explicitly set screen position. You can even use the cursor keys to move the window around the screen.
Personally, what I like most about this hack is that it gets around Processing’s (or possibly Java’s) assumptions about a minimum window size of ~120×120. If you specify a size that’s less than 120 on one side, Processing will be pad that side with grey pixels to reach the minimum. But with this hack you can have tiny windows that you can micro-manage to your heart’s delight. I use it to make debug dispays, small control panels and other useful things.
Update: @CedricKiefer pointed out another Processing example that allows for transparent and even irregularly shaped windows. It’s Windows-only apparently, I bet this kind of thing is a major violation of Apple GUI laws anyhow.
Update 2: @ideoforms took my post literally and made a sketch with multiple bouncing windows. Nice.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | // FloatingWindow.pde // Marius Watz - http://workshop.evolutionzone.com // // Provides a method for creating frame-less windows with smaller // than typical sizes. Also demonstrates how to set the precise // location of the window on screen, as well as make it float over // all other windows. // // Can be useful if you'd like to make a persistent "debug" app of // some sort, or just because it's neat when things don't look like // your everyday operating system. // // Works both with P2D and OPENGL.Uses a trick from this Processing hack: // http://processing.org/hacks/hacks:undecoratedframe PFont fnt; int W,H,PX,PY; void setup() { // W x H == desired size of frame. // Normally, Processing will not create a frame smaller than ~120x120, // but will pad the window with blank pixels. W=100; H=40; // initial position of frame PX=100; PY=100; size(W,H); fnt=createFont("Arial",12,false); } // overriding PApplet.init() to add a hack of our own void init() { // trick to make it possible to change the frame properties frame.removeNotify(); // comment this out to turn OS chrome back on frame.setUndecorated(true); // comment this out to not have the window "float" frame.setAlwaysOnTop(true); frame.setResizable(true); frame.addNotify(); // making sure to call PApplet.init() so that things // get properly set up. super.init(); } void draw() { background(0); // resize and set initial location a few frames after sketch start. // our window will now be tiny and located at position PX,PY. if(frameCount==5) { frame.resize(W,H); frame.setLocation(PX,PY); } // draw window outline noStroke(); fill(255,100,0); rect(0,0, width,height); fill(0); rect(3,3, width-6,height-6); textFont(fnt); fill(255,255,0); text(frameCount/10+" | "+ frame.getLocation().x+","+ frame.getLocation().y,16,24); } // the cursor keys may be used to move the window around void keyPressed() { if(key==CODED) { if(keyCode==LEFT) frame.setLocation( frame.getLocation().x-5, frame.getLocation().y); if(keyCode==RIGHT) frame.setLocation( frame.getLocation().x+5, frame.getLocation().y); if(keyCode==UP) frame.setLocation( frame.getLocation().x, frame.getLocation().y-5); if(keyCode==DOWN) frame.setLocation( frame.getLocation().x, frame.getLocation().y+5); } } |
[...] widget that copies the character L into memory whenever I click on it (that’s why I wrote the floating window hack.) I’m coping better every day. A few days ago I would simply wiggle the little stump [...]
[...] Hack: Non-standard windows in Processing – Processing does not provide any direct mechanism for manipulating the look of the sketch Window, but Java natively supports tricks like turning off the window chrome, explicitly setting window position and making a window “float” over all other UI elements. All of this can be accessed via PApplet’s internal “frame” field, which holds an instance of a Frame object representing the window your sketch is running in. But even so, Java won’t let you have free reign without a little trickery. [...]
// FloatingWindow.pde
// Marius Watz – http://workshop.evolutionzone.com
//
// Provides a method for creating frame-less windows with smaller
// than typical sizes. Also demonstrates how to set the precise
// location of the window on screen, as well as make it float over
// all other windows.
//
// Can be useful if you’d like to make a persistent “debug” app of
// some sort, or just because it’s neat when things don’t look like
// your everyday operating system.
//
// Works both with P2D and OPENGL.Uses a trick from this Processing hack:
// http://processing.org/hacks/hacks:undecoratedframe
PFont fnt;
int W,H,PX,PY;
void setup() {
// W x H == desired size of frame.
// Normally, Processing will not create a frame smaller than ~120×120,
// but will pad the window with blank pixels.
W=100;
H=40;
// initial position of frame
PX=100;
PY=100;
size(W,H);
fnt=createFont(“Arial”,12,false);
}
// overriding PApplet.init() to add a hack of our own
void init() {
// trick to make it possible to change the frame properties
frame.removeNotify();
// comment this out to turn OS chrome back on
frame.setUndecorated(true);
// comment this out to not have the window “float”
frame.setAlwaysOnTop(true);
frame.setResizable(true);
frame.addNotify();
// making sure to call PApplet.init() so that things
// get properly set up.
super.init();
}
void draw() {
background(0);
// resize and set initial location a few frames after sketch start.
// our window will now be tiny and located at position PX,PY.
if(frameCount==5) {
frame.resize(W,H);
frame.setLocation(PX,PY);
}
// draw window outline
noStroke();
fill(255,100,0);
rect(0,0, width,height);
fill(0);
rect(3,3, width-6,height-6);
textFont(fnt);
fill(255,255,0);
text(frameCount/10+” | “+
frame.getLocation().x+”,”+
frame.getLocation().y,16,24);
}
// the cursor keys may be used to move the window around
void keyPressed() {
if(key==CODED) {
if(keyCode==LEFT) frame.setLocation(
frame.getLocation().x-5,
frame.getLocation().y);
if(keyCode==RIGHT) frame.setLocation(
frame.getLocation().x+5,
frame.getLocation().y);
if(keyCode==UP) frame.setLocation(
frame.getLocation().x,
frame.getLocation().y-5);
if(keyCode==DOWN) frame.setLocation(
frame.getLocation().x,
frame.getLocation().y+5);
}
}