1. www.processing.org

2. Grundaufbau import processing.core.PApplet; public class Proc_Minimal extends PApplet { public void setup(){ size(1024, 768); frameRate(60.0f); } public void draw() { background(255); fill(255,0,0); rectMode(CENTER); rect(mouseX, mouseY, 50, 50); } static public void main(String args[]) { //PApplet.main(new String[] { "--present", "Proc_Minimal" }); PApplet.main(new String[] {"Proc_Minimal" }); } Von Papplet ableiten Initialisierung Loop- Methode Create a Window

3. Wichtige Methoden/Attribute size(width, height) optional (width, height, Renderer) z.B. size(1024, 768, OPENGL) mouseX, mouseY pMouseX, pMouseY Größe d. Fensters + Renderer Aktuelle Mouseposition Mouseposition des letzten Frames

4. Zeichnen ellipse(x, y, width, height) auch: rect, triangle, line fill(grey) fill(r,g,b) fill(r,g,b,a); noFill() stroke(grey) // 0-255 stroke(r,g,b) stroke(r,g,b,a) noStroke() strokeWeigth(pixel) colorMode(mode, range) colorMode(HSB. 255) //use hsv colorMode(HSB, hRange, sRange, vRange) background(128); fill(204, 102, 0); rect(30, 20, 55, 55); background(128); stroke(204, 102, 0); rect(30, 20, 55, 55); noStroke(); colorMode(HSB, 100); for (int i = 0; i < 100; i++) { for (int j = 0; j < 100; j++) { stroke(i, j, 100); point(i, j); }

5. Transformationen transform(x, y) rotate(radiants) Use radiants(degree) to convert to radiants scale(factor)

6. Transformationen Why ? Because sometimes it‘s easier! void setup() { size(400, 100); background(255); for (int i = 10; i < 350; i = i + 50) { house(i, 20); } vs. void house(int x, int y) { triangle(x + 15, y, x, y + 15, x + 30, y + 15); rect(x, y + 15, 30, 30); rect(x + 12, y + 30, 10, 15); } void house(int x, int y) { pushMatrix(); translate(x, y); triangle(15, 0, 0, 15, 30, 15); rect(0, 15, 30, 30); rect(12, 30, 10, 15); popMatrix(); }

7. Component-based Drawing public abstract class AbstractComponent { protected Vec2D center; protected float width, height; protected float angle; protected Color color; protected PApplet app; protected AbstractComponent parent; protected ArrayList addedComponents; public void preDraw(){ app.pushMatrix(); if (parent != null) app.rotate(-parent.getAngle()); app.translate(center.x, center.y); app.rotate(angle); } public void drawComponent(){ for (AbstractComponent ce : addedComponents) ce.drawComponent(); } public void postDraw(){ app.popMatrix(); } public abstract class AbstractComponent { public Vec2D getCenterGlobal() { if (parent == null) return center; else return parent.getCenterGlobal().add(center); }

8. Component-based Drawing public class OscilatorComponent extends AbstractComponent { public OscilatorComponent(Vec2D center, float width, …..) { super(center, float width,…); slider = new Slider(new Vec2D(), width/4*3, …); addedComponents.add(slider); } @Override public void drawComponent() { super.preDraw(); super.drawComponent(); app.rectMode(PApplet.CENTER); app.fill(color.r, color.g, color.b, color.a); app.noStroke(); app.rect(0, 0, width, height); super.postDraw(); }