• inicio
  • tutoriales flash
  • trucos flash
  • faq's flash
  • enlaces flash
  • suscribirse al feed RSS

tutoriales ( todos | principiante | medio | avanzado | AS 1.0 | AS 2.0 | AS 3.0 | top )

Tutorial FLASH - Tutorial sobre como hacer un selector de color en Flash con la clase BitmapData.

| | Más
Versión Flash: 8 y superiores   |   Compatible con ActionScript 2.0   |   Nivel: Medio   |   Hits: 37661

Ahora con Flash 8 y la clase BitmapData crear un selector de color es muy sencillo.

COMO HACERLO.
Vamos a crear un clip en la línea de tiempo principal llamado tapiz_mc. este clip contiene en su interior la fuente de donde se van a obtener los valores de color. En nuestro caso, hemos puesto una imagen con un espectro de colores muy variado.
Además, en una capa superior, vamos a incluir un clip con forma de cruz llamado cursor_mc que es el que vamos a desplazar por el tapiz.

A continuación teneís el código comentado que va en la línea de tiempo principal, que además es el único de toda la película.

//esta función es la que comprueba el color y se lo asigna a la muestra
function comprobar_color():Void {
import flash.display.BitmapData;
import flash.geom.ColorTransform;
import flash.geom.Transform;
// creamos un objeto bipmapdata con el contenido del clip de colores
var bitmap_1:BitmapData = new BitmapData(tapiz_mc._width, tapiz_mc._height);
bitmap_1.draw(tapiz_mc);
// desplazamos el puntero de cruz y nos aseguramos de que no se salga del picker
cursor_mc._x = Math.round(_root._xmouse);
cursor_mc._y = Math.round(_root._ymouse);
if (cursor_mc._x>tapiz_mc._width-1) {
cursor_mc._x = tapiz_mc._width-1;
}
if (cursor_mc._y>tapiz_mc._height-1) {
cursor_mc._y = tapiz_mc._height-1;
}
if (cursor_mc._x<0) {
cursor_mc._x = 0;
}
if (cursor_mc._y<0) {
cursor_mc._y = 0;
}
// asignmos el color elegido al rectángulo de muestra
var color_sample:Color = new Color(sample_mc);
color_sample.setRGB(bitmap_1.getPixel(cursor_mc._x, cursor_mc._y));
// mostramos los valores RGB en la caja de texto
var colorSeleccionado = deEXaRGB(bitmap_1.getPixel(cursor_mc._x, cursor_mc._y));
valores = "RGB ("+colorSeleccionado.red+", "+colorSeleccionado.green+", "+colorSeleccionado.blue+")";
}
// cuando presionamos el clip de colores, ocultamos el ratón,
// y ejecutamos la función comprobar_color() ,definida anteriormente

tapiz_mc.onPress = function() {
Mouse.hide();
comprobar_color();
delete _root.onMouseMove;
_root.onMouseMove = function() {
comprobar_color();
updateAfterEvent();
};
};
// paramos al liberar el ratón
tapiz_mc.onRelease = function() {
delete _root.onMouseMove;
Mouse.show();
};
tapiz_mc.onReleaseOutside = tapiz_mc.onRelease;
// función auxiliar para convertir de hexadecimal a RGB
function deEXaRGB(valor:Number):Object {
var RGB = new Object();
RGB.red = (valor >> 16) & 0xFF;
RGB.green = (valor >> 8) & 0xFF;
RGB.blue = valor & 0xFF;
return RGB;
}

Como veis, no mentíamos al decir que crear un color picker en Flash es tarea sencilla.
Podéis descargaros este mismo ejemplo y ver cómo funciona: picker.fla

Trucos Flash relacionados
| | Más
flash 1flash 1flash 1flash 2flash 1flash 3flash 1flash 4