ASWebCreations.com

Let’s setup a folder with a video to start:

Now open your Flash software and create a new document:

Go to "Modify", "Document" and give the size you want to your Flash document then save already your Flash document in the same folder where you have the video:

You should have this in your folder now:

Back to Flash open the component window by going to "Window", and then click on "Components":

In the components window, open the video section and select the FLVPlayback component:

Click on the FLVPlayback component, hold the mouse button and drag the component onto the stage and then release the mouse:

A FLVPlayback component has been added to your Flash document. Now make sure the component is selected and go to "Window", and then click on component Inspector:

In the component Inspector window double click on the right of "Source":

This brings up a pop up where you can enter a path or browse to a valid video:

Select your video:

Then click ok:

The Flash player is ready now let’s resize it very quick. If the "Align" options are not open already go to "Window", and click on "Align" to bring the Align window:

Now with still the component selected click on these buttons (follow the order):

Now you can save and publish your movie, go to "File", and then click on "Publish". Now here is what you have now in your folder:

We just need to upload all these files but the .fla one to a folder on our server and everything should work as expected. Here is what I have now on my server:

So let’s take a look:

And here is my video!

Step Three:

To create the reflection effect we also need a gradient that we can use as a mask. In this third step this is what we are going to do. We create a new movieclip and fill it wih a gradient, we also position it over the flipped movieclip. To create this gradient we once again need to import a class that is the Matrix class. We need also a new function to create a movieclip with gradient fill and this function will be called at the end of the reflect() function.

We import the Matrix class:

import flash.geom.Matrix;

We call our new function (setupReflection()) from within the reflect function and pass the flipped movieclip as parameter:

function reflect(target_mc:MovieClip):Void{
var myBitmapData:BitmapData = new BitmapData(target_mc._width, target_mc._height, false, 0x00CCCCCC);
var mc_1:MovieClip = this.createEmptyMovieClip("reflect_mc", 2);
mc_1.attachBitmap(myBitmapData, 3);
myBitmapData.draw(target_mc);
reflect_mc._yscale = -100;
reflect_mc._y= target_mc._y+target_mc._height*2+20;
reflect_mc._x = target_mc._x;
setupReflection(reflect_mc);//here we call the new function
}

And of course we create our new function:

function setupReflection(target_mc:MovieClip):Void{
this.createEmptyMovieClip("mask_mc",50);
with (mask_mc)
{colors = [0x000000, 0xFFFFFF];
fillType = “linear”
alphas = [100, 100];
ratios = [127, 255];
spreadMethod = “pad”;
interpolationMethod = “RGB”;
focalPointRatio = 1;
matrix = new Matrix();
matrix.createGradientBox(target_mc._x, target_mc._y, Math.PI/2, 0, -150);
beginGradientFill(fillType, colors, alphas, ratios, matrix,
spreadMethod, interpolationMethod, focalPointRatio);
moveTo(target_mc._x, target_mc._y);
lineTo(target_mc._x, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y);
lineTo(target_mc._x, target_mc._y);
endFill();
}}

Here is how the whole code should look like:

import flash.display.BitmapData;
import flash.geom.Matrix;
this.createEmptyMovieClip("image_mc", 1);
var mclListener:Object = new Object();
mclListener.onLoadInit = function(target_mc:MovieClip) {
target_mc._x = (Stage.width/2)-(target_mc._width/2);
target_mc._y = 0;
reflect(target_mc);
};
var image_mcl:MovieClipLoader = new MovieClipLoader();
image_mcl.addListener(mclListener);
image_mcl.loadClip("none.jpg", image_mc);
function reflect(target_mc:MovieClip):Void{
var myBitmapData:BitmapData = new BitmapData(target_mc._width, target_mc._height, false, 0x00CCCCCC);
var mc_1:MovieClip = this.createEmptyMovieClip("reflect_mc", 2);
mc_1.attachBitmap(myBitmapData, 3);
myBitmapData.draw(target_mc);
reflect_mc._yscale = -100;
reflect_mc._y= target_mc._y+target_mc._height*2+20;
reflect_mc._x = target_mc._x;
setupReflection(reflect_mc);
}
function setupReflection(target_mc:MovieClip):Void{
this.createEmptyMovieClip("mask_mc",50);
with (mask_mc)
{
colors = [0x000000, 0xFFFFFF];
fillType = “linear”
alphas = [100, 100];
ratios = [127, 255];
spreadMethod = “pad”;
interpolationMethod = “RGB”;
focalPointRatio = 1;
matrix = new Matrix();
matrix.createGradientBox(target_mc._x, target_mc._y, Math.PI/2, 0, -150);
beginGradientFill(fillType, colors, alphas, ratios, matrix,
spreadMethod, interpolationMethod, focalPointRatio);
moveTo(target_mc._x, target_mc._y);
lineTo(target_mc._x, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y);
lineTo(target_mc._x, target_mc._y);
endFill();
}}

