Documentación de Flash CS3

Aprendizaje de ActionScript 2.0 en Adobe Flash > Utilización de texto y cadenas > Aplicación de formato al texto con hojas de estilos en cascada > Ejemplo de utilización de estilos con XML

Ejemplo de utilización de estilos con XML

En esta sección, creará un archivo FLA que incluye texto con formato XML. Creará una hoja de estilos empleando ActionScript en lugar de importar estilos de un archivo CSS, como se muestra en Ejemplo de utilización de estilos con HTML

Para aplicar formato a XML con una hoja de estilos:

1. En Flash, cree un archivo FLA.
2. Con la herramienta Texto, cree un campo de texto de unos 400 píxeles de anchura y 300 píxeles de altura.
3. Abra el inspector de propiedades (Ventana > Propiedades > Propiedades) y seleccione el campo de texto.
4. En el inspector de propiedades, seleccione Texto dinámico en el menú Tipo de texto, seleccione Multilínea en el menú Tipo de línea y elija la opción Generar texto como HTML; a continuación, escriba news_txt en el cuadro de texto Nombre de instancia.
5. En la Capa 1 de la línea de tiempo (Ventana > Línea de tiempo), seleccione el primer fotograma.
6. Para crear el objeto de hoja de estilos, abra el panel Acciones (Ventana > Acciones) y añada el siguiente código al mismo:

   var styles:TextField.StyleSheet = new TextField.StyleSheet();
   styles.setStyle("mainBody", {
       color:'#000000', 
       fontFamily:'Arial,Helvetica,sans-serif', 
       fontSize:'12', 
       display:'block'
   });
   styles.setStyle("title", {
       color:'#000000', 
       fontFamily:'Arial,Helvetica,sans-serif', 
       fontSize:'18', 
       display:'block', 
       fontWeight:'bold'
   });
   styles.setStyle("byline", {
       color:'#666600', 
       fontWeight:'bold', 
       fontStyle:'italic', 
       display:'inline'
   });
   styles.setStyle("a:link", {
       color:'#FF0000'
   });
   styles.setStyle("a:hover", {
       textDecoration:'underline'
   });
   

   Este código crea un nuevo objeto de hoja de estilos denominado styles que define estilos mediante el método setStyle(). Los estilos son los mismos que los creados en un archivo CSS externo anteriormente en este capítulo.

7. Para crear el texto XML que se debe asignar al campo de texto, abra un editor de texto e introduzca el siguiente texto en un documento nuevo:

   <story><title>Flash now has advanced anti-aliasing</title><mainBody><byline>San Francisco, CA</byline>--Adobe Inc. announced today a new version of Flash that features the new advanced anti-aliasing rendering technology. For more information, visit the <a href="http://www.adobe.com">Adobe Flash website</a></mainBody></story>
   

   NOTA

   Si copia y pega esta cadena de texto, asegúrese de que quita los saltos de línea que puedan haberse añadido a la cadena de texto. Seleccione Caracteres ocultos en el menú emergente del panel Acciones para ver y eliminar cualquier salto de línea adicional.

8. Guarde el archivo de texto como story.xml.
9. En Flash, añada el siguiente código en el panel Acciones tras el código del paso 6.

   Este código carga el documento story.xml, asigna el objeto de hoja de estilos a la propiedad styleSheet del campo de texto y asigna el texto XML al campo de texto:

   var my_xml:XML = new XML();
   my_xml.ignoreWhite = true;
   my_xml.onLoad = function(success:Boolean):Void {
       if (success) {
           news_txt.styleSheet = styles;
           news_txt.text = my_xml;
       } else {
           trace("Error loading XML.");
       }
   };
   

   my_xml.load("story.xml");

   
   

   NOTA

   En este código ActionScript se cargan datos XML de un archivo externo. Para más información sobre cómo cargar datos externos, consulte Utilización de imágenes, sonido y vídeo.

10. Guarde el archivo como news_xml.fla en la misma carpeta que story.xml.
11. Ejecute el archivo SWF (Control > Probar película) para ver los estilos aplicados automáticamente al texto del campo de texto.

Flash CS3

Enviarme un mensaje de correo electrónico cuando se añadan comentarios a esta página | Informe de comentarios

Página actual: http://livedocs.adobe.com/flash/9.0_es/main/00000919.html

Añadir comentario