Umíme ve Flashi – 7. díl – krotíme komponenty 1. část

Základní flashové komponenty výrazně usnadňují naši práci. Jejich užívání však často brání obavy z jejich složitosti, nebo neznalosti možností, jak je přizpůsobit svým potřebám. V dnešním díle se podíváme na některé nejpoužívanější zástupce.
Umíme ve Flashi – 7. díl – krotíme komponenty 1. část

Windows – Development Panels – Components

Tato volba nás dovede k seznamu nabízených komponent. Určitě zde nalezneme připravené komponenty, kterými je button, checkbox, list, radio buton, combo box a další. Verze „Professional“ navíc obsahuje komponenty pro zobrazování videa, práci s XML daty, zobrazení kalendáře nebo komponentu pro vytvoření stromové struktury dat.

Výhoda komponent je nesporná. Nemusíme se pracně dělat s objekty, které zde již máme připravené k okamžitému použití. Náročná tvorba automatických textových polí, u kterých se po stranách zobrazují posuvníky, rozbalovací nabídky, nic z toho nemusíme připravovat. Stačí vybranou komponentu přetáhnout na scénu a můžeme jí používat.

Asi největší neznámou, je v případě komponent možnost úpravy jejich vzhledu. Pokud přetáhneme jakoukoliv komponentu na scénu a vyzkoušíme si export swf souboru, zjistíme, že i zdánlivě nejmenší a nejjednodušší komponenta „Button“ zvětší výsledný swf soubor o nějakých 26kB. Velkou „vinu“ na tom má přibalený balík skriptů a tříd, které umožňují jak správnou funkčnost tak i určitou variabilitu a možnost nastavení jiného vzhledu.

TextArea

Komponenta, kterou využijeme pro zobrazení textu. Tato komponenta automaticky vytváří posuvníky po stranách textové oblasti, takže se nemusíme starat o situace, kdy je text příliš dlouhý a nevejde se nám do objektu. Zobrazení HTML textu je zde samozřejmostí. Jak ale změníme vzhled komponenty?

Metoda, pomocí které měníme vzhled většiny komponent má následující zápis:

nazev_komponenty.setStyle(vlastnost, hodnota);

Co se týče prvního parametru, nejčastěji využijeme vlastnosti pro změnu barvy textu – „color“, barvy pozadí – „backgroundColor“, velikosti textu – „fontSize“.

Embed Fonts

Pokud chceme v komponentě TextArea zobrazovat font, který jsme přibalili do swf souboru, poslouží nám vlastnost „embedFonts“, která nabývá logických hodnot true/false. Pokud ji dáme jako „true“, další vlastností „fontFamily“ musíme určit, o který font se jedná. Ale pozor, nestačí jen tyto dva řádky. Abychom měli v komponentě vložený požadovaný font, je nutné jej exportovat společně se swf souborem.

Pro export fontu společně se swf souborem klikneme v pravé horní části knihovny symbolů a z menu zvolíme „New Font“. V otevřeném okně zvolíme požadovaný font a potvrdíme tlačítkem „OK“. Font se objeví společně s dalšími symboly v knihovně. Nyní už jen klikneme pravým tlačítkem na vložený font v knihovně a z menu zvolíme položku „Linkage“. Zaškrtneme „Export for ActionScript“ a do pole „Identifier“ napíšeme název fontu, který pak uvedeme u vlastnosti „fontFamily“.

Ohraničení komponenty

Co se týče dalších barev, můžeme měnit například i ohraničení celé komponenty. Nejdříve je ale dobré nastavit styl okraje. Pro jednoduchost můžeme psát:

nazev_komponenty.setStyle(„borderStyle“, „solid“);

Hodnota „solid“ zaručí jednoduchý okraj kolem textového pole. Existují i další, prostorové varianty, ale zde je následná změna barvy složitější. Pokud určíme jednoduchý okraj, stačí jen zvolit barvu pomocí:

nazev_komponenty.setStyle(„borderColor“, „0xFF0000“);

Uvedený výraz nastaví červený okraj komponenty. Sladit barvu okraje a pozadí s prostředím aplikace je tak snadné.

Globální změna vzhledu

Pokud požíváme více komponent a vyžadujeme u nich stejný vzhled, nemusíme jej pro každou zvlášť nastavovat. Vše lze provést z jednoho místa změnou globálního stylu a ovlivnit tak všechny komponenty.

_global.styles.TextArea.setStyle(vlastnost, hodnota);

Uvedeným výrazem změníme vlastnosti všech „TextArea“ komponent v dokumentu. Pokud bychom zjednodušili výraz na:

_global.styles.setStyle(vlastnost, hodnota);

Změníme styl kompletně všech použitých komponent dokumentu. Co se týče „TextArea“, můžeme se někdy setkat s požadavkem průhledného pozadí. Tato vlastnost není oficiálně zdokumentovaná, ale pokud vyzkoušíme napsat:

_global.styles.TextArea.backgroundColor = undefined;

