Les 2: Interactie in je space door middel van klikbare objecten en actionscript. Wat is actionscript en programmeren?

Presentatie over: "Les 2: Interactie in je space door middel van klikbare objecten en actionscript. Wat is actionscript en programmeren?"— Transcript van de presentatie:

1

2 Les 2: Interactie in je space door middel van klikbare objecten en actionscript. Wat is actionscript en programmeren?

3 Vandaag gaan we het hebben over actionscript en programmeren.

4 Waarom leren programmeren? Totale controle over gedrag van een ontwerp

5 Wat is een programma? Een programma is een verzameling commando’s die van boven naar beneden uitgevoerd kunnen worden. De commando’s zijn geschreven in een computertaal (bijvoorbeeld Actionscript, Javascript, Java, C/C++, Processing). Als alle commando’s zijn uitgevoerd, stopt het programma.

6 Voorbeelden van een programma Een paar korte programma’s waarin je de volgorde ziet (hallo wereld)

7 Programma’s draaien Sommige programma’s worden uitgevoerd door een ander programma. Actionscript door Flash Player Javascript door een Webbrowser Processing door de Java Virtual Machine Maar niet alle programma’s. C/C++ programma’s draaien direct op de computer (maar worden nog wel door het besturingssysteem (ook een programma) in de gaten gehouden)

8 Compileren De meeste programmacode kan niet direct gedraaid worden. Eerst wordt de code vertaald in een vorm die voor computers efficiënter is, maar voor mensen onleesbaar. De vertaalde code wordt gedraaid door een ander programma.

9 Compileren in Flash Je schrijft het programma in een fla-bestand Dit wordt vertaald naar een swf-bestand (tijdens het exporteren). De volgorde van commando’s wordt niet veranderd. De Flash player voert het swf-bestand uit.

10 Twee voorbeelden van programma’s die blijven draaien (loop.fla)

11 Programma’s die blijven draaien De meeste programma’s moeten blijven draaien totdat ze afgesloten worden Verschillende talen lossen dit op verschillende manieren op. Flash gebruikt frames Processing gebruikt een speciaal commando Het principe blijft hetzelfde: regels worden van boven naar beneden uitgevoerd. Dit gaat net zolang door totdat de gebruiker het programma sluit

12 Informatie opslaan Informatie die later nodig is in een programma kan opgeslagen worden Deze informatie sla je op in variabelen Een variabele kun je zien als een doos met een label. De informatie is de inhoud van de doos

13 Voorbeelden van variabelen Drie voorbeelden van programma’s met variabelen

14 Variabelen voor gebruikersinformatie Als het programma moet reageren op invoer van de gebruiker, dan heb je variabelen nodig om deze invoer in op te slaan. Twee voorbeelden

15 Programmeerfouten Voorbeeld van een foutmelding: variabele is weggehaald Je krijgt een foutmelding. Dit is een “service” van de compiler. Voordat hij de fla vertaalt naar een swf, controleert hij de fla eerst op fouten. Handig want dan wordt de gebruiker niet met deze fouten geconfronteerd. Het oplossen van deze fouten wordt debuggen genoemd.

16 Volgorde toch niet belangrijk? De variabele is nu onder de rest van de code geplaatst. Dit keer krijg je geen foutmelding, maar ook niet de waarde die je verwacht (je krijgt namelijk undefined). Nu lijkt het alsof de Flash player het toch niet zou nauw neemt met de volgorde. Ook dit is een “service” van de compiler. De compiler controleert of er ergens in het programma de variabele kan vinden die worden gebruikt. Als dat zo is, dan wordt die variabele voor de rest van de code geplaatst.

17 Interactie In flash kunnen we op twee manieren interactie toekennen aan een object. Met een Button of met een Movieclip.

18 Een button heeft alle functionaliteit in zich: Een handje als je met de cursor over de knop gaat. En ingebouwd een mogelijkheid om de knop te veranderen bij een MouseOver of Down.

19 Een MovieClip heeft dat niet standaard. Dat kun je wel toevoegen aan je Clip door middel van Actionscript. Waarom dan een MovieClip? Omdat het soms handiger is.. Hoe kom je daar achter? Proberen.. Op http://www.michelvandewiel.nl staat een voorbeeld van een MovieClip die werkt als een button.http://www.michelvandewiel.nl

20 Het is erg belangrijk dat je alles binnen je Immersive space goed benoemd. Zowel de objecten in je Library, je lagen en natuurlijk niet vergeten je instancenames goede en duidelijke namen geven. Zorg dat je consequent bent met je naamvoering. Anders werkt je actionscript niet.

21 In actionscript kun je werken met zowel framenumbers als framelabels. Het werken met framelabels is vooral handig omdat het logischer is. Het frame met label “badkamer” is logischer dan frame nr. 45..

22 Met F9 kun je altijd bij je actions, of je sleept het actions venster naar het balkje waar ook je tijdlijn te vinden is.

23 Hoe kun je dan nu je button of MovieClip laten werken? Je hebt daar wat actionscript code voor nodig: McNaam.addEventListener(MouseEvent.CLICK, FunctionNaam); function FunctionNaam(evt:MouseEvent) { gotoAndStop("ruimte1"); }

24 Opdracht: Maak een button of een movieclip-button, en als je hier op klikt gaat je auto pas rijden (op het volgende frame). Op de achtergrond zie je de zon bewegen over het scherm, dit mogen ook wolken zijn. (de animatie van het auto-rijden heeft geen invloed op de zon)

25 Opdracht: We gaan ook een begin maken van je immersive-space tijdlijn, met daarop buttons of movieclips die van de ene naar de andere ruimte navigeren. Dit mogen vierkantjes of iets dergelijks zijn, die we later gaan vervangen voor de uiteindelijke assets. Volgende week heb je dit af.