Share
En este Consejo rápido, te mostraré cómo crear una herramienta de Shapshot que copie parte del escenario y guarde el resultado como una imagen PNG..
Este es el resultado final. Simplemente haga clic en el escenario y luego arrastre el mouse para tomar una instantánea.
Cree una nueva carpeta para este proyecto y asígnele el nombre que desee. Ve a Github y descarga la última versión del as3corelib Clase. Para este consejo rápido he usado la versión .93. Extraiga el archivo ZIP y vaya a as3corelib-.93> src.
Copia el com directorio a su carpeta recién creada. Este paquete tiene una muy útil. PNGEncoder Clase que utilizaremos para codificar el
instantánea en una imagen PNG.
Inicie Flash y cree un nuevo documento Flash. Asegúrese de que esté configurado para publicar en Actionscript 3.0 y Flash Player 10. Puede verificar esto en las Propiedades
panel o seleccionando Configuración de publicación ... y luego haciendo clic en el Destello lengüeta.
Necesitamos algo de contenido en el archivo Flash para verificar si la herramienta de instantáneas está funcionando correctamente. Vamos a crear algunos círculos y colocarlos al azar alrededor del escenario. Crear una nueva clase de documento llamada Círculos.as y añada el siguiente código. Recuerde vincular la Clase al archivo Flash escribiendo Círculos en el Clase campo en el Propiedades Panel.
paquete import flash.display.Shape; importar flash.display.Sprite; la clase pública Circles extiende Sprite private var _circleCount: int = 20; Función pública Círculos () makeCircles (); la función privada makeCircles (): void for (var i: int = 0; i < _circleCount; i++) var circle:Shape = new Shape(); circle.graphics.lineStyle(1, 0xCCCCCC, 1); circle.graphics.beginFill(0x333333, 0.5); circle.graphics.drawCircle(Math.random() * stage.stageWidth, Math.random() * stage.stageHeight, (Math.random() * 40) + 20); circle.graphics.endFill(); addChild(circle);
Sin embargo, nuestra función de instantánea funcionará con cualquier contenido de escenario, así que no sientas que debes restringirte a formas simples!
Crea un nuevo archivo de clase y dale un nombre de SnapShot.as. Esta es la clase que contendrá todos los métodos utilizados para tomar una instantánea. Agregue el siguiente código a la clase.
paquete import flash.display.Stage; clase pública snapShot private var _stage: Stage; Función pública instantánea () función pública activa (etapa: etapa): void _stage = etapa;
Agregue las siguientes líneas de código a la Círculos Clase. Usamos el activar() método para pasar una referencia al escenario a lo largo de la Instantánea Clase. Hacemos esto para que podamos acceder al contenido en el escenario..
paquete import flash.display.Shape; importar flash.display.Sprite; la clase pública Circles extiende Sprite private var _circleCount: int = 20; privada var _snapshot: SnapShot; Función pública Círculos () makeCircles (); _snapshot = nuevo SnapShot (); _snapshot.activate (etapa); la función privada makeCircles (): void for (var i: int = 0; i < _circleCount; i++) var circle:Shape = new Shape(); circle.graphics.lineStyle(1, 0xCCCCCC, 1); circle.graphics.beginFill(0x333333, 0.5); circle.graphics.drawCircle(Math.random() * stage.stageWidth, Math.random() * stage.stageHeight, (Math.random() * 40) + 20); circle.graphics.endFill(); addChild(circle);
Ampliar la Instantánea Clase para incluir los siguientes métodos. Estos métodos se utilizan para dibujar el marco de límites, lo que permite a los usuarios seleccionar qué parte de la etapa se copiará en la instantánea.
paquete import flash.display.Shape; importar flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; clase pública snapShot private var _stage: Stage; private var _boundary: Shape; var_originX privado: int; var _originY privado: int; var privado _mouseX: int; private var _mouseY: int; función pública SnapShot () función pública activa (etapa: etapa): void _stage = etapa; addMouseListeners (); función privada addMouseListeners (): void _stage.addEventListener (MouseEvent.MOUSE_DOWN, onMouseDown); _stage.addEventListener (MouseEvent.MOUSE_UP, onMouseUp); función privada onMouseDown (e: MouseEvent): void _stage.addEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); // Estos valores se utilizan más adelante como punto de partida para el límite. _originX = _stage.mouseX; _originY = _stage.mouseY; función privada drawBoundaries (e: MouseEvent): void if (_boundary == null) _boundary = new Shape (); clearBoundaries () // Esto es para que el valor del mouseY permanezca dentro de los límites del escenario. _mouseY = Math.max (Math.min (_stage.mouseY, _stage.stageHeight), 0); // Esto es para que el valor del mouseX se mantenga dentro de los límites del escenario. _mouseX = Math.max (Math.min (_stage.mouseX, _stage.stageWidth), 0); _boundary.graphics.lineStyle (2, 0x0, 0.5); _boundary.graphics.drawRect (_originX, _originY, _mouseX - _originX, _mouseY - _originY); _boundary.graphics.lineStyle (4, 0x0, 0.2); // Este código se asegura de que siempre dibujemos desde el punto superior izquierdo a la inferior derecha. _boundary.graphics.drawRect (Math.min (_originX, _mouseX) - 3, Math.min (_originY, _mouseY) - 3, Math.abs (_mouseX - _originX) + 6, Math.abs (_mouseY - _originY) + 6) ; _stage.addChild (_boundary); función privada clearBoundaries (): void _boundary.graphics.clear (); función privada onMouseUp (e: Event): void _stage.removeEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); clearBoundaries ();
Comenzamos por comprobar si el usuario ha hecho clic en el Escenario. Cuando hace clic en el escenario empezamos a correr el límites de dibujo () Método cada vez que se mueve el ratón. Este método traza los límites; lo que caiga dentro de la delgada línea negra será parte de la instantánea. Cuando el usuario suelta el mouse, dejamos de verificar los movimientos del mouse..
Importar el BitmapData y Matriz Clases y añadir el _contenido Propiedad a la lista de propiedades privadas..
package import flash.display.BitmapData; importar flash.display.Shape; importar flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; importar flash.geom.Matrix; import flash.geom.Rectangle; clase pública snapShot private var _stage: Stage; private var _boundary: Shape; private var _content: BitmapData; var_originX privado: int; var _originY privado: int; var privado _mouseX: int; private var _mouseY: int;
Agregue el siguiente código al final de la Clase:
función privada onMouseUp (e: Event): void _stage.removeEventListener (MouseEvent.MOUSE_MOVE, drawBoundaries); clearBoundaries (); createBitmap (); private function createBitmap (): void // Agregamos el -2 para compensar la línea de límite. _content = new BitmapData (Math.abs (_mouseX - _originX) - 2, Math.abs (_mouseY - _originY) - 2); // El -1 se agrega por el mismo motivo, para evitar que la línea aparezca en la imagen final. var bitmapMatrix: Matrix = new Matrix (1, 0, 0, 1, -Math.min (_originX, _mouseX) - 1, -Math.min (_originY, _mouseY) - 1); _content.draw (_stage, bitmapMatrix);
los crearBitmap () método crea un nuevo BitmapData Objeto con el ancho y la altura del área de contenido dentro del límite. los matriz Las transiciones variables (mueven) la imagen para que cuando la dibujar() Se llama método. Comienza a copiar desde la esquina superior izquierda del área del límite..
Para guardar el mapa de bits necesitamos importar varias clases..
Accentsconagua
ByteArray La clase se utiliza para codificar el BitmapData objeto.PNGEncoder La clase se utiliza para convertir los datos codificados en una imagen PNG.FileReference La clase se utiliza para guardar la imagen en el disco duro del usuario..También hemos añadido un _imageCount Propiedad que utilizamos para incrementar los nombres de las imágenes..
paquete import com.adobe.images.PNGEncoder; importar flash.display.BitmapData; importar flash.display.Shape; importar flash.display.Stage; import flash.events.Event; import flash.events.MouseEvent; importar flash.geom.Matrix; import flash.geom.Rectangle; importar flash.net.FileReference; import flash.utils.ByteArray; Instantánea de la clase pública private var _stage: Stage; private var _boundary: Shape; private var _content: BitmapData; var_originX privado: int; var _originY privado: int; var privado _mouseX: int; private var _mouseY: int; private var _imageCount: int = 1;
Agregue el siguiente código al final de la Clase SnapShot:
función privada createBitmap (): void _content = new BitmapData (Math.abs (_mouseX - _originX) - 2, Math.abs (_mouseY - _originY) - 2); var bitmapMatrix: Matrix = new Matrix (1, 0, 0, 1, -Math.min (_originX, _mouseX) - 1, -Math.min (_originY, _mouseY) - 1); _content.draw (_stage, bitmapMatrix); saveBitmap (); la función privada saveBitmap (): void var encodedContent: ByteArray = PNGEncoder.encode (_content); var fileWindow: FileReference = new FileReference (); fileWindow.save (encodedContent, "Image_" + _imageCount + ".png"); _imageCount ++;
los saveBitmap El método es bastante fácil de entender. Codificamos el BitmapData objeto y guardarlo en el disco duro del usuario.
Usamos el _imageCount propiedad para facilitar al usuario guardar varias imágenes en una fila.
La herramienta de instantáneas ahora está completa y con solo tres líneas de código se pueden implementar en cualquier proyecto.
Asegúrese de que está ejecutando Flash Player 10 y que tiene el paquete as3corelib en el directorio correcto.
Espero que hayan disfrutado este Consejo rápido, gracias por leer.!
