Artikelen

Er wordt mij wel eens gevraagd of ik een HTML pagina in Flash kan zetten en wanneer dit dan klaar kan zijn. Ik zeg dan dat dit een vrij pittige onderneming is. "Flash in HTML kan toch ook", wordt er dan gezegd. Helemaal niet zo’n heel rare gedachte.

Dynamic HTML textfield
Flash ondersteund HTML tags, maar lang niet alle tags. Daar komen we zo op terug. Eerst leg ik uit hoe we een HTML textfield maken. Je kan namelijk een dynamic textfield in Flash zo renderen dat deze HTML tags ondersteund. Dit doe je door de optie "render text as HTML" in de font opties aan te vinken. Daarnaast kun je het ‘character embedden’, wat betekend dat de karakters die je wilt gaan gebruiken in je tekst (bijvoorbeeld cijfers en hoofdletter en leestekens) opslaat in je swf. Dit doe je als je fonts gebruikt die niet standaard op iemands pc staan, zoals Arial of Times New Roman. In dit voorbeeld embedden we het font (Arial) niet, maar als je dit wel doet, moet je in het textfield ook alle styles en weights meegeven in het textfield.



ActionScript
Vervolgens zet je text in het veld door middel van ActionScript. Deze tekst kun je hard in de code zetten, maar ook uit een XML file laten komen. Het volgende script geeft een leeg tekstveld:

bewiredTxt.htmlText = "";

Let op de property ‘htmlText’ in plaats van de regulier ‘text’ property. Hierdoor weet Flash dat het HTML tags moet gaan renderen als deze langs komen. Hieronder staat een voorbeeld van een HTML textrender van het volgende script:

bewiredTxt.htmlText = "Lorem <b>ipsum</b> <br/>dolor <i>sit</i> amet";



HTML tags
Zoals gezegd ondersteund Flash niet alle HTML tags in zijn dynamic textfields. En het gaat ook niet altijd even nauwkeurig. Je moet deze eigenschap dan ook meer zien als een extra toevoeging, dat heel nuttig kan uitpakken. Hieronder staat een voorbeeld van wat mogelijk is:

Hier zie je het script dat voor het bovenstaand voorbeeld is gebruikt:

bewiredTxt.htmlText = '<p><b>Deze tekst is bold</b></p><p><i>Deze tekst is in Italic</i></p>Dit is een <a href="http://www.bewired.nl"><u>link</u></a> naar bewired.<br>Nog wat mooie kleurtjes:<br><li><font color="#FF0000">Rood</font></li><li><font  color="#009900">Groen</font></li><li><font color="#0000FF">Blauw</font></li><br/>En als klap op de vuurpijl een afbeelding:<br/><img src="http://www.bewired.nl/uploads/images/site/bewiredlogo.gif">'

Het textfield heeft als instancenaam ‘bewiredTxt’. Via deze link geeft Adobe een overzicht van de HTML tags die in Flash worden ondersteund. Zoals je ziet kun je vrij ver gaan in de implementatie van HTML tags en het dynamisch inladen van content uit bijvoorbeeld een CMS. Als je de opties in de CMS text editor restrict tot de hoeveelheid ondersteunde tags in Flash kun je, mits gecontrolleerd, eenvoudig dynamische HTMl sites maken in Flash.