flash as3 Fadein fadeout xml幻灯片

Question

我是新来的as3.0，想完成我的项目。

我使用下面的代码为我的xml幻灯片，但我希望图片淡入对方，它永远不应该褪色，以完成白色。希望任何专家都可以帮助我。

import gs.*; 
import flash.display.Sprite; 
import flash.display.StageAlign; 
import flash.display.StageScaleMode; 
import flash.events.Event; 
import fl.transitions.easing.*; 

stage.scaleMode = StageScaleMode.NO_SCALE; 
stage.align = StageAlign.TOP_LEFT; 
//hides the description box until the image is loaded 
//hides the image until it is loaded 

theImage.alpha=0; 
loadingBar.visible = false; 

//variables to hold the final coordinates of the image tween 
var finalX:Number; 
var finalY:Number; 

//variable to hold the number of images in the XML 
var listLength:Number; 

//keeps track of what image should be displayed 
var currPainting:Number=0; 

//arrays to hold the contents of the XML, using this to allow 
//for the random order of the images 
var imageArray:Array = new Array(); 


//Loader event for the XML 
var loader:URLLoader = new URLLoader(); 
loader.addEventListener(Event.COMPLETE, onLoaded); 

var xml:XML; 

loader.load(new URLRequest("galleries/xml/maingallery.xml")); 

function onLoaded(e:Event):void { 
//load XML 
xml=new XML(e.target.data); 
var il:XMLList=xml.images; 
listLength=il.length(); 

populateArray(); 
} 

function populateArray():void { 
//takes the properties defined in the XML and stores them 
//into arrays 
var i:Number; 
for (i = 0; i < listLength; i++) { 
    imageArray[i]=xml.images[i].pic; 

} 

beginImage(); 
} 

function beginImage():void { 
//grabs a random number between 0 and the number 
//of images in the array 

//load description 

var imageLoader = new Loader(); 

//catches errors if the loader cannot find the URL path 
imageLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, catchFunction); 
//actually loads the URL defined in the image array 
imageLoader.load(new URLRequest(imageArray[currPainting])); 
//adds a listener for while the image is loading 
imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, imgLoading); 
//adds a listener for what to do when the image is done loading 
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoaded); 


function catchFunction(e:IOErrorEvent) { 
    trace("Bad URL: " + imageArray[currPainting] + " does not exist"); 
    //take out the bad URL from the array 
    imageArray.splice(currPainting,1); 
    //check to see if there are images left, 
    //else restart the slideshow 
    if (imageArray.length==0) { 
     populateArray(); 
    } else { 
     beginImage(); 
    } 
} 

function imgLoading(event:ProgressEvent):void{ 
    //show the loading bar, and update the width 
    //based on how much is loaded 
    loadingBar.visible = true; 
    loadingBar.bar.scale = (event.bytesLoaded/event.bytesTotal)*100; 
    loadingBar.x = stage.stageWidth/2; 
    loadingBar.y = stage.stageHeight - 400; 

} 


var widthRatio:Number; 
var heightRatio:Number; 
function imgLoaded(event:Event):void { 
    loadingBar.visible = false; 

    //add the image and get the dimensions to center the image 
    theImage.addChild(imageLoader); 
    if (imageLoader.width > stage.stageWidth){ 
    widthRatio=imageLoader.width/stage.stageWidth; 
    trace(widthRatio) 
    trace(imageLoader.width); 
     } 
    if (imageLoader.height > stage.stageHeight - 207){ 
    heightRatio=imageLoader.height/(stage.stageHeight - 207) ; 
    trace(heightRatio) 
    trace(imageLoader.height) 
    } 

    if (widthRatio > heightRatio){ 
     imageLoader.width = stage.stageWidth; 
     imageLoader.height = imageLoader.height/widthRatio; 
    } else { 
     imageLoader.height = stage.stageHeight - 207; 
     imageLoader.width = imageLoader.width/heightRatio; 
} 


    imageLoader.x = (imageLoader.stage.stageWidth/2) - (imageLoader.width/2); 
    imageLoader.y = 0 

    //take the contents of the loaded image and cast it as bitmap data 
    //to allow for bitmap smoothing 

    var image:Bitmap = imageLoader.content as Bitmap; 
    image.smoothing=true; 
    //start tween function 
    easeIn(); 
} 
} 


function easeIn():void { 

TweenLite.to(theImage, 5, {onComplete:hideStuff}); 
TweenLite.to(theImage, 1, {alpha:1, overwrite:0}); 
} 

function hideStuff():void { 
TweenLite.to(theImage, 1, {alpha:0, onComplete:nextImage}); 

} 

function nextImage():void { 
//take out the image that was just displayed 
imageArray.splice(currPainting,1); 


//remove the picture 
theImage.removeChildAt(0); 


//start over 
if (imageArray.length==0) { 
    populateArray(); 
} else { 
    beginImage(); 
} 
} 

Answer 1

好吧，首先你需要为你想要淡入的图像创建一个变量。让我们来组织它，以便清楚哪个是哪个。

var theCurrentImage:DisplayObject; 
var theNextImage:DisplayObject; 

负载在如前同样的方式在第一图像（现theCurrentImage）英寸

现在，这里是你如何能在下一个图像中的数组中加载：

function loadNextImage():void { 
    currPainting++; 
    // you should also make sure currPainting is not out of bounds here 
    loadImage(); 
} 

function loadImage():void { 
    imageLoader = new Loader(); 
    imageLoader.addEventListener(Event.COMPLETE, onImageLoaded); 
    // other listeners go here too 
    imageLoader.load(new URLRequest(imageArray[currPainting])); 
} 

function onImageLoaded(e:Event):void { 
    theNextImage = imageLoader; // stores the next image ready to be faded in 
    theNextImage.alpha = 0; 
    addChild(theNextImage); // now ready to be cross-faded in 
    crossFade(); 
} 

function crossFade():void { 
    TweenLite.to(theCurrentImage, 1, {alpha:0}); 
    TweenLite.to(theNextImage, 1, {alpha:1}); 
    // remove theCurrentImage (now invisible) from the stage 
    removeChild(theCurrentImage); 
    // theNextImage is now the displayed image so... 
    theCurrentImage = theNextImage; 
    theNextImage = null; 
    // ready to load the next image by calling loadNextImage() 
}