Flash MX: Krotíme fonty - Grafika.cz - vše o počítačové grafice

Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:



Webdesign

Flash MX: Krotíme fonty

30. srpna 2002, 00.00 | Dochází vám ve Flashi trpělivost s textem, psaným titěrným,vyhlazeným písmem? Vadí vám, že je nutné fonty přibalovat k aplikacím? Rádi byste fonty specifikovali výčtem alternativ, tak jak je to obvyklé v HTML/CSS? Chcete mít jistotu správného zobrazení češtiny? Řešení není úplně snadné,ale existuje.

Zabalit i font? Ne, děkuji.

Ve Flashi máme k dispozici dva způsoby, jak pracovat s fonty. Buď k aplikaci font přibalíme (celý nebo jen vybrané znaky) nebo se budeme odkazovat na systémové fonty, tj. fonty, které má uživatel nainstalované na svém klientském zařízení. Toto rozhodnutí je pevně spojeno s některými dalšími aspekty: Text, psaný přibaleným fontem, bude vždy vyhlazený (s antialiasingem), zatímco text, psaný systémovým fontem, bude vždy nevyhlazený. A dále na text, psaný přibaleným fontem, je možné aplikovat masku, zatímco na text, psaný systémovým fontem, nikoliv.

Dosud bylo přibalování fontů a antialiasing považováno za velkou přednost Flashe. Jenže jak se způsoby využití Flashe posunují od animovaných kreací směrem k aplikacím, v nichž uživatelé dlouhodobě pracují s drobnými texty, vývojáři se začínájí více zajímat o systémové fonty – písmo by mělo být ostré a nemělo by být nutné ho neustále přibalovat k aplikaci (vytváříte-li například reklamní banner s dynamickými texty, přibalení fontu znamená citelné ukrojení omezené kapacity datového objemu). Mělo by to jít zkrátka tak, jak jsou na to zvyklí webdesigneři v HTML.

Pro statický text se vždy používají přibalené fonty (s výjimkou tzv. device fontů – viz dále), pro dynamický text a vstupní pole můžeme použít systémové fonty. To určíme tím, že v dialogovém okně "Character Options" ponecháme výchozí hodnotu "No Characters"):

Začínají problémy s češtinou

Jakmile se rozhodneme pro systémové fonty, nastává problém: Jaké písmo zvolit? Ať už nastavujeme font pomocí panelu "Properties", nebo nově ve Flashi MX skriptem, pomocí vlastnosti font třídy TextFormat, můžeme vždy určit pouze jeden konkrétní font. Pokud uživatel nebude mít na svém zařízení tento font nainstalovaný, bude nahrazen jiným, nepředvídatelným fontem. Ne všechny fonty ovšem znají češtinu. Riziko, že neřízeným nahrazením fontu přijdeme o správné zobrazení českých znaků, je pádným argumentem, abychom od tohoto řešení upustili.

Flash nabízí tři tzv. device fonty, což jsou obecné definice typu písma, bez uvedení konkrétního fontu: _sans (bezpatkové písmo), _serif (patkové písmo) a _typewriter (neproporcionální písmo). Flash Player zvolí vhodný font z dostupných systémových fontů. Zdálo by se tedy, že řešení je na světě.

Bohužel až do verze Flash 5 ani tudy cesta nevedla. Příčinou bylo to, že Flash používal pro kódování textu interní kódování dané platformy. Pokud se tedy lišila platforma vývojáře od platformy uživatele, nastal problém. Vývojář pracující pod Windows, který ladil svou aplikaci také pod Windows, viděl zobrazení českých textů psaných device fonty bez problémů. Jakmile si však aplikaci spustil například uživatel Maca, text byl nečitelný – Flash Player sice mohl vybrat vhodný lokalizovaný font, ovšem nedokázal již převést text z kódování Windows-1250 do interního kódování Maca. Jedinou možností tedy nadále zůstávalo přibalování fontů, což vždy vede k vytvoření jednoznačné vazby mezi textem a vektorovými obrázky jednotlivých znaků; problémy kódování jdou tedy zcela stranou.

Unicode je ten správný lék

Flash MX se konečně stal dospělým i v oblasti kódování textu. Jako interní kódování používá Unicode a jako transportní formát UTF-8 (což je jedna z konkrétních reprezentací Unicodu). Standardně předpokládá, že všechny texty, se kterými pracuje, jsou v tomto kódování.

Je však možné se přepnout do starého režimu pomocí nastavení vlastnosti system.useCodepage na true – Flash pak nadále pracuje s kódováním podle platformy, na které právě běží. Jakmile tuto (původně nezdokumentovanou) vlastnost objevili někteří vývojáři, zmateni z toho, že jim najednou nefunguje čeština v načítaných textech, rychle se jí chopili, aniž tušili, že tím zahodili řešení skutečného problému a na jiných platformách si uživatelé stále moc nepočtou. Skutečným řešením je totiž přechod na UTF-8. Veškeré texty, které načítáte do svých aplikací, by měly používat kódování UTF-8, se správně nastavenou hlavičkou XML dokumentu:

<?xml version="1.0" encoding="utf-8" ?>

Ukládat texty s kódováním UTF-8 lze dnes v každém moderním editoru, včetně např. HomeSite 5 nebo Dreamweaver MX.

Jedině díky Unicodu můžete mít jistotu, že při použití systémových fontů bude text na všech platformách čitelný. Tato ukázka dokazuje, že UTF-8 lze dnes již bez větších problémů nasadit jako jednotné kódování ve všech částech řetězce běžné aplikace (od vstupu přes databázi až po výstup).

Tři fonty je málo

