reklama

Umíme ve Flashi - 31. díl - vlastní komponenta

V dnešním díle si vytvoříme jednoduchou komponentu, která bude zobrazovat barvy z barevné paletky.

Komponenty

Panel komponent jistě známe všichni. Časem ale dospějeme do situace, kdy zjistíme, že připravené komponenty nestačí a přitom bychom nějakou další komponentu jistě využili. Pak není nic jednoduššího, než se pustit do tvorby komponenty vlastní. A že to není zas tak složitá práce, to si ukážeme v dnešním díle.

Úkolem bude vytvořit komponentu, která bude umožňovat vybrat barvu ze zobrazené barevné paletky. Prakticky se bude jednat o klasický Movie Clip s tlačítkem, které po kliknutí zobrazí objekt s barevnou paletou, kde budeme pomocí myši vybírat potřebné barvy. To, že z daného MC vytvoříme komponentu, je záležitost několika snadných kroků.

Tvorba komponenty

V novém flashovém dokumentu si připravíme prázdný MC, který pojmenujeme „komponenta“. Abychom měli práci snazší, nebudeme barevnou paletku generovat pomocí AS, ale vložíme jí jako rastrový obrázek. Zkopírujeme si tedy nějakou barevnou paletku, třeba přímo z flashového prostředí, upravíme jí tak, aby nezobrazovala nadbytečné objekty a vložíme ji do vytvořeného MC „komponenta“.

Klepněte pro větší obrázek

Barevnou paletku převedeme na MC a pojmenujeme její instanci jako „barvy“. Vybereme jí a na panelu akcí jí přiřadíme tento skript:

on (release) {
 _visible = false;
}
onClipEvent (load) {
 _visible = false;
}

Dále si vytvoříme dvě dynamická textová pole a pojmenujeme je „hodnota“ a „popis“. U pole „popis“ ještě navíc vyplníme část „Var:“, kde vložíme název proměnné „popiska“. Tyto pole budou sloužit pro zobrazení názvu komponenty a hodnoty zvolené barvy.

Pod textovými poli vytvoříme obdélník, který převedeme na MC a instanci pojmenujeme „pozadi“. Tento MC bude sloužit jako pozadí celé komponenty a my budeme jeho barvu měnit na panelu vlastností u dané komponenty.

Dále si vytvoříme čtvercový MC, který bude sloužit jako tlačítko pro zobrazení barevné paletky a navíc se v něm bude zobrazovat aktuálně zvolená barva. Instanci vytvořeného čtverce pojmenujeme „tlacitko“ a vložíme do něj ještě jeden objekt čtvercový objekt, jehož instanci pojmenujeme „vypln“. Ten budeme dynamicky měnit podle zvolené barvy.

Na takto vytvořený MC „tlacitko“ umístíme skript:

on (release) {
 this._parent.barvy._visible = true;
}

Přesuneme se nyní na první snímek osy v MC „komponenta“ a vložíme do něj příkazy, které budou řídit celý proces výběru barvy a její zobrazení v textových polích a obarvení pozadí tlačítka:

barvaPozadi = "0xFFFFFF";
var poz:Color = new Color(pozadi);
poz.setRGB(barvaPozadi);
popis.textColor = barvaTextu;
hodnota.textColor = barvaTextu;
import flash.display.BitmapData;
var paletkaBMP:BitmapData = BitmapData.loadBitmap("paletka");
this.onMouseMove = function() {
 if (barvy.hitTest(_root._xmouse, _root._ymouse) == true && barvy._visible == true) {
  barva = "0x"+paletkaBMP.getPixel(_xmouse-barvy._x, _ymouse-barvy._y).toString(16);
  var my_color:Color = new Color(tlacitko.vypln);
  my_color.setRGB(barva);
  hodnota.text = barva;
 }
};

Pokud nyní otestujeme animaci, měly by vypadat takto.

Vytvoření komponenty

Teď už nás dělí jen pár kroků od vytvoření vlastní komponenty. Přesuneme se do knihovny symbolů dokumentu a klikneme pravým tlačítkem na MC „komponenta“. Z nabídky zvolíme „Component definition“. Pomocí tlačítka „+“ přidáme dva parametry komponenty, které budou měnit popisek a barvu pozadí této komponenty.

Název parametrů zvolíme libovolný, v části „Variable“ musíme vyplnit přesný název proměnné, kterou chceme měnit (popiska, barvaPozadi) a pak už jen určíme typ proměnných, které do parametrů chceme zadat.

Klepněte pro větší obrázek

Zaškrtneme spodní položku „Display in Components Panel“ a můžeme vyplnit text, který se po najetí na komponentu zobrazí.

Vedle již zmíněných položek můžeme v okně nastavení komponenty vytvořit textový popisek této komponenty (Description), zvolit ikonku, případně určit cestu k vlastnímu grafickému rozhraní pro zadávání parametrů a dále cestu k souboru, který slouží pro zobrazení změn parametrů přímo v editačním režimu.


Pokud máme nastavení komponenty dokončené, podíváme se do knihovny symbolů, kde se komponenty již standardně zobrazuje.

Klepněte pro větší obrázek

Vložení do seznamu komponent

Posledním krokem je umístění komponenty do seznamu nabízených komponent. Tento krok je jako poslední nejjednodušší a spočívá v přesunutí zdrojového FLA souboru naší komponenty do adresáře Program Files\Macromedia\Flash 8\en\Configuration\Components\, to v případě že používáme Flash 8, jinak analogickou cestu můžeme použít i u straších verzí, nebo můžeme zkusit toto umístění: Documents and Settings\Název_uživatele\Data aplikací\Macromedia\Flash MX\Configuration\Components\. Nakonec ukončíme Flash a znovu jej spustíme a komponentu již nalezneme společně s dalšími v seznamu komponent.

Zdrojový soubor dnešní komponenty ve Flash8 formátu si můžete stáhnout zde.

V příštím, závěrečném dílu tohoto seriálu, se podrobněji podíváme na nejčastější problémy při práci s Flashem.

Témata článku: Software, Programování

1 komentář

Nejnovější komentáře

  • gully, gully 15. 5. 2006 9:04:06
    http://diskuse-zaciname-s-flash-mx-2004.wz.cz
reklama
Určitě si přečtěte

Facebook o nás ví vše. Díky dobře skrytému vyhledávači se to dozví i ostatní

Facebook o nás ví vše. Díky dobře skrytému vyhledávači se to dozví i ostatní

** Facebook o nás ví vše, protože mu to sami řekneme ** V jeho nitru se skrývá mocný vyhledávač ** Mohou jej zneužít stalkeři, sociální inženýři a další nezbedníci

16.  2.  2017 | Jakub Čížek | 72

Nevyznáte se ve značení procesorů Intelu? Tady máte tahák

Nevyznáte se ve značení procesorů Intelu? Tady máte tahák

** Z označení procesorů Intelu se toho dá mnoho vyčíst ** Ze čtyř čísel se dozvíte něco o výkonu i grafickém jádru ** Poradíme, jak číst číselné označení i písmena na konci

13.  2.  2017 | Stanislav Janů | 37


Aktuální číslo časopisu Computer

Stavba 3D tiskárny

Výbava domácí elektrodílničky

Budoucnost 5G sítí

Velké testy microSD karet a vodních chladičů

Přehled mobilních tarifů

reklama
reklama