Hit “Ctrl+Enter” or go to “Control”, “Test Movie” to test our Flash movie. You should see this:

And here is what the code does:

this.createEmptyMovieClip("mask_mc",50);

We create a new movieclip. I’ll show only the relevant code here:

fillType = "linear"

The gradient is of type “linear”(as opposed to radial).

matrix.createGradientBox(target_mc._x, target_mc._y, Math.PI/2, 0, -150);

We set a matrix that we will use to set the gradient, we pass the flipped movieclip size as parameter and specify a Math.PI/2 as angle (horizontal), we also pass -150 as parameter for the gradient ratio(will make sense later).

beginGradientFill(fillType, colors, alphas, ratios, matrix,
spreadMethod, interpolationMethod, focalPointRatio);

We set the gradient to be used.

moveTo(target_mc._x, target_mc._y);
lineTo(target_mc._x, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y);
lineTo(target_mc._x, target_mc._y);
endFill();

Then we draw the gradient in our new movieclip.

Step Four:

Finally the last step. We now have our main picture with below it a gradient and under the gradient we have the flipped copy of the main picture. Now we need to set the alpha property of one color of the gradient to zero. Then we need to set the flipped movieclip and the gradient movieclip as bitmaps and finally we need to set the gradient movieclip as a mask for the flipped movieclip. Here is how we do it:

First set the alpha to zero of one color in the gradient:

alphas = [100, 0];

Then set both the flipped movieclip and the gradient movieclip as bitmap:

target_mc.cacheAsBitmap = true;
mask_mc.cacheAsBitmap = true;

The set the gradient movieclip as a mask for the flipped movieclip:

target_mc.setMask(mask_mc);

Here is how the whole code look like:

import flash.display.BitmapData;
import flash.geom.Matrix;
this.createEmptyMovieClip("image_mc", 1);
var mclListener:Object = new Object();
mclListener.onLoadInit = function(target_mc:MovieClip) {
target_mc._x = (Stage.width/2)-(target_mc._width/2);
target_mc._y = 0;
reflect(target_mc);
};
var image_mcl:MovieClipLoader = new MovieClipLoader();
image_mcl.addListener(mclListener);
image_mcl.loadClip("none.jpg", image_mc);
function reflect(target_mc:MovieClip):Void{
var myBitmapData:BitmapData = new BitmapData(target_mc._width, target_mc._height, false, 0x00CCCCCC);
var mc_1:MovieClip = this.createEmptyMovieClip("reflect_mc", 2);
mc_1.attachBitmap(myBitmapData, 3);
myBitmapData.draw(target_mc);
reflect_mc._yscale = -100;
reflect_mc._y= target_mc._y+target_mc._height*2+20;
reflect_mc._x = target_mc._x;
setupReflection(reflect_mc);
}
function setupReflection(target_mc:MovieClip):Void{
this.createEmptyMovieClip("mask_mc",50);
with (mask_mc)
{
colors = [0x000000, 0xFFFFFF];
fillType = “linear”
alphas = [100, 0];
ratios = [127, 255];
spreadMethod = “pad”;
interpolationMethod = “RGB”;
focalPointRatio = 1;
matrix = new Matrix();
matrix.createGradientBox(target_mc._x, target_mc._y, Math.PI/2, 0, -150);
beginGradientFill(fillType, colors, alphas, ratios, matrix,
spreadMethod, interpolationMethod, focalPointRatio);
moveTo(target_mc._x, target_mc._y);
lineTo(target_mc._x, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y-target_mc._height);
lineTo(target_mc._x+target_mc._width, target_mc._y);
lineTo(target_mc._x, target_mc._y);
endFill();
}
target_mc.cacheAsBitmap = true;
mask_mc.cacheAsBitmap = true;
target_mc.setMask(mask_mc);
}

Hit “Ctrl+Enter” or go to “Control”, “Test Movie” to test our Flash movie. You should see this:

And that’s it! Now you can modify the effect by changing values here:

alphas = [100, 0];

This will alter the amount of masking, try changing both values.

matrix.createGradientBox(target_mc._x, target_mc._y, Math.PI/2, 0, -150);

This will change the way the gradient is drawn, try changing Math.PI to other value (to rotate the gradient), try changing the two last values to move the gradient up and down.

I hope you enjoyed this tutorial, drop an email if you have any comments or questions regarding this tutorial.

Let’s create a simple dynamic shape to illustrate the concepts of moveTo() and lineTo() methods. We are going to create four little squares and draw a big square going through the little squares, as we’ll move the little squares, the big one will redraw itself.

First, let’s create our four little squares:

var arrayOfLittleSquare:Array = new Array();
var Xpos:Number = 50;
var Ypos:Number = 50;
for(var i:uint = 0; i<4; i++){
var littleSquare:Sprite = new Sprite();
addChild(littleSquare);
arrayOfLittleSquare.push(littleSquare);
littleSquare.graphics.beginFill(0x000000);
drawShape(littleSquare,10,10);
littleSquare.graphics.endFill();
littleSquare.x = Xpos;
littleSquare.y = Ypos;
Xpos+=100;
if(Xpos>150){
Xpos = 50;
Ypos+=100;
}
}
function drawShape(sprite:Sprite,Width:Number, Height:Number):void{
sprite.graphics.moveTo(-Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,-Height/2);
}

I use arrayOfLittleSquare to store the little squares so I can reference them later on. I’ll show the document class version at the end. Now let’s draw the big square. We create a new Sprite, add it to the display list before the little squares so it’ll be under them, then we create a function that will draw the sqaure according to the little square positions:

var arrayOfLittleSquare:Array = new Array();
var Xpos:Number = 50;
var Ypos:Number = 50;
var square:Sprite = new Sprite();//new line
addChild(square);//new line
for(var i:uint = 0; i<4; i++){
var littleSquare:Sprite = new Sprite();
addChild(littleSquare);
arrayOfLittleSquare.push(littleSquare);
littleSquare.graphics.beginFill(0x000000);
drawShape(littleSquare,10,10);
littleSquare.graphics.endFill();
littleSquare.x = Xpos;
littleSquare.y = Ypos;
Xpos+=100;
if(Xpos>150){
Xpos = 50;
Ypos+=100;
}}
drawDynamicShape(square);//new line
function drawShape(sprite:Sprite,Width:Number, Height:Number):void{
sprite.graphics.moveTo(-Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,-Height/2);
}
function drawDynamicShape(sprite:Sprite):void{//new function
sprite.graphics.clear();
sprite.graphics.beginFill(0x0000FF);
sprite.graphics.moveTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.lineTo(arrayOfLittleSquare[1].x,arrayOfLittleSquare[1].y);
sprite.graphics.lineTo(arrayOfLittleSquare[3].x,arrayOfLittleSquare[3].y);
sprite.graphics.lineTo(arrayOfLittleSquare[2].x,arrayOfLittleSquare[2].y);
sprite.graphics.lineTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.endFill();
}

Notice the clear() method at the beginning of the new drawDynamicShape function. It erases anything that was drawn in the graphics object before. Not relevant so far but when the code will be complete we’ll call this function many times and so we want the display to be refreshed and the old graphics to be cleared. Now if you compile this you’ll see a big blue square with at each of its corner 4 little black squares. Now we need to be able to drag the little squares, so we add two MouseEvent listeners so we can startDrag our little square and stopDrag them as well, we add also the corresponding functions:

var arrayOfLittleSquare:Array = new Array();
var Xpos:Number = 50;
var Ypos:Number = 50;
var square:Sprite = new Sprite();
addChild(square);
for(var i:uint = 0; i<4; i++){
var littleSquare:Sprite = new Sprite();
addChild(littleSquare);
arrayOfLittleSquare.push(littleSquare);
littleSquare.graphics.beginFill(0x000000);
drawShape(littleSquare,10,10);
littleSquare.graphics.endFill();
littleSquare.x = Xpos;
littleSquare.y = Ypos;
Xpos+=100;
if(Xpos>150){
Xpos = 50;
Ypos+=100;
}
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_DOWN, dragSquares);//new line
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_UP, stopSquares);//new line
}
drawDynamicShape(square)
function dragSquares(e:MouseEvent):void{//new function
e.target.startDrag();
}
function stopSquares(e:MouseEvent):void{//new function
e.target.stopDrag();
}
function drawShape(sprite:Sprite,Width:Number, Height:Number):void{
sprite.graphics.moveTo(-Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,-Height/2);
}
function drawDynamicShape(sprite:Sprite):void{
sprite.graphics.clear();
sprite.graphics.beginFill(0×0000FF);
sprite.graphics.moveTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.lineTo(arrayOfLittleSquare[1].x,arrayOfLittleSquare[1].y);
sprite.graphics.lineTo(arrayOfLittleSquare[3].x,arrayOfLittleSquare[3].y);
sprite.graphics.lineTo(arrayOfLittleSquare[2].x,arrayOfLittleSquare[2].y);
sprite.graphics.lineTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.endFill();
}

So far so good, now we just need to add an enterframe event that calls our drawDynamicShape() and you are done. When the mouse is down we add the enterFrame event, when the mouse is up we remove it, easy!

var arrayOfLittleSquare:Array = new Array();
var Xpos:Number = 50;
var Ypos:Number = 50;
var square:Sprite = new Sprite();
addChild(square);
for(var i:uint = 0; i<4; i++){
var littleSquare:Sprite = new Sprite();
addChild(littleSquare);
arrayOfLittleSquare.push(littleSquare);
littleSquare.graphics.beginFill(0x000000);
drawShape(littleSquare,10,10);
littleSquare.graphics.endFill();
littleSquare.x = Xpos;
littleSquare.y = Ypos;
Xpos+=100;
if(Xpos>150){
Xpos = 50;
Ypos+=100;
}
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_DOWN, dragSquares);
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_UP, stopSquares);
}
drawDynamicShape(square)
function dragSquares(e:MouseEvent):void{
e.target.startDrag();
e.target.addEventListener(Event.ENTER_FRAME, redrawShape);//new line
}
function stopSquares(e:MouseEvent):void{
e.target.stopDrag();
e.target.removeEventListener(Event.ENTER_FRAME, redrawShape);//new line
}
function drawShape(sprite:Sprite,Width:Number, Height:Number):void{
sprite.graphics.moveTo(-Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,-Height/2);
}
function redrawShape(e:Event):void{//new function that we use to call the drawDynamicShape function
drawDynamicShape(square);
}
function drawDynamicShape(sprite:Sprite):void{
sprite.graphics.clear();
sprite.graphics.beginFill(0×0000FF);
sprite.graphics.moveTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.lineTo(arrayOfLittleSquare[1].x,arrayOfLittleSquare[1].y);
sprite.graphics.lineTo(arrayOfLittleSquare[3].x,arrayOfLittleSquare[3].y);
sprite.graphics.lineTo(arrayOfLittleSquare[2].x,arrayOfLittleSquare[2].y);
sprite.graphics.lineTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.endFill();
}

Now if you run this example you should see this:

