Comunidad de diseño web y desarrollo en internet online

Cómo crear un Visor de Fuentes del sistema en Actionscript 3

Varias veces he tenido problemas al visualizar fuentes, al trabajar en Windows XP el visor de fuentes apestaba, y en las aplicaciones, mostrar la vista previa era lento, aún teniendo pocas fuentes y mucha Ram.

En este Tip les mostraré como crear un Visor de Fuentes en Actionscript 3.

Lo primero que haremos será crear un Documento nuevo y guardarlo.

Posteriormente creamos nuestra interface a la cual añadiremos un Componente List, que se encargará de mostrar los nombres de las fuentes y servirá como Listener para cambiar la fuente de la vista previa, le damos como nombre de instancia fontList.

Despues añadimos un TextField Dinamico y lo nombramos sampleText.

Abrimos el Panel de Acciones y escribimos el siguiente código:

Código :

import fl.data.DataProvider;

La clase DataProvider se encarga de añadir datos a Componentes de tipo lista como un ComboBox, un Datagrid, List, etc.

Código :

var fonts:Array = Font.enumerateFonts(true).sortOn("fontName");

var fontsArray:Array = new Array();

Creamos un Array que enlista los Objetos Fuente y otro que se encargará más adelante de nombrar esos objetos.

Código :

for (var i:int = 0; i < fonts.length; i++)
{
   fontsArray.push(new String(fonts[i].fontName));
}

Este código añade cada Objeto Fuente al Array de uno por uno, colocandole su nombre correspondiente.

Código :

fontList.dataProvider = new DataProvider(fontsArray);

fontList.addEventListener(Event.CHANGE, setFont);

Se le asignan los datos al componente List y se añade un Listener que llamará a la función que actualizará la fuente de la vista previa.

Código :

function setFont(event:Event):void
{
   var format:TextFormat = new TextFormat();
   
   format.font = new String(fontList.selectedItem.data);
   sampleText.setTextFormat(format);
}

Esta es la función que actualizara la vista previa, para eso se crea un Objeto TextFormat y se añade el item seleccionado a la propiedad font.

Con este corto y sencillo código obtenemos algo como esto:



Para apreciar mejor las fuentes puedes ver el SWF en pantalla completa aquí.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate