Tutorial 11 - Utilización de componentes

Paso 9 de 14

De esta forma habremos construido un botón que no se ve en su estado de reposo (pero que es igualmente funcional). Si estamos sobre él mostrará un recuadro blanco semitransparente (parecerá iluminar lo que se encuentre por debajo de él) y, de la misma forma, oscurecerá lo que esté detrás del botón mientras estemos haciendo clic sobre él.

Con el botón ya creado, volvemos a la escena principal.

Creamos una nueva capa llamada buttons por encima de la capa loaders.

Arrastramos al escenario cuatro instancias del botón invisible, y colocamos cada una de ellas sobre cada contenedor de las miniaturas.

Como el botón invisible no tiene ningún gráfico en su estado de reposo, veremos un recuadro azul para indicar la posición y tamaño de la instancia del botón en el escenario, y facilitar de este modo su posicionamiento.

Aunque estos botones todavía no tengan funcionalidad, podemos probar nuestra película para ver el efecto de iluminar y oscurecer que hemos conseguido con nuestros botones.

Damos a estos botones los nombres de instancia thumb0_btn, thumb1_btn, thumb2_btn y thumb3_btn.

El siguiente paso será añadir el código necesario para que esos botones que hemos creado permitan cargar las imágenes correspondientes a cada miniatura.