Uso del componente Label

El componente Label muestra una sola línea de texto, normalmente para identificar otros elementos o actividades en una página web. Se puede especificar que Label tenga formato HTML para sacar partido de sus etiquetas de formato de texto. También se puede controlar la alineación y el tamaño de una etiqueta. Los componentes Label no tienen bordes, no se pueden seleccionar y no difunden eventos.

La previsualización dinámica de cada instancia de Label refleja los cambios de parámetros realizados durante la edición en el inspector de propiedades o el inspector de componentes. La etiqueta no tiene bordes, por lo que el único modo de obtener una previsualización dinámica es definir su parámetro text.

Interacción del usuario con el componente Label

Se utiliza un componente Label para crear una etiqueta de texto para otro componente en un formularios, como la etiqueta “Nombre:” a la izquierda de un campo TextInput que acepta el nombre de un usuario. Resulta conveniente utilizar un componente Label en lugar de un campo de texto normal, ya que así podrá utilizar estilos para lograr una apariencia uniforme.

Para girar un componente Label, hay que incorporar las fuentes; de lo contrario, no se mostrarán al probar la película.

Parámetros del componente Label

A continuación se indican los parámetros de edición que se pueden definir para cada instancia del componente Label en el inspector de propiedades o en el inspector de componentes: autoSize , condenseWhite , selectable , text y wordWrap . Cada uno de estos parámetros tiene una propiedad de ActionScript del mismo nombre. Para obtener información sobre los valores posibles de estos parámetros, consulte la clase Label en la Referencia de ActionScript 3.0 para Flash Professional .

Creación de una aplicación con el componente Label

El siguiente procedimiento explica cómo añadir un componente Label a una aplicación durante la edición. En este ejemplo, la etiqueta sólo muestra el texto "Fecha de caducidad".

  1. Cree un nuevo documento de Flash (ActionScript 3.0).

  2. Arrastre un componente Label del panel Componentes al escenario y asígnele los valores siguientes en el inspector de propiedades:

    • Introduzca aLabel como nombre de instancia.

    • Introduzca 80 en el valor de anchura.

    • Introduzca 100 en el valor X.

    • Introduzca 100 en el valor Y.

    • Introduzca Fecha de caducidad en el parámetro text .

  3. Arrastre un componente TextArea al escenario y asígnele los valores siguientes en el inspector de propiedades:

    • Introduzca aTa como nombre de instancia.

    • Introduzca 22 en el valor de altura.

    • Introduzca 200 en el valor X.

    • Introduzca 100 en el valor Y.

  4. Abra el panel Acciones, seleccione el fotograma 1 en la línea de tiempo principal e introduzca el código ActionScript siguiente:

    var today:Date = new Date(); 
    var expDate:Date = addDays(today, 14); 
    aTa.text = expDate.toDateString(); 
     
    function addDays(date:Date, days:Number):Date { 
    return addHours(date, days*24); 
    } 
     
    function addHours(date:Date, hrs:Number):Date { 
    return addMinutes(date, hrs*60); 
    } 
     
    function addMinutes(date:Date, mins:Number):Date { 
    return addSeconds(date, mins*60); 
    } 
     
    function addSeconds(date:Date, secs:Number):Date { 
    var mSecs:Number = secs * 1000; 
    var sum:Number = mSecs + date.getTime(); 
    return new Date(sum); 
    }
  5. Seleccione Control > Probar película.

Creación de una instancia del componente Label mediante código ActionScript

En el ejemplo siguiente se crea un parámetro Label con ActionScript. Se utiliza un componente Label para identificar la función de un componente ColorPicker y se utiliza la propiedad htmlText para aplicar el formato al texto de Label.

  1. Cree un nuevo documento de Flash (ActionScript 3.0).

  2. Arrastre el componente Label del panel Componentes al panel Biblioteca del documento actual.

  3. Arrastre el componente ColorPicker del panel Componentes al panel Biblioteca del documento actual.

  4. Abra el panel Acciones, seleccione el fotograma 1 en la línea de tiempo principal e introduzca el código ActionScript siguiente:

    import fl.controls.Label; 
    import fl.controls.ColorPicker; 
     
    var aLabel:Label = new Label(); 
    var aCp:ColorPicker = new ColorPicker(); 
     
    addChild(aLabel); 
    addChild(aCp); 
     
    aLabel.htmlText = '<font face="Arial" color="#FF0000" size="14">Fill:</font>'; 
    aLabel.x = 200; 
    aLabel.y = 150; 
    aLabel.width = 25; 
    aLabel.height = 22; 
     
    aCp.x = 230; 
    aCp.y = 150;
  5. Seleccione Control > Probar película.