Skip to main content

Zeichnen-App – Schritt 3 (Überarbeitete Version)

Linien zeichnen

Ziel 3

Statt einzelner Punkte wollen wir nun Linien zeichnen – wie der Finger über die Zeichenfläche gleitet.

1.) In der Design-Ansicht

Benötigt werden:

Für diesen Schritt werden keine neuen Elemente benötigt.


2.) In der Blöcke-Ansicht (Programmierung)

Linie zeichnen

Auslöser: Finger über Zeichenfläche ziehen

Zu verändernde Elemente: Zeichenfläche → ZeichneLinie

Berechnung: Linie vom Start (vorherX, vorherY) zum Ziel (aktuellesX, aktuellesY)

Programmiert mit den Elementen:

1.

Erstellt ein Gezogen-Ereignis für die Zeichenfläche.


2.

Erstellt einen ZeichneLinie-Block  für die Zeichenfläche und verknüpft diesen mit dem Ereignis.

3.

Damit eine Linie gezeichnet wird, müsst ihr einen Startpunkt (vorherX, vorherY) und einen Endpunkt (aktuellesX, aktuellesY) angeben. Diese Punkte holt ihr euch aus dem Gezogen-Event.

4.So könnte das dann aussehen.



3.) Testen

Funktioniert unsere App?

1.

Klickt im App Inventor oben auf Verbinden und wählt Al Companion.

2.

Öffnet die App Al Companion auf eurem Test-Smartphone und wählt scan QR code. 

Vergesst nicht den Haken bei Use Legacy Connection  zu setzen.

3.Scannt den QR-Code auf dem Computerbildschirm - die App wird geladen.

Testet die App nun ausführlich!

  1. Könnt ihr nun Linien auf der Zeichenfläche malen?
  2. Wird die Linie an der Stelle gemalt, über die ihr mit dem Finger zieht?
  3. Wechselt die Stiftfarbe ihre Farbe, wenn ihr eine andere Farbe auswählt?
  4. Könnt ihr weiterhin Punkte malen?

Funktioniert alles? Herzlichen Glückwunsch! Weiter geht es auf der nächsten Seite!


JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.