K úplné spokojenosti flashovému vývojáři chyběla ještě jedna věc. Možnost volit ze tří fontů je málo. Proč Flash neumí to, co je běžné v CSS a co kdysi dávno v HTML uměla už značka <font> – možnost specifikace písma výčtem alternativ? Tak, aby se v případě nedostupnosti prvního fontu v seznamu zvolil druhý, případně třetí, atd. I tento problém má své řešení! Nejprve důkaz:

Podobně jako v řadě jiných problémů je nutné si uvědomit, že co nejde "naklikat" přímo ve vývojovém prostředí, mohlo by přece jít skriptem. Klíčem k řešení je metoda getFontList, připojená možná ne zcela šťastně ke třídě TextField. Jedná se o statickou metodu (tzn. volanou přímo na třídě, nikoli na instanci), která vrací pole, obsahující názvy všech fontů, dostupných na klientském zařízení. Nic nám nebrání naprogramovat si algoritmus výběru fontu ze sekvence daných alternativ, přesně tak, jako to dělá CSS. Následující ukázka jej realizuje jako rozšíření třídy TextFormat o novou metodu nastavFont:

TextFormat.prototype.nastavFont = function (alternativy) {
 var dostupneFonty = TextField.getFontList();
 dostupneFonty.push("_sans", "_serif", "_typewriter");
 var nalezen = null;
 for (var i=0; nalezen==null && 
 i<alternativy.length; i++)
  for (var j=0; nalezen==null && 
  j<dostupneFonty.length; j++)
   if (dostupneFonty[j].toLowerCase()
   ==alternativy[i].toLowerCase()) 
    nalezen=dostupneFonty[j];
 if (nalezen!=null) this.font = nalezen;
 return nalezen;
}

Parametrem metody je pole, obsahující názvy alternativních fontů, v pořadí od nejpreferovanějšího písma po nejméně preferovaného (tj. nejobecnějšího). Výčet by měl podobně jako v CSS vždy uzavírat některý z obecných fontů, ve Flashi tedy jeden z jeho tří device fontů. Metoda se snaží najít nejvhodnější font. Pokud jej najde, nastaví vlastnost font příslušné instance třídy TextFormat a vrátí jméno tohoto fontu jako výsledek metody. Pokud jej nenajde, ponechá vlastnost font beze změny a vrátí null.

Jak metoda pracuje? Nejprve je pole dostupneFonty naplněno seznamem všech dostupných písem a rozšířeno o tři device fonty, protože ty nejsou metodou getFontList zařazeny do výstupu. Nyní můžeme přistoupit k porovnání polí alternativy a dostupneFonty: Procházíme od začátku pole alternativ a pro každou položku zjišťujeme (cyklem přes pole dostupných fontů), zda najdeme shodnou položku. Pokud ano, dosadíme ji do proměnné nalezen. Nakonec zjistíme, zda tato proměnná obsahuje nějakou hodnotu, tzn. zda byl font nalezen. Pokud ano, přiřadíme jméno fontu vlastnosti this.font. Hodnotu proměnné nalezen také vrátíme jako výsledek metody.

Zařadíte-li výše uvedený kód na začátek vaší aplikace (ať už přímým zkopírováním, nebo pomocí načtení nějaké větší knihovny příkazem #include, nebo formou komponenty – záleží na vašem stylu budování aplikací), můžete pak metodu nastavFont volat na libovolné instanci třídy TextFormat. Sekvenci fontů z výše uvedené ukázky by odpovídalo volání:

mujTextFormat.nastavFont(["Geneva CE", "Verdana", "Helvetica CE", "Arial CE", "Helvetica", "Arial", "_sans"]);

Naše ukázka je vytvořena tak, aby definice fontů vypadala stejně jako v CSS (jedinou výjimkou je jiné označení obecných fontů, např. _serif místo sans-serif) – kód tedy navíc obsahuje převod zadaného řetězce na pole názvů fontů. Zdrojový soubor je k dispozici zde.

Při navrhování sekvencí alternativních fontů je třeba dobře znát tuto specificky českou problematiku. Například pouhou změnou pořadí fontů můžete způsobit nečitelnost vašich textů na některých platformách. Výklad těchto zásad by byl nad rámec článku, nezbývá proto, než odkázat na jiné zdroje, které se tímto zabývají, dosud pochopitelně pouze v souvislosti s HTML/CSS.

Je to hranaté a není to systémový font – co je to?

Mluvit o "úplné spokojenosti flashového vývojáře" je přece jen ošidné. Jeden malý problém stále zůstává nevyřešen: Texty psané systémovým fontem nelze maskovat. Potřebujeme-li aplikovat masku, pak jediným způsobem, jak dosáhnout krásně ostrého písma malých rozměrů, jsou tzv. pixelové fonty.

Jedná se o písma speciálně navržená tak, aby při jejich použití v základní velikosti (nebo jejích násobcích) nedocházelo k antialiasingu. Je pochopitelně nutné je k aplikaci přibalovat. Tyto fonty jsou v poslední době velmi oblíbené – lze je získat např. zde, zde nebo zde. Není mi však známo, že by již existovala i nabídka českých verzí takových fontů – je-li někdo ze čtenářů informovanější, diskuse pod článkem už netrpělivě čeká.

Na závěr si neodpustím poznámku, že tyto nové možnosti práce s textem by vás neměly nalákat k tomu, abyste Flashem realizovali to, co se pro Flash vůbec nehodí. Flash nadále (a čím dál víc) bude vhodný pro projekty, které mají charakter aplikací, nikoliv dokumentů. Nezapomínejte také, že vaše aplikace by kromě skvělého rozhraní pro lidské uživatele měla poskytovat i rozhraní pro stroje – je třeba vhodně oddělovat tato dvě rozhraní od vlastního obsahu.

Tématické zařazení:

 » Rubriky  » Go verze  

 » Rubriky  » Webdesign  

 

 

 

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: