Počítačová grafika 02

1. Počítačová grafika 02 Aplikace výpočetní techniky Mgr. Milan Randák

2. Umístění scriptů • vzhledem k evoluci systému (Adobe Flash CS2) se skripty zásadně umísťují do snímků časové osy • ovládací prvky na ploše (tlačítka) umisťujeme do samostatné vrstvy • scripty nejlépe umisťujeme do časové osy

4. Umístění scriptů • ovládací prvky pojmenujeme (dole v Property inspektoru) • scripty jsou zakončeny středníkem • vetší úseky kódu (funkce) se oddělují složenými závorkami

5. struktura scriptu: vzad.onRelease = function () po uvolnění tlačítka s názvem „vzad“ se provede funkce nextFrame() – přechod na další snímek prevFrame() – přechod na předchozí snímek gotoAndStop (10) – přejde a zastaví se na snímku 10 script na ovládání časové osy

6. script na ovládání časové osy • gotoAndStop (‚konec‘) – přejde na snímek pojmenovaný v Property inspektoru ‚konec‘ (u pojmenovaného snímku se objeví na časové ose praporek)

7. stavy tlačítka, scripty pro časovou osu

8. vlastnosti MovieClipů • všechny vlastnosti, které jsme nastavovali v Property inspektoru, pomocí panelu Transform a Align lze nastavit pomocí scriptů

9. vlastnosti MovieClipů • jedná se především o tyto vlastnosti – velikost, rotace, pozice x a y souřadnice, x-škála a y-škála (v procentech), průhlednost

10. vlastnosti MovieClipů • pojmenujeme MovieClip na ploše (v Property inspektoru) a zadáváme vlastnosti pomocí scriptů • můžeme dynamicky a interaktivně ovlivňovat prezentace apod. • pomocí tlačítek např. můžeme posouvat objekty, rotovat, měnit průhlednost

11. vlastnosti MovieClipů

12. Zpracování událostí • Předpokládejme, žechcemevytvořittlačítko Enter - napříkladuživatelněco napíše do vstupního pole, podokončeníklepnenatlačítko Enter, a pak se text zobrazí ve výstupním pol.

13. Zpracování událostí • Co potřebujeme, je nějakýzpůsob, jakzjistit, žeuživatelkliknulnatlačítkoa nějakýzpůsobjakošetřit co dělat, když se totostalo…

14. ActionScript a události • KódjazykaActionScript je proveden, jakmiledojde k události: například, kdy je načtenfilmovýklip, kdyžvstoupilklíčovýsnímeknačasovéosenebokdyžuživatelklepnenatlačítko.

15. ActionScript a události • Událost můžebýtspuštěnauživatelemnebo v systému. Uživateléklikajínatlačítkamyši a tisknou klávesy; systémspustíudálosti, pokudjsousplněnyurčitépodmínkynebodokončeny určité procesy (např. soubor SWF senačte, časováosadosáhneurčitéhosnímku…).

16. ActionScript a události • Dojde-li k události, musíme napsatobslužnourutinuudálosti(eventhandler), která bude reagovatnaudálostiakcí.

17. ActionScript a události • Připsaníkódupro zpracováníudálostí, existujítřidůležitéprvky, kteréchceteidentifikovat: • události • zdrojudálostí • odezva

18. ActionScript a události Zdrojudálosti: • kterýobjekt je ten který vyvolaludálost? • Napříkladkteré tlačítko bylo stisknuto, nebokterýobjekt Loader načítá obrázek? • Zdrojudálosti je známýtakéjakocíludálosti, protože je to objekt, na který je zaměřen Flash Player (ve kterém událost vlastně nastává).

19. ActionScript a události Událost: • co je ta věc, která se stane, na kterouchcetereagovat? • To je důležitéstanovit, protožemnohoobjektůvyvolává současněněkolikudálostí. Odpověď: • jakékrokychceteprovádětkdyž k událostidojde?

