Macromedia FLASH 4 – znalostní kvíz

Jedním ze způsobů, jak udělat stránky na Internetu více přitažlivé pro uživatele, je udělat je více interaktivní. Jedním z velmi interaktivních prvků, kterým můžete vaše stránky oživit je „znalostní kvíz“, který do stránky vložíte. V dnešním článku se naučíme, jak takový jednoduchý „znalostní kvíz“ vytvořit.

Princip fungování takového kvízu je velice jednoduchý. Animace se skládá z  několika snímků – z tolika, kolik otázek budete pokládat a z jednoho, kde se zobrazí výsledek. V každém snímku se nachází několik tlačítek, přičemž vždy pouze jedno přičte do určité proměnné další bod a poté zobrazí následující snímek. Ostatní tlačítka pouze přejdou na další snímek. V posledním snímku se nachází textové pole, které zobrazí proměnnou, které je přiřazen výsledný počet správných odpovědí.

Nejdříve vytvořte novou scénu o velikosti 300 x 150 px (CTRL+M) a dle obrázku vytvořte v této scéně čtyři vrstvy. V první vrstvě se bude nacházet pouze pozadí a v druhé nadpis "znalostní kvíz FLASH". Obsah těchto dvou vrstev se v průběhu animace nebude měnit a nebude zde umístěn ani žádný klíčový snímek.

Vytvořte další vrstvu a pojmenujte ji např. "obsah". V této vrstvě se budou nacházet otázky a možností odpovědí. Každý snímek této vrstvy bude klíčový a bude se v něm měnit obsah. Ještě než začnete psát kvízové otázky je třeba si vytvořit tlačítko, které bude umístěno vedle odpovědí.

Vytvořte si tedy nový symbol (CTRL+F8, Button) a pojmenujte jej "click". Vytvořte zde kolečko s černým okrajem a modrou barvou výplně. Do všech poloh vložte klíčové snímky a v poloze OVER zvětšete kolečko na 130% a kbelikem vyplňte vnitřek kolečka zelenou barvou. V poloze DOWN ponechte původní velikost a pouze vyplňte vnitřek zelenou barvou.

Přepněte se zpět do hlavní scény a do prvního snímku vložte následující akci:

Tato akce zastaví animaci na prvním snímku a stanový proměnnou "odpoved" a nastaví je hodnotu na nulu. Tato proměnná bude vyjadřovat počet správných odpovědí.

Nyní si otevřete si knihovnu (CTRL+L) a přetáhněte do scény tlačítko na místo, kde se bude nacházet odpověď. Tlačítko pak zduplikujte (CTRL+D) a umístěte jej na místo další odpovědi a pak ještě jednou. Nyní můžete napsat do scény první otázku a k tlačítkům svoje odpovědi. Do tlačítka se správnou odpovědí vložte (klikněte pravým tlačítkem na objekt a zvolte z nabídky Properties a dále záložku Actions) tuto akci:

Tato akce způsobí přičtení hodnoty 1 do proměnné "odpoved" a zároveň posune animaci a snímek dále. Do dalších dvou tlačítek se "špatnou odpovědí" vložte násleující akci:

Tato akce pouze posune animaci o snímek dále na další otázku.

Nyní vložte do vrstvy "obsah" další čtyři klíčové snímky. V druhém, třetím a čtvrtém snímku pouze změňte otázku a možnosti odpovědí. Zároveň můžete editovat akce na tlačítkách, aby se odpověď nenacházela pořád na stejném místě.

Do posledního snímku vložte větu: "počet správných odpovědí je:" a za ni umístěte textové pole, kterému přiřadíte jméno "odpoved". V tomto poli se bude zobrazovat výsledný počet správných odpovědí. Dále vytvořte Movie Clip (CTRL+F8), pojmenujte jej "odpoved" a vytvořte v něm 6 klíčových snímků. Do druhého snímu vložte větu: "Gratuluji! Velmi dobré znalosti", do třetího: "Docela to ujde, ale je co zlepšovat!", do čvrtého: "FLASH umíš tak zpoloviny.", do pátého: "Znalosti nic moc, chce to učit se!" a do šestého: "Hrůza! Všechny návody si přečti ještě jednou!". První snímek nechte prázdný a pouze do něj vložte akci: "Stop". Nyní se přepněte zpět do hlavní scény a přetáhněte objekt "odpoved" do pátého snímku hlavní scény. klikněte na něj pravým tlačítkem, zvolte Properties a vložte Instace Name: odpoved.

Do posledního snímku animace vložte následující akci (CTRL+F):

Tato akce vyhodnotí počet správných odpovědí a podle se toho přepne na příslušný snímek movie clipu "odpoved".

Tím je znalostní kvíz ve FLASH prakticky hotov a vy máte možnost jako vždy stáhnout si zdrojový soubor pro bližší prozkoumání.