Könnt ihr mir beim Processing Rechteck Quiz helfen?

Welchem Prinzip folgt das Quadrat in dem interaktiven Feld:

Gibt es einen Code womit man das Quadrat im Processing quasi größer und kleiner mit seinem Mauszeiger machen kann? Komm nicht weiter. Schon mal danke im Voraus!!

Answer 1

[regex9]

Schau in der Referenz, welche Ereignisse in Kombination mit der Maus du reagieren kannst. Dort werden auch globale Variablen aufgeführt, über die sich die aktuelle und vorherige Mausposition einlesen lässt.

So könntest du bspw. gemessen an der Distanz, die die Maus bewegt wurde, einen Faktor berechnen, der mit der Breite und Höhe des zu zeichnenden Rechtecks multipliziert wird.

Comments

[Fredi236]

aber wie genau?

[Fredi236]

habe mich schon belesen und es trotzdem nicht hinbekommen

[regex9]

@Fredi236

Zeige mal deinen Ansatz und das, woran du gescheitert bist.

Wenn du bisher gar keinen Plan hattest, teile es erst einmal auf:

1. Rechteck zeichnen.
2. Mausposition in der Konsole ausgeben.
3. Bestenfalls liegt der mögliche Faktor zwischen einem begrenzten Zahlenbereich, wie 1 und 10 (beide Grenzen inklusive). Also kann die Zeichenfläche aufteilen bzw. deren Breite/Höhe entspricht jeweils 10. Mit dem Dreisatz bekommst du raus, in welchem Abschnitt sich die Maus gerade je Achse befindet.
4. Das Zeichnen des Rechtsecks modifizieren. Auf seine Höhe und Breite wird jeweils der Faktor je Achse (x/y) multipliziert.

[regex9]

@regex9

Noch eine andere Methode, die noch einfacher ist: Du berechnest den Abstand der Mauskoordinaten zum Mittelpunkt und verwendest diese berechnete Differenz als Höhe / Breite des Vierecks. Damit du nicht in den Negativbereich abdriftest, solltest du stets den Betrag der Differenz verwenden.

[Fredi236]

@regex9

void setup() {

 size(200,200);

} 

void draw(){

  background(250);

  rect(100, 100, mouseX, mouseY);

}

Das ist bisher das, was ich habe. Es funktioniert noch nicht, dass das Quadrat steif bleibt und es überall, auch bis zum Rand geht. Ich habe verstanden, was du mir mit deinen Vorschlägen sagen wolltest, konnte sie aber dennoch nicht ausführen, da ich mich in dieser Sprache noch nicht so auskenne. Ich freue mich über eine Antwort.

LG

[regex9]

@Fredi236

Du hast es dennoch schon selbst gelöst. Wenn ich dich recht verstehe, liegt dein Problem nun nur noch darin, dass sich das Rechteck nicht in alle Richtungen ausbreitet.

Mit rectMode kannst du bestimmen, von welchem Ankerpunkt aus das Rechteck gezeichnet werden soll bzw. wie die ihm übergebenen Werte zu interpretieren sind.

So wird festgelegt, dass die ersten beiden Argumente (100, 100) den zentralen Punkt des Rechtecks beschreiben sollen:

rectMode(CENTER);
rect(100, 100, mouseX, mouseY);

[Fredi236]

@regex9 Vielen Dank, nun hat alles geklappt!