Tutorial del componente Button de Flash

Anteriormente hemos podido ver levemente este componente en los capítulos "Personalizar los componentes" y "Escuchando nuestros componentes". Ahora veremos que otras funciones podemos añadirle al componente Button. Copia en tu primer fotograma el código que habíamos hecho, y no olvides poner un componente botón en tu librería:

//Atacheamos el menu de nuestra librería
attachMovie("Button", "mi_boton", 1);
//Propiedades del menu
mi_boton._x = 0;
mi_boton._y = 0;
mi_boton.setSize(100, 20);
mi_boton.setStyle("themeColor", "haloOrange");
//Fuentes
mi_boton.fontFamily = "_sans";
mi_boton.fontSize = 10;
mi_boton.label = "CLICAME";
//Eventos del botón
al_pulsar = new Object();
al_pulsar.click = function() {
	trace("Me has clicado...");
};
mi_boton.addEventListener("click", al_pulsar);

Ahora veamos que más podemos hacer con nuestro botón:

Estilo	Descripción/Uso
icon	Nombre de un objeto de nuestra librería. El botón no modificará su tamaño para hacerse igual de grande que el objeto en cuestión, deberemos modificar mediante setSize el tamaño a nuestra conveniencia. Con labelPlacement podemos modificar la posición del objeto en el botón.
label	Texto que saldrá en el botón.
labelPlacement	Posición del icono en relación al texto que haya en nuestro botón. Podemos posicionar a la izquierda, a la derecha, encima o debajo del texto nuestro icono mediante "left", "right", "top" y "bottom" respectivamente.
selected	Booleano que nos dice si nuestro botón está pulsado en este momento o no. Esta propiedad solo funciona si toggle es igual a true.
toggle	Propiedad que convierte nuestro botón, en un botón interruptor, esto quiere decir que, una vez pulsado, sólo se desactiva al pulsar de nuevo sobre el.

Vamos a modificar un poco nuestro código, para ver diferentes propiedades. Primero haz un símbolo cualquiera, y exportalo en la biblioteca para actionscript, ponle de nombre icono. Ahora quita tu código actual, y añade este:

//Atacheamos el menu de nuestra librería
attachMovie("Button", "mi_boton", 1);
//Propiedades del menu
mi_boton._x = 0;
mi_boton._y = 0;
mi_boton.setSize(100, 20);
mi_boton.setStyle("themeColor", "haloOrange");
//Fuentes
mi_boton.fontFamily = "_sans";
mi_boton.fontSize = 10;
mi_boton.label = "CLICAME";
mi_boton.toggle = true;
mi_boton.icon = "icono";
mi_boton.labelPlacement = "left";
//Eventos del boton
al_pulsar = new Object();
al_pulsar.click = function() {
	if (mi_boton.selected == true) {
		trace("Ahora estoy activado");
	} else if (mi_boton.selected == false) {
		trace("Ahora estoy desactivado");
	}
};
mi_boton.addEventListener("click", al_pulsar);

Fíjate como ahora al clicar, el botón se mantiene pulsado como si fuese un interruptor. Esto es gracias a la propiedad toggle, y dentro del listener, con la propiedad selected podemos saber cuando esta activado y cuando no.

Hasta el próximo componente.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Descargar Archivo

Tutorial del componente Button de Flash

Publica tu comentario

o puedes...