FLASH rychle a snadno 12.

Na co se dají použít formuláře?

Tentokrát začneme dnešní flashovou lekci povídáním o formulářích. Obecně použijeme v běžném formulář při sběru dat. Třeba při vyplnění přihlášky do nějakého klubu je nám předložen formulář, do kterého zadáme osobní data, zaškrtneme si co bychom chtěli dělat, vybereme náš věk a úroveň v daném oboru. Při internetových aktivitách samozřejmě můžeme data získat úplně stejně, dokonce čas jejich zpracování může být několikrát menší. Jak to v tomto případě vypadá s Flashem?

Flash a formuláře

Formulář v pravém slova smyslu ve Flashi nenajdeme. Nemůžeme kliknout na knihovnu a vytvořit formulář formou příkazů či voleb. Do jisté míry se vše odvíjí od definice formuláře, pokud bereme v potaz například normy HTML (HyperText Markup Language – standard pro tvorbu na webu), je formulář nutně použit při jednom z jeho prvků (zaškrtávací políčko, textové pole …). Tomuto Flash nemůže vyhovět – veškeré pomyslné prvky formuláře jsou totiž v podstatě pouhými tlačítky (kromě textového pole).

U HTML se veškerá data z formuláře odesílají dále, existují zde pak neviditelná tlačítka pro přenášení některých dat z již stanovených proměnných, ani toto není u Flashe třeba. Ten pochopitelně uchovává všechny proměnné pořád a nepotřebuje odesílat žádné data, pokud je nemá zpracovat externí aplikace.

Pokud by tedy byl Flashový formulář tehdy, kdy data po kliknutí na tlačítko zpracuje externí aplikace, není o stále úplné. Flash totiž může data zpracovat i sám. Představme si třeba model aktuálního programu pro generování vašeho nového telefonního čísla po přečíslování. Toto by přece zvládl Flash sám o sobě díky výpočetní funkci … Dalším příkladem mimo standardní rámec zadávání informací ve formuláři je kalkulačka, i tu můžeme jednoduše Flashem řešit. Definujme si tedy formulář ve Flash jako seskupení na scéně, jenž obsahuje svým uživatelem definovatelné proměnné, se kterými se pak dále pracuje.

Základní formulářové prvky

Jak jsem již předeslal, formulářové prvky ve Flash jsou vlastně tlačítky, proto je můžete vyvolat pomocí zvolení Help->Samples->Advanced Buttons - rozšířené tlačítka. Nejjednodušším prvkem samozřejmě jsou textová pole, která nejsou ničím jiným než textovým polem Input. Dále se hojně používají výběrová tlačítka, pokud volíme právě jednu možnost z více oddělených, jedná se o tzv. Radio, když máme jedno výběrové pole s více možnostmi mluvíme o Selectu a zaškrtáváme–li pouze oddělené možnosti, je to Check box. Mezi rozšířená tlačítka Flash patří i posuvník, ale o tom až někdy příště. Nyní si sestrojíme jednotlivá jmenovaná tlačítka.

Radio

Toto tlačítko použijeme, má-li uživatel vidět rovnou všechny svoje volby a zvolit pouze jednu z nich. Na začátek si vytvoříme si movie clip. Do prvního snímku vložíme jednotlivé volitelné položky a jednu z nich necháme zatrhnutou. Dle počtu položek vytvoříme tolik dalších snímků, aby v každém z nich byla vždy jedna položka zatrhnutá. Nakonec přidáme nad každou položku neviditelné tlačítko, na které když se klikne, přeneseme se na snímek se zaškrtnutou položkou a aktuální proměnnou našeho Radio se stane její hodnota. Celé je to velmi jednoduché, v praxi se použije pouze tento jednoduchý kód:

Select

Důvod použití tohoto tlačítka je totožný s Radio, ovšem prvek je úspornější na místo úvodního zobrazení. Tvorba je zde opět lehká, na začátku je opět movie clip. Úvodní snímek tvoří srolované tlačítko, dále máme již snímky se všemi rozrolovanými možnostmi, vždy s jednou zvýrazněnou. Potom už stačí přiložit na každou možnost neviditelné tlačítko, na které pokud se najede myší, přesune se film na daný snímek, a pokud se myší klikne, zvolí se jistá možnost a Select se zaroluje.

Check box

Další možností tlačítka je zaškrtávací, to se tedy umisťuje na scénu jednotlivě a nabývá hodnot true/false, on/off, 0/1, na tom nezáleží, prostě je to typ boolean. Vytvoří se jednoduše opět přes movie clip, na prvním snímku nezatrhlé a na druhém zatrhlé tlačítko.

