Wat ga je maken

Als je deze tutorial helemaal volgt heb je een app gemaakt die antwoord gaat geven op al de vragen die je hebt. Als je de app gebruikt dan stel je eerst hardop een vraag. Daarna schud je met je telefoon of klik je op de afbeelding en de telefoon zal je een antwoord geven. Zorg er wel voor dat de volumeknop van je telefoon hoog genoeg staat zodat je het antwoord kunt horen.

Wat ga je leren

  • Je leert om een app te laten praten
  • Je leert hoe je een afbeelding klikbaar maakt
  • Je leert hoe je acties uit kunt voeren door je smartphone te schudden
  • Je leert hoe je een lijst maakt en deze uit kunt breiden
  • Je leert hoe je een willekeurig item uit je lijst kunt kiezen

Wat heb je nodig

  • Label component
  • Afbeelding component
  • VersnellingsSensor component
  • TekstNaarSpraak component

Je kunt deze componenten in de volgende categoriën vinden.

Ontwerp

Als je het ontwerp bovenaan deze tutorial wilt gebruiken kun je het aia-bestand downloaden dat onderaan deze tutorial te vinden is. Je moet dan nog wel zelf de VersnellingsSensor en TekstNaarSpraak component toevoegen.

Als je helemaal vers wilt beginnen sleep je de volgende componenten naar je scherm

Label1 moet je als volgt instellen

Afbeelding1 moet je als volgt instellen

De optie Clickable die hieronder zichtbaar is betekend klikbaar. Dit geeft je de mogelijkheid om een afbeelding als een soort knop te gebruiken. In dit geval moet je zorgen dat deze optie aangevinkt staat.

De afbeelding die ik gebruik heb kun je hieronder downloaden. Sla hem op onder de naam codiclicker.png

Na het downloaden kun je hem door in het Media venster op Bestand opladen te klikken in je project importeren en gebruiken.

Label2 moet je als volgt instellen

Blokken

Welke blokken moet je allemaal maken om de app te laten werken. We gaan werken met een lijst met mogelijke antwoorden. Zie hieronder hoe die er uit ziet.

Met deze blokken maak je een lijst van zinnen die uitgesproken kunnen worden. Als je voor het eerst een maak een lijst blok pakt ziet het er zo uit.

Maar omdat de lijst groter is moeten er dus regels bij. Dit doe je op de volgende manier. Klik op het witte tandwiel linksboven in het maak een lijst blok. Je kunt dan extra regels toevoegen door een item blok te slepen en los te laten. Je ziet dat je een item blok op elke willekeurige plaats in de lijst kunt plaatsen.

Uiteindelijk moeten de door jou gemaakte blokken er zo uitzien.

Het volgende blok dat we nodig hebben is het kies een willekeurig item lijst blok. Dat doet precies wat de naam zegt. Het bevind zich in de categorie Lijsten.

Het blok kijkt straks naar de antwoordenlijst lijst in dit geval en kiest ééń van de items van de lijst en geeft dit terug aan het aanroep TekstNaarSpraak1.Spreek blok.

Deze blokken zorgen ervoor dat, als je met je telefoon schud, er een willekeurige zin uit de lijst antwoordenlijst word gepakt en deze word uitgesproken.

Deze blokken zorgen ervoor dat, als je op de afbeelding klikt, er een willekeurige zin uit de lijst antwoordenlijst word gepakt en deze word uitgesproken.

Testen

Je kunt je app nu testen met behulp van de companion app.

Andere taal

Mocht je een smartphone hebben die ingesteld is op een andere taal dan Nederlands dan zullen de uitgesproken zinnen heel vreemd klinken. Om toch te zorgen dat ze in het Nederlands uitgesproken worden kun je de onderstaande blokken toevoegen aan het Initialiseer blok van Screen1.

Deze blokken in het Initialiseer blok worden altijd als eerste uitgevoerd bij het opstarten van de app dus voordat alle andere blokken worden uitgevoerd. Als het goed is hoor je nu een Nederlandse of Vlaamse stem.

Wat kun je verder nog doen?

  • Maak de lijst met antwoorden langer, je weet nu hoe dat moet.
  • Maak een verdwaal app. In plaats van antwoorden kun je de app bij een klik op de afbeelding laten zeggen welke kant je op moet. Bijvoorbeeld: links, rechts, vooruit, terug. Zorg er wel voor dat je niet echt verdwaald maar altijd nog de weg terug weet. 😉
  • In de code kun je zien dat we 2 keer nagenoeg dezelfde code hebben gemaakt. Hier kun je lezen hoe je dit kunt veranderen.

Project downloaden

MagicCodi_NL_leeg.aia
Nextcloud - a safe home for all your data