Mascara com AS3

[Paulo Mardson 1]

Bom galera, esta é uma das seções do fórum que menos visito, ou melhor só algumas vezes. É o seguinte eu estou com uma dúvida quanto a mascaras. A questão é; tenho um slide e queria que estas imagem fossem exibidas dentro desta FORMA. Abaixo segue o código:

 

Creio que aqui acontece a inserção das imagens no palco:

private function sortImages(e:Event):void
		{
			imagesCounter++;

			for (var i:int = 0; i < imagesVector.length; i++)
			{
				imagesVector.reverse();
				addChild(imagesVector[i]);
			}

			if (imagesCounter == imagesVector.length)
			{
				timer.addEventListener(TimerEvent.TIMER, autoChange);
				timer.start();
				addPreloader();
			}
		}

Cód. Completo

/* XML Image Rotator */
/* Developed by Carlos Yanez */
/* Creates an XML image gallery or image rotator */

//Image Credits:
//http://www.flickr.com/photos/100kr/209708058/
//http://www.flickr.com/photos/spettacolopuro/3826568927/
//http://www.flickr.com/photos/arcticpuppy/4091521108/

package 
{

	import fl.transitions.Tween;
	import fl.transitions.easing.Strong;
	import fl.transitions.TweenEvent;
	
	import flash.display.Sprite;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.display.Loader;
	import flash.text.TextField;
	import flash.text.TextFormat;
	import flash.text.TextFieldAutoSize;
	import flash.text.AntiAliasType;
	import flash.utils.Timer;
	import flash.events.TimerEvent;
	import flash.events.Event;
	import flash.events.MouseEvent;

	public class ImageRotator extends Sprite
	{
		private var xml:XML;
		private var urlLoader:URLLoader;
		private var imagesVector:Vector.<Loader> = new Vector.<Loader>();
		private var imagesCounter:int = 0;
		private var tween:Tween;
		private var lastTarget:*;
		private var tweening = false;
		private var infoCounter:int = 0;
		private var infoPanel:Sprite = new Sprite();
		private var titleField:TextField = new TextField();
		private var description:TextField = new TextField();
		private var titleFormat:TextFormat = new TextFormat();
		private var descriptionTF:TextFormat = new TextFormat();
		private var timer:Timer;
		private var preloader:Preloader = new Preloader();
		private var added:Boolean;

		private var titleFont:Helvetica = new Helvetica();
		private var bitmapFont:Harmony = new Harmony();

		public function ImageRotator(xmlPath:String = "images.xml", interval:int = 5000):void
		{
			timer = new Timer(interval);

			titleFormat.bold 	= true;
			titleFormat.font 	= titleFont.fontName;
			titleFormat.color 	= 0xFFFFFF;
			titleFormat.size 	= 14;

			descriptionTF.font 	= bitmapFont.fontName;
			descriptionTF.color = 0xEEEEEE;
			descriptionTF.size 	= 8;

			titleField.defaultTextFormat = titleFormat;
			titleField.autoSize = TextFieldAutoSize.LEFT;
			titleField.embedFonts = true;
			titleField.antiAliasType = AntiAliasType.ADVANCED;

			description.defaultTextFormat = descriptionTF;
			description.autoSize = TextFieldAutoSize.LEFT;
			description.embedFonts = true;

			loadXML(xmlPath);
		}

		private function loadXML(file:String):void
		{
			urlLoader = new URLLoader(new URLRequest(file));
			urlLoader.addEventListener(Event.COMPLETE, parseXML);
		}

		private function parseXML(e:Event):void
		{
			xml = new XML(e.target.data);
			loadImages();
		}

		private function loadImages():void
		{
			for (var i:int = 0; i < xml.children().length(); i++)
			{
				var loader:Loader = new Loader();
				loader.load(new URLRequest(xml.children()[i].@src));
				imagesVector.push(loader);
				loader.contentLoaderInfo.addEventListener(Event.COMPLETE, sortImages);
			}
		}

		private function sortImages(e:Event):void
		{
			imagesCounter++;

			for (var i:int = 0; i < imagesVector.length; i++)
			{
				imagesVector.reverse();
				addChild(imagesVector[i]);
			}

			if (imagesCounter == imagesVector.length)
			{
				timer.addEventListener(TimerEvent.TIMER, autoChange);
				timer.start();
				addPreloader();
			}
		}

		private function changeDepth(e:TweenEvent):void
		{
			setChildIndex(lastTarget, 0);
			lastTarget.alpha = 1;
			tweening = false;
		}

		private function autoChange(e:TimerEvent):void
		{
			infoCounter++;

			lastTarget = imagesVector[xml.children().length() - infoCounter];
			tween = new Tween(imagesVector[xml.children().length() - infoCounter],"alpha",Strong.easeOut,1,0,1,true);
			tween.addEventListener(TweenEvent.MOTION_FINISH, changeDepth);
			tweening = true;

			if (infoCounter >= xml.children().length())
			{
				infoCounter = 0;
				titleField.text = xml.children()[infoCounter]. @ title;
				description.text = xml.children()[infoCounter]. @ description;
			}
			else
			{
				titleField.text = xml.children()[infoCounter]. @ title;
				description.text = xml.children()[infoCounter]. @ description;
			}
		}

		private function addPreloader():void
		{
			added = true;
			
			preloader.scaleX = 0.08;
			preloader.scaleY = 0.08;
		
			preloader.x = (600 - preloader.width/2) - 12;
			preloader.y = (300 - preloader.height/2) - 12;
		
			addChild(preloader);
		}
	}
}

[Paulo Mardson 1]

Eu tentei algo assim:

 

Adicionei mais uma variável:

private var mascara:Sprite = new Sprite();

 

e nesta função:

private function loadImages():void
                {
                        for (var i:int = 0; i < xml.children().length(); i++)
                        {
                                var loader:Loader = new Loader();
                                loader.load(new URLRequest(xml.children()[i].@src));
                                imagesVector.push(loader);
                                loader.contentLoaderInfo.addEventListener(Event.COMPLETE, sortImages);
                                
                                // FOI Adicionado
                                loader.mask = mascara;

                        }
                }

Entre outras alterações, mas chega a funcionar quando é exibida a ultima imagem, mas depois da erro, alguém pode me ajudar?

[Thiago de Oliveira Cruz 21]

Qual o erro que dá?

 

Pois se você tem aquela forma... sem fundo.

 

Tudo que você precisa fazer é colocar a imagem lá usar a mesma imagem como CAPA e MASCARA

Ai tudo que você precisa fazer é colocar a mascara relacionada ao Loader que vai carregar as imagens.

 

E ta feita sua mascara nos MovieClips

 

De resto é tudo igual... carregar imagens uma por uma etc.

 

Abraços