Workshops App-Entwicklung

Magier-App – Schritt 3 (Überarbeitete Version)

Geheime Tasten


Ziel 3

Eingeweihte sollen über geheime Tasten sicherstellen können, dass der Magier eine Ja- oder eine Nein-Antwort gibt.


1.) In der Design-Ansicht

Benötigt werden:

1.

Links in den Bereichen der Benutzerschnittstelle und Anordnung findet ihr die Elemente, die ihr braucht.

  • Fügt zwei Elemente des Typs Taste hinzu.

image2022-3-7_13-29-46.png

2.

Fügt ein Element des Typs HorizontaleAusrichtung hinzu. Damit könnt ihr die Tasten, in dem ihr sie in das Feld der HorizontalenAusrichtung schiebt nebeneinander positionieren.

image2022-3-7_15-44-49.png

3.

Nennt Taste1 "TasteJa" und Taste2 "TasteNein". 

Lasst die Tasten unsichtbar werden, in dem ihr die Hintergrundfarbe und die Textfarbe auf "keine" stellt.

image2022-3-7_13-40-4.png image2022-3-7_13-40-48.png

4.. 

Passt die Breite der Tasten an, damit diese den vollen Platz ausnutzen.

image2022-3-7_15-46-16.png

5.

So könnte es dann aussehen.

magier3_designer.png



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

Funktion Geheime Tasten

Auslöser: Klick auf Taste

Zu verändernde Elemente: Bezeichnung → Setze Text

Berechnung: Vorgegebene Antwort

Programmiert mit den Elementen:

1.

Erstellt Klick-Ereignisse für die beiden Tasten.

image2022-3-7_13-47-12.png
image2022-3-7_13-46-30.png

2.

Erstellt setze-Blöcke für das Ausgabe-Element. Hier könnt ihr eure vorgefertigte Antwort hinterlegen – oder erneut eine Liste von möglichen Antworten, damit die List nicht so schnell auffällt. 😉

image2022-3-7_13-50-4.png

image2022-3-7_13-51-14.png

3.

Ruft abschließend die Musikwiedergabe auf – alles weitere passiert automatisch, wenn die Musikwiedergabe beendet ist.

image2022-3-7_13-55-39.png image2022-3-7_13-54-39.png

4.

So könnte es dann aussehen.

magier3_bloecke.png




3.) Testen

Funktioniert unsere App?

1.

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

Bildschirmfoto 2022-03-02 um 14.45.29.png

2.

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

Vergesst nicht den Haken bei Use Legacy Connection  zu setzen.

Bildschirmfoto 2022-03-02 um 14.46.55.png

3.

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

Bildschirmfoto 2022-03-02 um 14.48.35.png


Testet die App nun ausführlich!

  1. Funktioniert die App weiterhin?

  2. Funktionieren die beiden versteckten Tasten? Könnt ihr die Antwort des Magiers beeinflussen?

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