Pokud naše tlačítka chceme více zdynamizovat, můžeme jejich jednotlivé fáze zanimovat, stačí odkázat funkcí gotoAndPlay na snímek, na němž animace začíná, a zastavit ji kdy je potřeba a zaktivovat zase všechny funkce. Příklad toho můžete vidět u jedné z variant check boxu výše, zdrojový kód celé zmíněné scény je pak TADY.

Náš vlastní formulář

Při tvorbě formuláře do naší hry budeme tvořit nejprve jeho kusou podobu. Ujasníme si, které prvky bude hráč po dohrání vyplňovat a které budou automaticky přiřazeny. Protože se jedná o odeslání herního výsledku, řekněme že postačí samotné skóre hry, které budeme mít uložené v proměnné skore, dále hráč doplní svoje jméno, příjmení, přezdívku, email, zvolí si pohlaví a zaškrtne si, zda mu má na email přijít info o výsledku hry.

Celý formulář bude tvořen dvěma snímky, na první umístíme k vyplnění formulář a na ten druhý zase vložíme akce, které odešlou data (vše by mělo běžet v prohlížeči, aby data mohl zpracovat skript, proto nahradíme okno flashe pomocí metody getURL přímo výsledkem skriptu). Úvodní snímek vytvoříme dle následující šablony:

Do každého volitelného tlačítka pak vložíme změnu proměnných v jeho fázích přímo v _root.-u, abychom se poté k proměnným snadno dostali, taktéž pohyb z tlačítka na odeslání pokud je z více částí budeme definovat pro root. Na druhém snímku tedy odešleme data dle osvědčeného postupu:

Zapis.php

<?
/*zápis dat do tabulky mysql*/
?>
<table width=400 align=center>
<tr><td colspan=2 align=center><h2>Tyto data jste odeslal na náš server:</h2></td></tr>
<tr><td align=left><b>Jméno a příjmení:<td align=left><?echo $jmeno;?></td></tr>
<tr><td align=left><b>Přezdívka:<td align=left><?echo $nick;?></td></tr>
<tr><td align=left><b>Pohlaví:<td align=left>
<?
if($pohlavi==0):
echo "muž";
else:
echo "žena";
endif;
?></td></tr>
<tr><td align=left><b>Info o hře na email:<td align=left>
<?
if($info==0):
echo "ne";
else:
echo "ano";
endif;
?></td></tr>
<tr><td align=left><b>Email:<td align=left><?echo $email;?></td></tr>
<tr><td align=left><b>Skóre:<td align=left><?echo $skore;?></td></tr>

Zpracující skript

Zpracující skript je vcelku jednoduchý, je jedno jaký použijeme jazyk, ale poté můžeme třeba takto reprezentovat přijatá data, ujistit uživatele o výsledku operace apod.:

ZDE si opět můžete stáhnout zdrojový kód našeho formuláře a prostudovat si ho.

Debugger

Dnešní lekci zakončíme povídání o Debuggeru. Název nepochází z češtiny a může být poněkud matoucí, nejedná se totiž o žádný inovovaný model rýpacího stroje, ale o možnost kontroly chodu našeho filmu pomocí monitoringu jeho proměnných, vlastností, hodnot instancí a mnoho jiného. Spolu s debuggerem můžeme použít pro sledování proměnných i okno Output, na které se ovšem spolu s rozšířením dnešního povídání o debuggeru podíváme až příště. Prozatím si pouze popíšeme základní specifika debuggeru.

Kdy tedy máme debugger použít? Třeba chceme-li ověřit zacházení Flashe s informacemi v proměnných, nebo když testujeme vliv podmínek či proměnných. Klasickým příkladem je sledování rychlosti, která závisí na nějaké proměnné. Můžeme ji lehce zvyšovat dokud nejsme spokojeni s její hodnotou a dopadem na animaci.

Panel debuggeru se otevírá jako speciální aplikace Flash Playeru v rámci autorského programu Flash. Zobrazuje informace ve dvou částech, v okně zobrazení nahoře a dole v seznamu vlastností, proměnných a sledováních. V okně zobrazení je vidět kořenová časová osa a hierarchie movie clipů na ní. Při výběru kořenové osy nebo konkrétního movie clipu vidíme pak příslušné vlastnosti.

A co příště?

V následujícím díle dokončíme povídání o Debuggeru a podívám se na řadu užitečných tipů, mimo jiné i na slíbené používání okna Output.