User manual

SNAIL
BITMAPS
BINDEN
In de voorgaande voorbeelden werden de spelelementen voornamelijk vertegenwoordigd
door de lijnen en pixels. In dit voorbeeld leert u hoe u meer complexe afbeeldingen kunt
integreren in een spel. Daarvoor leert u de Onlineconverter op Tiny.systems kennen.
Op de internetsite
http://tiny.systems/article/mosaic.html
bevindt zich een gereedschap waarmee u gemakkelijk tekeningen kunt maken. Op deze
website vindt u in het midden van een grijs vlak. Als u ergens klikt in dit vlak, activeert u
daarmee een pixel. Klikt u nogmaals op dezelfde pixel, dan verdwijnt deze weer. Klik en
houdt de muisknop ingedrukt terwijl u de muisaanwijzer over het gebied beweegt. Zoals u
kunt zien, kunt u ook hele tekeningen maken. Het tekenvlak heeft een initiële afmeting van
16 x 16 px. Voor grotere tekeningen kunt u het gebied vergroten door te klikken op het
juiste pictogram onder het tekenvlak. Als u ontevreden bent over uw tekening, kunt u het
hele gebied verwijderen door te klikken op de X.
Voor de eerste poging kunt u een spelfiguur van 16 x 16 px maken. Wanneer u klaar bent,
klikt u op de haak in de linkerbenedenhoek. Het lijkt op een behoorlijk lange hexadecimale
code die u moet kopiëren in het snail-programma. Open daarvoor het programma door te
klikken op
Bestand -> Voorbeelden -> GameEngine -> GameEngine1 -> Snail
. Op
regel 10 van het programma vindt u de variabele snail, die al met een andere afbeelding
wordt gevuld. Voeg in plaats van de bestaande hexadecimale getallen de door de
mosaic-pagina gegenereerde in. U kunt vervolgens het programma uploaden en zult
merken dat de door u getekende afbeelding op het scherm verschijnt (vergeet niet de
contrastwaarde aan te passen). Met de pijltjestoetsen kunt u de afbeelding op het scherm
verplaatsen. Hiervoor is een nieuwe functie van de library verantwoordelijk, die
DrawBitmap() heet:
engine.drawBitmap(snailX, snailY, 16, 16, snail);
De eerste twee parameters van de functie bepaalt de positie van het beeld op het scherm,
terwijl de volgende twee de grootte van de afbeelding aangeven. Op de laatste positie in de
parameterlijst staat de variabele zelf, waarin u de grafische gegevens opgeslagen heeft. Zo
eenvoudig kan het weergeven van afbeeldingen op het scherm zijn.
Maar er is een tweede manier om Arduino-compatibele grafische gegevens te maken met
de Mosaic-pagina. Wellicht is u de toets, die met bestandenselecties wordt aangeduid,
reeds opgevallen. Het is namelijk mogelijk om bitmap-bestanden via de site te uploaden en
automatisch in hex-code te formatteren. Merk echter op, dat niet alle bitmap-bestanden zo
eenvoudig te converteren zijn. U moet ervoor zorgen dat het een monochrome