zjistíme, že se nám povedlo pozadí zprůhlednit. Bohužel tento výraz nefunguje u všech komponent, i když bychom očekávali (a komponenty jsou tak prezentovány), že příkazy pro podobné vlastnosti budou u rozdílných komponent stejné.

Barevná schémata

Po vložení komponenty na scénu a následném exportu se defaultně zobrazují veškeré události a akce v zelených odstínech. Jedná se o barevné schéma, pojmenované „haloGreen“. Existují ještě dvě další barevná schémata: „haloBlue“ a „haloOrange“. Jak vypadá například oranžová verze vyzkoušíme, pokud napíšeme:

nazev_komponenty.setStyle("themeColor", "haloOrange");

Změna tlačítek a dalších objektů komponenty

I zde máme šanci na změnu. Nemusíme totiž používat stejná tlačítka, posuvníky a další objekty, které se normálně v komponentě zobrazují. Můžeme je nahradit svými vlastními objekty. Jedná se sice o náročnější proceduru, ale o to lepší může být výsledek.

Všechny komponenty mají své zdrojové soubory, stejně jako naše dokumenty. Zdrojové soubory najdeme nejčastěji adresáři:

c:\Program Files\Macromedia\Flash MX 2004\en\Configuration\ComponentFLA\

kde si otevřeme soubor „StandardComponents.fla“ Po otevření si zobrazíme knihovnu symbolů, kde najdeme všechny komponenty i s jejich objekty, které je tvoří.

Pokud chceme změnit vzhled zvolené komponenty, nejlépe uděláme, když otevřeme další nový dokument, do kterého přetáhneme zvolenou komponentu z knihovny symbolů souboru „StandardComponents.fla“. Komponenty jsou v knihovně uvedené pod složkou „Flash UI Components 2“.

Po přetažení komponenty zavřeme zdrojový soubor komponent a podíváme se do knihovny symbolů pomocného dokumentu. Zde najdeme veškeré objekty, které komponenta využívá.

Na první pohled velký zmatek, na druhý pohled možná ještě větší. Ale nesmíme se hned vzdávat. V knihovně najdeme složky “Themes/ MMDefault“ kde jsou potřebné objekty pro úpravu vzhledu komponenty. Úprava objektů se projeví na komponentě, kterou budeme vkládat z tohoto dokumentu, ale už se neprojeví v komponentách, které jsou ve standartní nabídce okna „Components“.

Pokud ovšem upravenou komponentu vložíme na scénu, chová se jako plnohodnotná komponenta stejného druhu, pokud jsme ovšem zásadním způsobem nezměnili strukturu objektů, na což bychom si měli dávat pozor.

V příštím díle se seznámíme s dalšími komponentami a ukážeme si na praktické ukázce jejich využití.

Témata článku: Software, Programování, Export, Stejný soubor, Fonts

1 komentář

Nejnovější komentáře

  • gully, gully 21. 11. 2005 9:31:47
Určitě si přečtěte

Jak vybrat monitor k počítači: nenechte se zlákat nepodstatnými parametry

Jak vybrat monitor k počítači: nenechte se zlákat nepodstatnými parametry

** Na jaké parametry se zaměřit a kde vás výrobci chtějí nachytat ** Monitory se stále více specifikují pro konkrétní určení ** Náročný hráč nebo profesionální grafik mají různé požadavky

20.  6.  2017 | Tomáš Holčík | 31

Dlouhodobý test HTC Vive: co vám recenze o virtuální realitě neřeknou

Dlouhodobý test HTC Vive: co vám recenze o virtuální realitě neřeknou

** Ani hry se sebelepší grafikou vás nevtáhnou tolik, jako ve virtuální realitě ** Pro sledování filmů není VR ani zdaleka ideální ** I první generace je skvělá, stále však působí jako prototyp

20.  6.  2017 | Stanislav Janů | 22

Pojďme programovat elektroniku: Postavíme si titěrnou Wi-Fi meteostanici s lepším teploměrem než Netatmo

Pojďme programovat elektroniku: Postavíme si titěrnou Wi-Fi meteostanici s lepším teploměrem než Netatmo

** Dnes se podíváme na maličkou Wi-Fi destičku Wemos D1 mini ** A připojíme k ní barometrický a teplotní shield ** Poběží na ní web a nabídne i JSON API

18.  6.  2017 | Jakub Čížek | 28

Jak unikají informace o nových iPhonech? Třeba podprsenkami čínských pracovnic

Jak unikají informace o nových iPhonech? Třeba podprsenkami čínských pracovnic

** Na černém trhu mohou zaměstnanci továren za kradené součástky inkasovat částku ve výši ročního platu ** Velké množství informací je vyneseno i z centrály Applu ** Díly jsou pašovány v botách, podprsenkách i odpadem

21.  6.  2017 | Stanislav Janů | 24


Aktuální číslo časopisu Computer

Bojujeme proti Fake News

Dva velké testy: fotoaparáty a NASy

Co musíte vědět o změně evropského roamingu

Radíme s výběrem základní desky