And here is the document Class version:

package{
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.events.Event;
public class simple_lineTo_dynamic_shape extends Sprite{
var arrayOfLittleSquare:Array = new Array();
var Xpos:Number = 50;
var Ypos:Number = 50;
var square:Sprite = new Sprite();
public function simple_lineTo_dynamic_shape(){
addChild(square);
for(var i:uint = 0; i<4; i++){
var littleSquare:Sprite = new Sprite();
addChild(littleSquare);
arrayOfLittleSquare.push(littleSquare);
littleSquare.graphics.beginFill(0x000000);
drawShape(littleSquare,10,10);
littleSquare.graphics.endFill();
littleSquare.x = Xpos;
littleSquare.y = Ypos;
Xpos+=100;
if(Xpos>150){
Xpos = 50;
Ypos+=100;
}
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_DOWN, dragSquares);
arrayOfLittleSquare[i].addEventListener(MouseEvent.MOUSE_UP, stopSquares);
}
drawDynamicShape(square)
}
function dragSquares(e:MouseEvent):void{
e.target.startDrag();
e.target.addEventListener(Event.ENTER_FRAME, redrawShape);
}
function stopSquares(e:MouseEvent):void{
e.target.stopDrag();
e.target.removeEventListener(Event.ENTER_FRAME, redrawShape);
}
function drawShape(sprite:Sprite,Width:Number, Height:Number):void{
sprite.graphics.moveTo(-Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,-Height/2);
sprite.graphics.lineTo(Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,Height/2);
sprite.graphics.lineTo(-Width/2,-Height/2);
}
function redrawShape(e:Event):void{
drawDynamicShape(square);
}
function drawDynamicShape(sprite:Sprite):void{
sprite.graphics.clear();
sprite.graphics.beginFill(0×0000FF);
sprite.graphics.moveTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.lineTo(arrayOfLittleSquare[1].x,arrayOfLittleSquare[1].y);
sprite.graphics.lineTo(arrayOfLittleSquare[3].x,arrayOfLittleSquare[3].y);
sprite.graphics.lineTo(arrayOfLittleSquare[2].x,arrayOfLittleSquare[2].y);
sprite.graphics.lineTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);
sprite.graphics.endFill();
}}
}

Have fun with this and you can always contact us for any questions.

ASWCSlideshow comes with 7 built in effects that can be set for in and for out transition, 30 easing to choose from for the in and the out transition, and over/under capability for a total of 88200 effect combination possible!

Fade

A simple high quality fade effect:

Blind

The ASWC Blind engine is similar to the Flash Blind engine but is much more stable and efficient:

Wipe

Here again the ASWC Wipe engine is similar to the Flash Wipe engine but is far more efficient:

Alpha Wipe

A combination of a fade with a wipe effect (ASWC engine exclusivity):

Iris

The ASWC version of this Flash effect with more shapes to choose from and a more efficient engine of course:

Blind fade

Fade part of the picture one after another:

Blind Progressive

Blind part of the picture one ater another:

Combining Effects

You can combine in and out effect in the general setup or on a per picture basis with the under/over capability and the 30 easing transitions to create your own customized effects. You can also tune precisely each effect:

<GENERALSETUP>
<EFFECT_IN>iris,circle,center</EFFECT_IN>
<EFFECT_OUT>alpha_wipe,right</EFFECT_OUT>
<OVER_UNDER>false</OVER_UNDER>
<INEFFECT>Sineall</INEFFECT>
<OUTEFFECT>cubic</OUTEFFECT>
<TRANSITIONTIME>3</TRANSITIONTIME>
<DISPLAYTIME>4</DISPLAYTIME>
<FIRST_PICTURE_EFFECT>on</FIRST_PICTURE_EFFECT>
<LOOP>true</LOOP>
<RANDOM>false</RANDOM>
</GENERALSETUP>

Combine an in and an out effect with the over/under capability to create your own effects:

<UNDER>true</UNDER>

Or set a per picture effect in and/or out:

