Making a transparent background (application) in Processing language

Question

I am trying to create a clock application for desktop in the language Processing 3 (java based) and I need to make the background transparent so you can see what's behind the clock (for example the desktop).

I tried this:

background(0, 0, 0, 0);

doesn't work.

Can anyone help me?

Answer 1

You're going to have to get to the underlying window and set the transparency of that.

How you do that (and whether it's even possible) is going to depend on which renderer you're using, and what your computer is capable of.

Here's an example of how you might do that with the default renderer:

import processing.awt.PSurfaceAWT;
import processing.awt.PSurfaceAWT.SmoothCanvas;
import javax.swing.JFrame;

void setup() {
  size(200, 200);
  PSurfaceAWT awtSurface = (PSurfaceAWT) surface;
  SmoothCanvas smoothCanvas = (SmoothCanvas) awtSurface.getNative();
  JFrame jframe = (JFrame)smoothCanvas.getFrame();
  jframe.dispose();
  jframe.setUndecorated(true);
  jframe.setOpacity(.5f);
  jframe.setVisible(true);
}

void draw() {
  background(0, 128);
}

Please note that this is just example code, so you might have to play with it to get it to work with your computer and your renderer. But the general idea is there: you have to get to the underlying window, and then set the transparency of that.

If this doesn't work, you'll probably have better luck if you use Processing as a Java library instead of going through the Processing editor. Specifically you should be able to get to the underlying window before it's displayed.

Answer 2

I will try to give you some Java code maybe these help you (Transparent Notification frame):

import static java.awt.GraphicsDevice.WindowTranslucency.PERPIXEL_TRANSPARENT;
import static java.awt.GraphicsDevice.WindowTranslucency.TRANSLUCENT;

import java.awt.Color;
import java.awt.Font;
import java.awt.GraphicsDevice;
import java.awt.GraphicsEnvironment;
import java.awt.GridBagLayout;
import java.awt.event.ComponentAdapter;
import java.awt.event.ComponentEvent;
import java.awt.geom.RoundRectangle2D;

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.SwingUtilities;

/**
 *
 * @author Coder ACJHP
 */
public class NotifyMe extends JFrame {

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    private JLabel label;
    public NotifyMe() {
        super("NotifyMe");
        setLayout(new GridBagLayout());
        addComponentListener(new ComponentAdapter() {
            @Override
            public void componentResized(ComponentEvent e) {
                setShape(new RoundRectangle2D.Double(0, 0, getWidth(), getHeight(),15,15));
            }
        });

        setUndecorated(true);
        setSize(250, 80);
        setAlwaysOnTop(true);
        setLocationRelativeTo(null);
        setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
        label = new JLabel();
        label.setFont(new Font("Adobe Arabic", Font.BOLD, 14));
        label.setBounds(0, 0, getWidth(), getHeight());

        label.setForeground(Color.RED);
        add(label);
    }

    public void setNotifiyNote(String note) {
        this.label.setText(note);
    }

    public static void main(String[] args) {

        GraphicsEnvironment ge = GraphicsEnvironment.getLocalGraphicsEnvironment();
        GraphicsDevice gd = ge.getDefaultScreenDevice();
        final boolean isTranslucencySupported = gd.isWindowTranslucencySupported(TRANSLUCENT);

        if (!gd.isWindowTranslucencySupported(PERPIXEL_TRANSPARENT)) {
            System.err.println("Shaped windows are not supported");
            System.exit(0);
        }

        if (!isTranslucencySupported) {
            System.out.println("Translucency is not supported, creating an opaque window");
        }

        SwingUtilities.invokeLater(() -> {
            NotifyMe sw = new NotifyMe();

            if (isTranslucencySupported) {
                sw.setOpacity(0.7f);
            }
        });
    }
}