20. ActionScript a události • Kdykolibudete psát kód pro zpracováníudálostí, budeobsahovattytotřiprvky a kódbudemít tuto základnístrukturu (prvkytučnýmpísmemjsouzástupnésymboly, kterézměníte pro váškonkrétnípřípad.) function eventResponse(eventObject:EventType):void { // zde budou příkazy pro odezvu na událost. } eventSource.addEventListener(EventType.EVENT_NAME, eventResponse);

21. ActionScript a události • Zaprvémusímedefinovatfunkci, což je způsob, jakurčit, žechceteakceprovést v reakcinaudálost. • Dálezavoláme metoduaddEventListener() zdrojovéhoobjektu, v podstatě „napojení" funkcezadanéudálostitak, žekdyž k událostidojde, jsouprováděnypříkazy funkce.

22. ActionScript a události • Funkceposkytujezpůsob, jakseskupit akce podjednímnázvem, který je jakobyzástupce k prováděníakcí.

23. ActionScript a události • Kdyžchcetevytvořitfunkci pro zpracováníudálostí, musítezvolitnázev pro funkci (v tomtopřípadě je pojmenovanáeventResponse), a je nutnézadattakéjedenparametr (eventObject). • Specifikováníparametrufunkce je jakodeklarováníproměnné, takžemusíterovněžuvéstdatovýtypparametru.

24. ActionScript a události • Prokaždouudálost je definována třída a datovýtyp, kterýzadátejakoparametrfunkce,a je vždy spojen s konkrétníudálostí, na kterouchcetereagovat. • Nakonec mezilevou a pravousloženouzávorku ({...}), zapišteinstrukce, kterémápočítačprovést, když k událostidojde.

25. ActionScript a události • Jakmilezapíšetefunkcizpracováníudálostí, musítesdělitobjektuzdrojeudálosti (objekt, na kterém se událoststane – napříkladtlačítko), žemázavolat funkci určenou k této události

26. ActionScript a události • To provedetezavolánímmetodyaddEventListener() tohotoobjektu (všechnyobjekty, kterémajíudálostimajítakémetoduaddEventListener()).

27. ActionScript a události • MetodaaddEventListener() přebírádvaparametry: • názevurčitéudálosti, na kterouchcetereagovat. • názevfunkceodezvynaudálost.

28. Popis procesuzpracováníudálosti • Co se stane, kdyžvytvoříteposluchačeudálosti? Podívejme se navytvořenífunkceposluchače, která se vyvolá při klepnutínaobjektnazvanýmyButton. • Takto by tentokódskutečněfungovatpokud je spuštěn v přehrávači Flash Player: function eventResponse(event:MouseEvent):void { //Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse);

29. Popis procesuzpracováníudálosti • Když se soubor SWF načte, přehrávač Flash Player dávánavědomískutečnost, žeexistujefunkcepojmenovanáeventResponse(). Function eventResponse (event: MouseEvent):void { //actions performed in response to the event go here. } myButton.addEventListener(MouseEvent.CLICK, eventResponse);

30. Popis procesuzpracováníudálosti • Přehrávač Flash Player pakspustíkód (konkrétně, řádkykódu, kterénejsouve funkci). V tomtopřípadě je to pouzejedenřádekkódu: zavolánímetodyaddEventListener() zdrojovéhoobjektuudálosti (pojmenovanýmyButton) a procházíeventResponsejakoparametr. Function eventResponse (event: MouseEvent):void { // Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse); myButton listeners: function1() function2()

31. Popis procesuzpracováníudálosti • VnitřněmáobjektmyButtonseznamfunkcí, kterénaslouchajíjehoudálostem, takžekdyž je zavolánametodaaddEventListener(), myButtonuložífunkcieventResponse() do seznamuposluchačůudálostí. Function eventResponse (event: MouseEvent):void { // Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse); myButton listeners: function1() function2() eventResponse()

32. Popis procesuzpracováníudálosti • V určitémokamžikuuživatelklepnenaobjektmyButton, událost click (identifikovánajakoMouseEvent.CLICK v kódu). V tom okamžikuse stane následující …

33. Popis procesuzpracováníudálosti Přehrávač Flash Player vytvoříobjekt, instance třídypřidružené k tétoudálosti (v tomtopříkladuMouseEvent).

34. Popis procesuzpracováníudálosti Pro mnohéudálosti to bude instance třídy Event; pro událostimyši to budeMouseEvent instance; a pro jinéudálosti to bude instance třídy, spojená s danouudálostí.

35. Popis procesuzpracováníudálosti Tentoobjekt, který je vytvořen se označujejakoobjektudálosti, a obsahujeinformace o události, která se stala: jakýtypudálosti je to, kde se to stalo a dalšíspecifickéinformace, jsou-li k dispozici.

36. Popis procesuzpracováníudálosti Function eventResponse (event: MouseEvent):void { // Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse); eventObject target:myButton type:mouseEvent.CLICK … myButton listeners: function1() function2() eventResponse()

37. Popis procesuzpracováníudálosti Přehrávač Flash Player pakvyhledáposluchačeudálostíuloženév objektumyButton.

38. Popis procesuzpracováníudálosti Projde tytofunkcejednupodruhé pomocívoláníkaždéfunkce a předáobjektudálostifunkcijakoparametr.

39. Popis procesuzpracováníudálosti Vzhledem k tomu, žefunkceeventResponse() je jedním z posluchačůmyButton, jakosoučásttohotoprocesu Flash Player také zavoláfunkcieventResponse().

40. Popis procesuzpracováníudálosti Function eventResponse (event: MouseEvent):void { // Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse); eventObject target:myButton type:mouseEvent.CLICK … myButton listeners: function1() function2() eventResponse()

41. Popis procesuzpracováníudálosti • Kdyžje zavolánafunkceeventResponse(), kód v tétofunkci se spustí, takžejsouprováděnyspecifikovanéakce. Function eventResponse (event: MouseEvent):void { // Akce prováděné při zavolání funkce. } myButton.addEventListener(MouseEvent.CLICK, eventResponse); eventObject target:myButton type:mouseEvent.CLICK … myButton listeners: function1() function2() eventResponse()