<PICTURE>
<PATH>picture_demo/sky_450_114.jpg</PATH>
<IN_EFFECT>wipe,left</IN_EFFECT>
<OUT_EFFECT>blind,3,v</OUT_EFFECT>
<DYNAMIC_RESIZING></DYNAMIC_RESIZING>
</PICTURE>

ASWCSlideshow resizes your pictures dynamicaly while adapting itself to any size set in the html page:

You can also tell ASWCSlideshow to not resize a picture on a per picture basis:

<PICTURE>
<PATH>picture_demo/S6301326.JPG</PATH>
<IN_EFFECT></IN_EFFECT>
<OUT_EFFECT></OUT_EFFECT>
<DYNAMIC_RESIZING>false</DYNAMIC_RESIZING>
</PICTURE>

Specify “false” forces ASWCSlideshow to not resize the picture. The picture will be displayed from its left corner by default.

Specify “false” and enter coordinates for the horizontal value and/or the vertical value:

<PICTURE>
<PATH>picture_demo/S6301326.JPG</PATH>
<IN_EFFECT></IN_EFFECT>
<OUT_EFFECT></OUT_EFFECT>
<DYNAMIC_RESIZING>false, 100,200</DYNAMIC_RESIZING>
</PICTURE>

This will force ASWCSlideshow to move the picture to 100 on the horizontal axis and 200 on the vertical axis:

Specify “true” to force ASWCSlideshow to crop the picture as well:

<PICTURE>
<PATH>picture_demo/S6301326.JPG</PATH>
<IN_EFFECT></IN_EFFECT>
<OUT_EFFECT></OUT_EFFECT>
<DYNAMIC_RESIZING>false, 100,200,true</DYNAMIC_RESIZING>
</PICTURE>

This forces the cropping of the picture:

Setting up the ASWCSlideshow is very easy. Here are the steps:

Step 1:
Embed the ASWCSlideshow in your html using this code:

<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0″ width=”450″ height=”114″> <param name=”movie” value=”ASWCSlideshow.swf” /> <param name=”quality” value=”high” /> <param name=”FlashVars” value=”setup_XML=myxml.xml”> <embed src=”ASWCSlideshow.swf” quality=”high” pluginspage=”http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash” FlashVars=”setup_XML=myxml.xml” type=”application/x-shockwave-flash” width=”450″ height=”114″></embed> </object>

You can also use any of the dynamic embedding library like SWFObject for example.

Step 2:
Set the XML object using FlashVars.

<param name=”FlashVars” value=”setup_XML=myxml.xml”>

This XML object can also be a server side script returning a correctly formated XML object:

<param name=”FlashVars” value=”setup_XML=myxml.php”>

Step 3:
Set your XML object general setup or don’t and default values will be applied:

<GENERALSETUP>
<EFFECT_IN>fade</EFFECT_IN>
<EFFECT_OUT>blind,1</EFFECT_OUT>
<OVER_UNDER>true</OVER_UNDER>
<INEFFECT>Sineall</INEFFECT>
<OUTEFFECT>Backout</OUTEFFECT>
<TRANSITIONTIME>3</TRANSITIONTIME>
<DISPLAYTIME>4</DISPLAYTIME>
<FIRST_PICTURE_EFFECT>on</FIRST_PICTURE_EFFECT>
<LOOP>true</LOOP>
<RANDOM>false</RANDOM>
</GENERALSETUP>

Step 4:
Setup your pictures:
<PICTURE>
<PATH>picture_demo/S6301326.JPG</PATH>
<IN_EFFECT></IN_EFFECT>
<OUT_EFFECT></OUT_EFFECT>
<DYNAMIC_RESIZING>false,110,52</DYNAMIC_RESIZING>
</PICTURE>
<PICTURE>
<PATH>picture_demo/S6301331.JPG</PATH>
<IN_EFFECT></IN_EFFECT>
<OUT_EFFECT></OUT_EFFECT>
<DYNAMIC_RESIZING>false,200,100</DYNAMIC_RESIZING>
</PICTURE>

Step 5:
Upload to your server.