DirectAnimation, 4.část: Sprite aneb Image je na nic :-) - Builder.cz - Informacni server o programovani

12. září 2001, 00.00 | Po nějaké době se opět vracíme k našemu seriálu o DirectAnimation. Dnes se podíváme na prvek Sprite, pomocí něhož je možné

ovládat animované obrázky ve formátu GIF.

Po nějaké době se opět vracíme k našemu seriálu o DirectAnimation. Dnes se podíváme na prvek Sprite, pomocí něhož je možné ovládat animované obrázky ve formátu GIF.

Od posledního dílu našeho seriálu o DirectAnimation již přece jen uplynula delší doba, proto zde pro ty z vás, kteří již zapomněli co že ta DirectAnimation vlastně je, přináším odkazy na minulé díly seriálu, aby je nemuseli hledat v archivu Builderu:

DirectAnimation, 1.část: Úvod
DirectAnimation, 2.část: Structured Graphics
DirectAnimation, 3.část: Structured Graphics podruhé

Proč používat prvek Sprite?

Nejpoužívanější formou animace na webu jsou nepochybně animované obrázky ve formátu GIF - ty jsou založeny na tom, že jednotlivé fáze animace jsou uloženy v jednom souboru bezprostředně za sebou. Tyto animace mají jednu velkou výhodu - je jí velikost souboru, která je pro publikování na webu jedním z nejdůležitějších hledisek. Tato výhoda je ale bohužel kompenzována tím, že tyto obrázky není možné ovládat tak, jako např. video záznam - pozastavovat, přetáčet apod. To již ale neplatí o Internet Exploreru, který právě pomocí prvku Sprite tyto obrázky ovládat umožňuje.

Vzhůru do toho

Nebudeme dlouho otálet a hned se podíváme, jak se prvek Sprite na stránku vkládá:

Vidíme tedy, že stejně jako všechny ostatní prvky DirectAnimation se i prvek Sprite na stránku vkládá pomocí tagu OBJECT a identifikátoru prvku CLASSID. Prvek je nutné pojmenovat pomocí parametru ID tagu OBJECT, jinak ho není možné ovládat pomocí skriptů. Prvku přiřazujeme vlastnosti pomocí tagů PARAM, které uvádíme uvnitř tagu OBJECT - nyní si tyto vlastnosti ukážeme:

Všechny tyto vlastnosti je možné číst i nastavovat v JavaScriptu, a to pomocí zápisu název prvku.vlastnost. V JavaScriptu navíc můžeme používat těchto několik vlastností, které jsou pouze ke čtení: Frame (udává číslo aktuálního snímku), NumFramesAcross (udává šířku zdrojového obrázku v počtu snímků), NumFramesDown (udává výšku zdrojového v počtu snímků), PlayState (vrací jeden ze těchto stavů animace: play, paused a stopped) a Time (udává celkový čas přehrávání animace).

Metody prvku Sprite

Kromě výše uvedených vlastností podporuje prvek Sprite i několik JavaScriptových metod. Ty se aplikují pomocí zápisu název prvku.metoda a jsou to FrameSeek(n) (nastaví přehrávání na n-tý snímek animace), Pause() (pozastaví animaci), Play() (spustí přehrávání animace) a Stop() (zastaví přehrávání animace a vrátí ji na začátek). Závěrem bych vás ještě rád seznámil s událostí onMediaLoaded, která se používá u tagu OBJECT a která se volá v momentě, kdy je prvek Sprite kompletně načtený (včetně obrázku).

A to je o prvku Sprite vše. Příště se podíváme na prvek Path a poté se již začneme zabývat využitím prvků DirectAnimation v praxi.