FLASH rychle a snadno 10.

Na co se dnes podíváme …

V naší minulé procházce mezi různorodými „vychytávkami“ pro tvorbu flashových her jsme se zaměřili na obecné řešení některých problémů. Dnes změníme úhel pohledu o 180° a podíváme se na konkrétní rozbor problému a jeho realizaci, protože praxe bývá i v případě flashe nejlepším učitelem.

Jak řešit problémy?

Základem analýzy každého problému je rozbor jeho podstaty a uvědomění si jaký je náš cíl, jakými prostředky ho chceme dosáhnout a jaké při tom máme možnosti. Volbou té pro nás nejvhodnější alternativy potom rozvineme právě ji a následně ji aplikujeme na daný problém.

Jednoduchým příkladem z běžného života se podíváme věci na kloub. Jdeme si koupit do obchodu balení buchet, máme na to 25 Kč. Ovšem 10 Kč musíme použít na vozík. Nabízí se snadné řešení, koupíme jiné levnější buchty. Další alternativou je, že se vrátíme domů pro další peníze. Nebo si buchty vůbec nekoupíme? Ale co si vozík vůbec nevzít a koupit si to balení buchet …

Jak na to s Flash …

Stejným způsobem lze analyzovat i problémy při práci s flashem a programováním. Můžeme problém přenést do roviny, která nám nejlépe vyhovuje a aplikovat na něj naši oblíbenou metodu. Také se můžeme s problémem poprat tou nejpřímější cestou i za cenu toho, že se budeme muset naučit „něco nového“. Jsme-li líní, můžeme se jednoduše problému vyhnout.

Řekněme, že chceme vytvořit do naší prezentace odkaz, na který když najedeme kurzorem, začne blikat. Jednou cestou je vytvoření movie clipu, který má 2 fáze, blikání a neblikání. Nad tento movie clip umístíme neviditelné tlačítko. Pokud na něj najede kurzor myši, vyvolá se blikání tohoto klipu.

Další možností je vytvořit si tlačítko, které má jako fázi over vložený blikající movie clip. Pokud by ani jedna z možností nebyla v našich silách, udělám prostě permanentně blikající movie clip, který ani nebude odkazem. Kterou alternativu zvolíme je jen na nás.

Rozkouskovat a naporcovat

Oblíbenou strategií je také rozložení problému na menší celky, které postupně řešíme a ve výsledku tak postupně rozřešíme zdánlivě obtížný úkol. Té také využijeme při tvorbě naší hry. Nejprve si shrneme její zadání. Měli bychom vytvořit systém, který bude tak dlouho předhazovat k rozbalení hlavolamy origamy, dokud jich řekněme 5 nerozbalíme. Jednotlivé části jsme si již načrtli, ale je důležité si je zorganizovat a připravit k práci. Jinak bychom mohli začít tvořit na špatném konci a nakonec vše muset dělat znovu.

Pracovní plán

1. Vytvoření kostičky origami.

2. Když se na kostičku klikne, rozbalí se.
3. Vytvoření rotujícího cyklu kostiček.
4. Zpracování správy životů a bodů hráče pomocí action scriptu.

Vytvoření kostičky origami

Na první pohled se tento plán zdá triviálním, ale je základem celé práce. Zatím se tedy nebudeme zabývat řešením bodu 4, který je největším kouskem pomyslného koláče, který před námi právě leží na stole. Popořadě se podíváme na první tři body. Kostičku origami vytvoříme jako movie clip - ač je to jedno, ale budeme zde pracovat pouze s jednou variantou. Vytvoříme tedy statický snímek zabaleného origami. Další snímky budou tvořeny animací rozbalení této skládačky. Dále umístíme nad fáze skládačky neviditelné tlačíko. Když se na něj klikne, spustí se animace rozbalení origami. Toto celé potom uložíme jako jeden movie clip, aby se nám s tím lépe pracovalo.

Ach ty kurzory ..

Pokud se má v oblasti zabalené skládačky změnit sám kurzor, opět máme několik možností a je na místě uvažovat, která z nich více zatíží paměť počítače a toto je jedna z dalších základních pouček, snažit se pracovat s co nejvolnějšími systémovými prostředky. My zvolíme variantu tak, aby se měnil opravdu kurzor a ne pouze prostředí. K tomu nám poslouží z minulého dílu nabytá znalost práce s kursorem, takže ošetříme stavy kurzoru na a vně origami akcemi, které zamění kurzor třeba za dlaň lidské ruky. Uděláme to tedy tak, že pokud se dostane kurzor nad skládačku, zmizne pravý kurzor a na scéně se zviditelní ten náš. Pokud již nejsme v oblasti skládačky, kurzor se opět objeví a naše náhražka se zneviditelní. Musíme pak ale ošetřit, aby nešlo zvolit skládačku, na kterou již bylo kliknuto, proto nad snímky jejího rozbalování již neumístíme neviditelné tlačítko.

