Página inicial  

trans_770 trans_160

Unidad 20. ActionScript - Formularios (I).


Los Elementos de Formulario

En el uso de formularios podremos utilizar muchos elementos. Pero los principales serán siempre los mismos: cajas de texto y botones.

De vez en cuando utilizaremos otros elementos como los radioButtons, checkBoxes, comboBoxes o listBoxes. Veremos cómo utilizarlos y sacarles el mayor partido.

Flash ofrece estos objetos como componentes. Para acceder a ellos sólo tendrás que abrir el Panel Componentes desde VentanaComponentes.

Una vez abierto el panel haz clic en User Interface para desplegar sus elementos y verás todos los componentes que podrás utilizar.

 

Incluso para la introducción de texto en formularios es aconsejable el uso de componentes, pues veremos que poseen propiedades que las simples cajas de texto no tienen.

Para utilizar alguno de estos componentes basta con arrastrarlo del panel al escenario, o puedes arrastrarlo a la biblioteca para utilizarlo más tarde.

En cualquier caso, cuando hayas añadido el componente a tu película deberás darle un nombre de instancia para poder acceder a él en el código y configurar sus opciones en el Panel Parámetros:

Panel Parámetros
Panel Componentes

Veamos cuales son las opciones para los diferentes componentes:

TextInput (Introducción de texto):

  • editable: true o false. Permite que el texto se pueda editar o no.


  • password: true o false. Oculta el contenido del texto mostrándose un asterisco por carácter.


  • text: Indica el texto inicial de la caja.

TextArea (Área de texto):

  • editable: true o false. Permite que el texto se pueda editar o no.


  • html: true o false. Permite que se acepte contenido HTML dentro de la caja de texto. Propiedad muy útil para incluir enlaces en el texto.


  • text: Idica el texto inicial de la caja.


  • wordWrap: true o false. Permite que se pueda realizar un desplazamiento del texto de arriba abajo. En caso de que no se permita (false) cuando el texto sobre pase el área del componente aparecerá una barra de desplazamiento que permitirá mover el texto de izquierda a derecha.

Button (Botón):

  • icon: Añade un icono al botón. Para insertar un icono deberás crear un gráfico o clip de película y guardarlo en la Biblioteca. Una vez allí selecciónalo y haz clic derecho sobre él y selecciona Vinculación. Marca la casilla Exportar para ActionScript en el cuadro de diálogo que aparecerá y dale un nombre en Identificador. Este nombre es el que deberás escribir en el campo icon del componente botón. Ni el botón ni el símbolo se ajustará al tamaño del otro, así que deberás modificar sus tamaños para que el icono no sobresalga del botón.


  • label: Texto que se leerá en el botón.


  • labelPlacement: left, right, top o bottom. Indica la posición de la etiqueta de texto en caso de que se utilice junto a un icono. Respectivamente, izquierda, derecha, arriba y abajo.


  • selected: true o false. Indica si el botón se encuentra seleccionado.


  • toggle: true o false. Cuando se encuentra a true hace que el botón pueda tomar dos posiciones, presionado y no presionado.

RadioButton (Botón de opción):

  • data: Especifica los datos que se asociarán al RadioButton. La propiedad data puede ser cualquier tipo de datos. Puedes acceder a esta propiedad a través de código para ver que contiene.


  • groupName: Nombre del grupo. En un grupo de botones de opción sólo uno de ello puede estar seleccionado. Definiremos este grupo mediante esta propiedad. Todos los botones que tengan el mismo nombre en groupName pertenecerán al mismo grupo.


  • label: Texto que se leerá al lado del botón.


  • labelPlacement: left, right, top o bottom. Indica la posición de la etiqueta de texto respecto al botón. Respectivamente, izquierda, derecha, arriba y abajo.


  • selected: true o false. Indica si el botón se haya seleccionado o no. De nuevo, en un mismo grupo sólo un botón de opción puede estar seleccionado.

CheckBox (Casilla de verificación):

  • label: Texto que se leerá al lado de la casilla.


  • labelPlacement: left, right, top o bottom. Indica la posición de la etiqueta de texto respecto a la casilla. Respectivamente, izquierda, derecha, arriba y abajo.


  • selected: true o false. Indica si la casilla de verificación se haya seleccionada.

ComboBox (Lista desplegable):

  • data: Matriz donde determinaremos el valor qué devolverá el componente al seleccionar determinada posición.


  • editable: true o false. Permite la edición del campo. Mediante ActionScript puedes hacer que se añadan nuevos elementos a la lista.


  • labels: Matriz donde determinaremos el nombre de los elementos de la lista. Estos elementos se corresponderán uno a uno a los valores de la matriz introducida en data. Para ambas propiedades se abrirá el siguiente cuadro de diálogo:

    Valores


    Desde aquí podrás añadir o quitar elementos utilizando los botones Añadir elemento y Eliminar elemento. O alterar el orden de éstos subiéndolos o bajándolos en la lista con los botones Lista arriba y Lista abajo.


  • rowCount: Número máximo de elementos visibles en la lista. Si este número es superado por los elementos se añadirá una barra de desplazamiento.

List (Lista):

  • data: Matriz donde determinaremos el valor qué devolverá el componente al seleccionar determinada posición.


  • labels: Matriz donde determinaremos el nombre de los elementos de la lista. Estos elementos se corresponderán uno a uno a los valores de la matriz introducida en data. Para ambas propiedades se abrirá el mismo cuadro de diálogo visto para el ComboBox.


  • multipleSelection: true o false. Permite la selección múltiple de elementos manteniendo la tecla Ctrl presionada. También es posible seleccionar un rango de elementos seleccionando uno de ellos y pulsando la tecla Shift mientras seleccionamos otro diferente, todos los elementos intermedios resultarán también seleccionados.


  • rowHeight: Número máximo de filas visibles en la lista. Si este número es superado por los elementos se añadirá una barra de desplazamiento.

NumericStepper (Contador numérico):

  • maximum: Establece el número máximo del contador.


  • minimum: Establece el número mínimo del contador.


  • stepSize: Establece el intervalo en el que se aumenta o disminuye el número del campo al pulsar los botones del componente.


  • value: Valor inicial del campo.

Nota: Todas las propiedades mencionadas para cada uno de los componentes son accesibles a través de ActionScript escribiendo el nombre de instancia del componente seguido de un punto y el nombre de la propiedad:

miBoton.label  = "Haz clic aquí";


     


© aulaClic. Todos los derechos reservados. Free Computer tutorials. Prohibida la reproducción por cualquier medio.
Septiembre - 2007.