Ennek a játéknak a célja a rajzvászon (Canvas) bemutatása. Mozgatható szereplőket csak a rajzvászonra helyezhetjük el. A Scratch-et egyébként úgy is felfoghatjuk, mint egy rajzvászon; az App Inventor ilyen értelemben többet tud, mivel a rajzvásznon kívül is tudunk komponenseket elhelyezni. Viszont az App Inventor szereplőválasztáka igen vérszegény: mindössze egy labdát (pontosabban fogalmazva: egy kitöltött kört) lehet kiválasztani, ill. egy általános kép szereplőt (ImageSprite), melyhez feltölthetünk mi magunk képet, ráadásul igen sok hasznos funkció is hiányzik.
Angol nyelvű útmutatók:
- https://www.youtube.com/embed/w0yxJSlC00w
- http://appinventor.mit.edu/explore/sites/all/files/hourofcode/BallBounceTutorial_2perpage.pdf
- http://appinventor.mit.edu/explore/ai2/minigolf.html
Első lépés: golflabda. Design:
- Screen1
- Title (cím): Minigolf
- ScreenOrientation (képernyő irány): Portrait (portré)
- Drawing and Animation → Canvas
- Név (Rename): Vászon
- BackgroundColor (háttérszín): zöld
- Height (magasság): 350 pixels (képpont)
- Width (szélesség): Fill parent (szülő kitöltése)
- Drawing and Animation → Ball: dobjuk rá a rajzvászonra
- Név: Golflabda
- Radius (átmérő): 10
- PaintColor (kitöltés színe): fehér
- X: 150
- Y: 300
Blokk nézetben valósítsuk meg a következő programot:
Próbáljuk ki: ujjunkkal a telefonon próbáljuk meg „lökdösni” a labdát.
Második lépés: lassulás. Megvalósítjuk, hogy lassuljon a golflabda. Design módban:
- Sensors → Clock (óra): ez egy ún. nem látható komponens.
- TimeInterval (időintervallum): 100
A kódja (Blocks):
Harmadik lépés: lyuk. Design:
- Drawing and Animation → Ball: a vászonra dobjuk rá
- Név: Lyuk
- Radius: 15
- X: 150
- Y: 50
A kódban, ha ütközik a golflabda a lyukkal, akkor egyelőre csak megállítjuk a golflabdát. Az ütközés ellenőrzéskor meg kell vizsgálnunk, hogy mivel ütközik:
Negyedik lépés: akadály. Design:
- Drawing and Animation → ImageSprite: a vászonra ejtsük rá
- Picture: ezt a képet mentsük le a saját számítógépünkre: http://appinventor.mit.edu/explore/sites/all/files/tutorials/miniGolf/golf_obstacle1.png, majd töltsük fel (Upload File…)
- X: 100
- Y: 125
A kódban (Blocks) ha a golflabda ütközik az akadállyal, akkor visszapattan. (Megjegyzés: ez csak vízszintes pattanásnál működik helyesen.)
Ötödik lépés: új játék, pontszámítás. Design:
- Layout → HorizontalArrangement (vízszintes elrendezés): ez kerüljön a vászon alá
- AlignHorizontal (vízszintes igazítás): Center (középre)
- AlignVertical (függőleges igazítás): Center
- Width: Fill parent
- User interface → Button (nyomógomb): ez kerüljön bele az imént létrehozott vízszintes elrendezésbe.
- Név: Újjáték
- Text: Új játék
- User interface → Label (címke): ez is a vízszintes elrendezésbe kerüljön, jobbra a nyomógombtól.
- Név: Ütésekszáma
- Text: Ütések száma:
- User interface → Label (címke): ez is a vízszintes elrendezésbe kerüljön, jobbra az előző címkétől.
- Név: Ütésszám
- Text: 0
A komponensek végeredménye az alábbi:
A kódban felveszünk egy globális változót, mellyel az ütéseket számoljuk, meg kell valósítani az új játék nyomógomb kódját, és a golflabda lökésének a kódját is módosítjuk, az alábbi módon:
Végeredmény: Minigolf.aia.