Come per mascherare l'immagine con un'altra immagine in ActionScript 3.0

Question

Il mio problema è questo, i miei utenti importare un'immagine con FileReference e ho bisogno di mascherare e poi inviarlo al server.

Il mio problema è questo: io sono in grado do mantenere l'evento FileReference e trasferire i dati immagine nella mia tela. Sono in grado di inviare al server il risultato del mascheramento.

ma non sono in grado di mascherare l'immagine che i miei utenti hanno in carico la mia tela.

Answer 1

Hai solo bisogno di aggiungere bitmap caricata nel contenitore mascherabile (ad esempio Sprite). Per esempio: Test.as

package {
import flash.display.Graphics;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.net.FileFilter;
import flash.net.FileReference;

public class Test extends Sprite {

    private var _fileReference:FileReference;
    private var _fileFilter:FileFilter;
    private var _loader:Loader;
    private var _imageContainer:Sprite;
    private var _mask:Sprite;
    private var _canvas:Sprite;

    public function Test() {
        addEventListener(Event.ADDED_TO_STAGE, addedToStageListener, false, 0, true);
    }

    private function addedToStageListener(event:Event):void {
        removeEventListener(Event.ADDED_TO_STAGE, addedToStageListener);

        _fileReference = new FileReference();
        _fileReference.addEventListener(Event.SELECT, fileSelectedListener, false, 0, true);
        _fileReference.addEventListener(Event.COMPLETE, fileLoadCompleteListener, false, 0, true);

        _fileFilter = new FileFilter("Images", "*.jpg;*.gif;*.png");

        _loader = new Loader();
        _canvas = new Sprite();

        _mask = new Sprite();
        var maskGraphics:Graphics = _mask.graphics;
        maskGraphics.beginFill(0xFFFFFF);
        maskGraphics.drawCircle(50, 50, 50);
        maskGraphics.endFill();

        _imageContainer = new Sprite();
        _imageContainer.mask = _mask;

        _canvas.addChild(_imageContainer);
        _canvas.addChild(_mask);

        addChild(_canvas);

        stage.addEventListener(MouseEvent.CLICK, mouseClickListener, false ,0, true);
    }

    private function mouseClickListener(event:Event):void {
        _fileReference.browse([_fileFilter]);
    }

    private function fileSelectedListener(event:Event):void {
        _fileReference.load();
    }

    private function fileLoadCompleteListener(event:Event):void {
        _loader.loadBytes(event.target.data);

        while(_imageContainer.numChildren) {
            _imageContainer.removeChildAt(0);
        }
        _imageContainer.addChild(_loader);
    }
}}

Answer 2

Questo cambia la situazione, ma non in modo drammatico. Scopri la soluzione modificata:

package {
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.net.FileFilter;
import flash.net.FileReference;

public class Test extends Sprite {

    private var _fileReference:FileReference;
    private var _fileFilter:FileFilter;
    private var _imageLoader:Loader;
    private var _maskLoader:Loader;
    private var _canvas:Sprite;

    private var _imageLoaded:Boolean = false;

    public function Test() {
        addEventListener(Event.ADDED_TO_STAGE, addedToStageListener, false, 0, true);
    }

    private function addedToStageListener(event:Event):void {
        removeEventListener(Event.ADDED_TO_STAGE, addedToStageListener);

        _fileReference = new FileReference();
        _fileReference.addEventListener(Event.SELECT, fileSelectedListener, false, 0, true);
        _fileReference.addEventListener(Event.COMPLETE, fileLoadCompleteListener, false, 0, true);

        _fileFilter = new FileFilter("Images", "*.jpg;*.gif;*.png");

        _imageLoader = new Loader();
        _imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoadCompleteListener, false, 0, true);
        _maskLoader = new Loader();
        _maskLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, maskLoadCompleteListener, false, 0, true);

        _canvas = new Sprite();
        addChild(_canvas);

        stage.addEventListener(MouseEvent.CLICK, mouseClickListener, false ,0, true);
    }

    private function mouseClickListener(event:Event):void {
        _fileReference.browse([_fileFilter]);
    }

    private function fileSelectedListener(event:Event):void {
        _fileReference.load();
    }

    private function fileLoadCompleteListener(event:Event):void {
        if (!_imageLoaded) {
            _imageLoader.loadBytes(event.target.data);
        } else {
            _maskLoader.loadBytes(event.target.data);
        }
    }

    private function imageLoadCompleteListener(event:Event):void {
        _imageLoaded = true;
    }

    private function maskLoadCompleteListener(event:Event):void {
        var imageBitmap:Bitmap = _imageLoader.content as Bitmap;
        var maskBitmap:Bitmap = _maskLoader.content as Bitmap;

        if (imageBitmap && maskBitmap) {
            var imageBitmapData:BitmapData = imageBitmap.bitmapData;
            var maskBitmapData:BitmapData = maskBitmap.bitmapData;

            var boundRectange:Rectangle = new Rectangle(0, 0, maskBitmap.width, maskBitmap.height);
            var destinationPoint:Point = new Point(0, 0);

            var finalBitmapData:BitmapData = new BitmapData(maskBitmap.width, maskBitmap.height);
            finalBitmapData.copyPixels(imageBitmapData, boundRectange, destinationPoint, maskBitmapData, destinationPoint);
            var finalBitmap:Bitmap = new Bitmap(finalBitmapData);

            while(_canvas.numChildren) {
                _canvas.removeChildAt(0);
            }
            _canvas.addChild(finalBitmap);
        }
    }
}}

In primo click sul palco vi permette di selezionare l'immagine mascherata. Secondo clic consente di selezionare l'immagine, che contiene le informazioni di mascheramento (file png per esempio con trasparenza). Spero che questo aiuti.