Los ComboBox son menús en cadena que le ofrecen al usuario la oportunidad de
seleccionar una de las voces enumeradas:
Créese un nuevo movieclip y désele el nombre combobox. Hay que dibujar en el
primer nivel de la clip, la Combobox:
Añádase un nuevo nivel (al que llamaremos a-s para lista
(donde a-s indica área sensible), un área sensible (consultar
la leccion dedicada) que cubra el pulsante para la apertura de la Combobox:
(en celeste la superposición del área sensible con el
Combobox)
De ahora en adelante, todos los demás inveles que introduzcamos tendran el
primer keyframe vacío, porque este último se dedica únicamente
al combobox cerrado (desactivado), y del segundo frame en adelante, sin embargo,
será creada la animación para el combobox activado. Por esta razón,
le damos al primer keyframe del nivel a-s para lista, la action
Stop (para evitar que se muestre
continuamente el combobox activado/desactivado) y añadimos 2 keyframe
para los niveles que se acaban de crear. Asígnese action Stop
también en el segundo keyframe del nivel a-s para lista y digitar
como label lista:
Como action del área sensible apenas introducida,
digitamos:
On (Release)
Go to and Stop ("lista")
End On |
hay que señalar que esta action tiene que estar presente sólo en el
primer keyframe del nivel a-s para lista. Remitimos a la etiqueta
lista la pelicula, porque será de ese frame en adelante cuando crearemos la combobox
activada.
El primer paso que hay que dar será crear un nuevo nivel (con el primer frame
vacío), llamarlo ventana y diseñar la ventana que aparecerá cuando se clique
en la combobox:

Para conseguir que, una vez abierta la combobox,
ésta se tenga que cerrar cuando se clique con el ratón fuera de ella, introducimos
otra instancia del área sensible en un nuevo nivel que llamaremos a-s
para regreso. La dimensionamos para toda el área de trabajo de la película y
la nombramos come action:
On (Press, Release)
Go to and Stop (1)
End On |
Si habéis seguido paso a paso la explicación, el resultado hasta este
momento es:
Bien, ahora introduzcamos 2 nuevos niveles que llamaremos lista voces y voces
seleccionadas, donde diseñaremos la lista de las voces posibles (4) con relativa
selección de banda sonora.
Añadir, una bajo la otra en el primer keyframe del nivel lista voces,
las las diferentes voces que componen la combobox. En el mismo frame, pero del
nivel voces seleccionadas dibujar un rectángulo azul (o de otro
color...) que cubra la primera de las voces introducidas. Coloread la primera voz con
otro color, de modo que se lea con el fondo azul (yo he usado el blanco
cuando se seleccionan y el negro cuando no):

Introduzcamos otras 3 keyframe (como en la imagen de arriba) y,
per cada una, desplacemos el rectángulo azul de selección a la voz de banda sonora, que
se tendrá que colorear de blanco.

Llegados a este punto, no nos queda sino convertir en seleccionables las diferentes
voces de la combobox. Arrastremos, pues, otra instancia del área
sensible a un nuevo nivel que llamaremos botones voces.
Dimensionémosla para que cubra la primera de las 4 voces coloquémosla como action:
On (Roll Over, Drag Over)
Go to and Stop (2)
End On
On (Release)
Set Variable: "/:scelta" = "HTML"
Go to and Stop (1)
End On |
Las voces tienen que activarse (seleccionarse) cuando el usuario se coloca con el
puntero raton sobre ellas, y de esto se ocupa la primera parte de la action
, que tendrá que modificarse para cada keyframe en función de la voz
seleccionada (por eso, para la segunda voz tendremos Go to
and Stop(3), para la tercera Go to and Stop(4)
ecc...).
La segunda parte de action se dedica a settar la variable elección
(que además es el nombre del combobox in HTML) y al regreso del combobox
cerrado. Como se ha dicho en la lección anterior, Flash permite el envío de
variables que están en la película principal. Y es por esto por lo que tenemos que introducir
un campo de texto con el nombre elección en el mismo nivel de la
película principal donde arrastraremos una instancia del movieclip combobox
adaptándolo a la combobox diseñada:

(las líneas punteadas indican el límite de la
casilla de texto elegida)
He aquí el resultado de nuestros esfuerzos:
Descarga el ejemplo de esta lección