Example app

Drawing pad

Paint with the mouse; clear with the secondary button.

Run this example

Stop the app and save your current Main and helpers outside src/. Copy the files shown below into the listed destinations in your standalone starter, creating resource folders when needed. Replace Main and the listed helpers. Keep the zero/ framework folder and build files. If an older downloaded kit does not have these examples, use the source shown here.

examples/drawing/Main.java → src/main/java/Main.java

Run App to rebuild. Click the canvas before testing input. These examples run in VS Code, in a separate JavaFX window.

Open related lesson

Read the source

drawing/Main.java

import javafx.scene.input.MouseButton;
import javafx.scene.paint.Color;
import zero.SketchApp;

/** Leave paint on the canvas instead of clearing it every frame. */
public class Main extends SketchApp {
    private double previousX;
    private double previousY;
    private boolean painting;

    @Override
    public void settings() {
        size(640, 400);
        title("Mouse painting");
    }

    @Override
    public void setup() {
        background(Color.WHITE);
    }

    @Override
    public void draw() {
        boolean inside = mouseX() >= 0 && mouseX() < width()
                && mouseY() >= 0 && mouseY() < height();
        if (mouseDown(MouseButton.SECONDARY) && inside) {
            background(Color.WHITE);
            painting = false;
        } else if (mouseDown(MouseButton.PRIMARY) && inside) {
            stroke(Color.DARKBLUE);
            strokeWidth(6);
            if (painting) line(previousX, previousY, mouseX(), mouseY());
            fill(Color.DARKBLUE);
            circle(mouseX(), mouseY(), 6); // A click also makes a dot.
            previousX = mouseX();
            previousY = mouseY();
            painting = true;
        } else {
            painting = false; // Do not connect separate strokes.
        }
    }

    public static void main(String[] args) {
        launch(args);
    }
}