Vhodně musíme vytvořit i kurzor jako instanci na hlavní scéně (na začátku umístěný třeba někam mimo, nebo neviditelný). Akce jsou pro něj jednoduché (lze je vhodně rozšířit, pokud opravdu lpíme na nenáročnosti výsledné aplikace, mohl by se ten náš kurzor hýbat pouze je- li aktivován, což bychom ošetřili proměnnou a podmínkovým cyklem):

Rotující origami

Vytvoření seskupení skládaček, které budou rotovat na scéně není ani tak složitá jako spíše zdlouhavá práce, protože toho v našem případě dosáhneme vytvořením movie klipu. Do toho umístíme naše objekty origami a naskládáme je různě na scénu. Dále se pak v průběhu času animujeme jejich projíždění scénou tak, aby interval mezi jejich objevováním byl zachován i při opakovaném přehrání klipu.

Naplánování hlavního programového kódu

I v tomto případě je důležitá snaha o takové řešení, které nám bude nejvíce vyhovovat. S trochou nadsázky lze i použít tento systém: „... když mi to pořád nejede, tak to udělám jinak i za cenu toho, že by to mohlo být o něco pomalejší, ale alespoň vím, že to pak poběží …“, někdy rozdíly nejsou tolik patrné, jindy naopak ano. Používat osvědčená řešení přináší i další výhodu, recyklování již použitého programového kódu, nebo struktury. V našem případě ale ještě nemáme na čem stavět a proto se pokusím o letmý nástin jednoho z možných řešení našeho systému. S ohledem na naše znalosti musíme zatím zůstat u primitivnější stavby kódu, ale na druhou stranu ne každý, kdo programuje ve flash musí mít již jiné programátorské zkušenosti. Nejprve si tedy navrhneme proměnné, které použijeme.

Proměnné

Počet aktuálně nerozbalených kostiček – kostickynascene

Počet kostiček, které mají být na daném snímku nerozbalené - zakladkosticek

Počet životů hráče - zivoty

Nyní si tedy nejprve obecněji probereme principy počítání kostiček a životů v našem jednoduchém pojetí. Na každém snímku, na kterém se objeví nějakým origami se zvětší proměnná kostickynascene. Po rozbalení nějaké kostičky se zmenší kostickynascene. Naopak na každém snímku, na kterém některá kostička zmizne, si předem definujeme, kolik má být po zmiznutí kostičky na snímku nerozbalených kostiček v proměnné zakladkosticek. Srovnáme-li pak na těchto klíčových snímcích počty zakladkosticek a kostickynascene, můžeme dále operovat s životy hráče. Tento model není nijak náročný a při jeho stavbě se navíc opřeme o výstavbu našich prvních flashových funkcí, jak si dále předvedeme.

Rozčlenění funkcionality

Nyní si tedy shrneme, jak by šlo zkratkovitě poznamenat výše načrtnuté v podobě bodů, které máme při programování dodržet.

1. vytvořit kostičku, připočte to k aktuálním počtu nezmáčknutých kostiček (kostickynascene) 1
2. když se na ni klikne, zmizne, a pošle to kostickynascene rootu na odečtení od nezmáčknutých kostiček 1 a ke skore to také přičte 1
3. vždy při příchodu na klíčový snímek porovná počet kostiček, co tam mají být (zakladkosticek), a počet nezmáčknutých kostiček kostickynascene
4. pokud je zakladkosticek menší než kostickynascene, tak dlouho se odečítá kostickynascene a tím i životy (zivoty), až se srovnají zakladkosticek a kostickynascene
5. pokud je pak zivoty menší jak 0, končí hra

Funkce

Tyto základní body je už snadné dodržet, my se zaměříme na vytvoření relativně nejsložitější části programování, totiž kontrolní funkci, kterou umístíme na každý snímek, na kterém kontrolujeme stavy kostiček.

Této funkci poté pošleme počet zakladkosticek, vše se porovná s našimi pevnými ukazateli životů a v případě konce hry přesměruje na daný snímek (outro). Volání naší funkce potom může vypadat třeba takto:

Naši funkci můžeme definovat třeba na snímku našeho menu a jak vidíte, není na jejím používání nic těžkého a přitom nám usnadní tolik práce. Při doplňování jednoduchého přičítání proměnných s životy a rozbalenými kostičkami už náš návrh bude zcela dokončen. Takto snadno lze flashové hry realizovat. Ale jde i složitěji jak dokládá následující náhled :-):

část složitějšího programového kódu

Dnes jsme tedy naši hru pomyslně dostali do finální podoby, pokud si odmyslíme obrazovku outro, na které umístíme vypsání skóre v podobě proměnné skore a odkazu na hlavní menu, ovšem naše cesta zde ještě nekončí. Příště si rozšíříme stávající hru mimo jiné o spolupráci s webem.