(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

¿Cuántos botones hacemos por día los que trabajamos en flash habitualmente?.. En esta oportunidad, hemos desarrollado un componente botón, para que cada vez que quiéramos diseñar un botón para flash, lo hagamos simplemente a partir de parámetros y creando una instancia de la clase GraphicButton .

Esta clase tiene la particularidad de permitirle a los botones tener sombra, degrade y reflejo; accesorios que nos permiten tener más herramientas a la hora de diseñar un botón.


En la película de arriba podemos ver tres ejemplos de botones, los dos primeros están definidos a partir de parámetros específicos, encambio el último es el botón por defecto si no especificamos ningún parámetro.

A continuación vamos a ver como tenemos que crear las instancias GraphicButton para poder ir agregando botones al escenario.

var blue = {
	widthbutton:300,
	heightbutton:60,
	colortop:0x002b79,
	colorbottom:0x3e82ff,
	bordercolor:0x002b79,
	bordersize:3,
	corner:40,
	textlabel:"Descargar archivo",
	strong:true,
	fontsize:23,
	fontcolor:0xFFFFFF,
	reflection:true,
	shadowbutton:true,
	dropshadow : { angle:45, alphashadow:20, blur:0, distance:3 }
}

Hemos creado un objeto en el que definimos una serie de propiedades, las cuales luego colocaremos como parámetros a la hora de crear la instancia de clase. La primera es widthbutton, con la cual establecemos el ancho del botón; heightbutton para indicar el alto; colortop y colorbottom nos permite elegir los colores superior e inferior del degrade del botón; bordercolor el color del borde; bordersize el espesor del mismo (si especifico 0, el botón no tendrá borde); corner para indicar la curvatura de las esquinas; con textlabel indico el texto que aparece en el botón; strong si quiero que el texto aparezca en negrita; fontsize para el tamaño de la fuente; fontcolor para el color de la misma; reflection si quiero que el botón tenga el efecto vidrioso; shadowbutton si deseo que el botón tenga sombra y por último con dropshadow determino cuál será la sombra arrojada del botón sobre el fondo.

//Ejemplo
var boton_azul:GraphicButton = new GraphicButton(this,blue.widthbutton,blue.heightbutton,blue.colortop,blue.colorbottom,blue.bordercolor,blue.bordersize,blue.corner,blue.textlabel,blue.strong,blue.fontsize,blue.fontcolor,blue.reflection,blue.shadowbutton,blue.dropshadow);
boton_azul.x = stage.stageWidth/2 - boton_azul.width/2;
boton_azul.y = 20;

//Botón por defecto
var boton_comun:GraphicButton = new GraphicButton(this);
boton_comun.x = stage.stageWidth/2 - boton_comun.width/2;
boton_comun.y = 180;

Arriba podemos ver la creación de dos instancias, boton_azul y boton_comun; la primera crea un botón totalmente personalizado y la segunda uno simple en el que no se especifican parámetros; por tanto, veremos el botón en su estado por defecto.
Debajo de la creación de la instancia de los botones posicionamos los mismos en X e Y, en este caso los tres aparecen centrados horizontalmente y ubicados una encima del otro verticalmente.

Hagan click debajo para descargar los archivos.. espero puedan hacer muchos y lindos botones!

Descargar archivos

¡Hasta pronto!

Categoría: Multimedia, Tutoriales

Publicado por: negro

Entradas más populares

2 Respuestas para “Diseñar botones dinámicamente – AS3”

Dejar una respuesta

XHTML: Tu pudes usar estas etiquetas: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>