Bonjour tout le monde,
Comme promis je vous donne des nouvelles de mon travail !
Après avoir beaucoup peiné pour régler et afficher le tout, je suis presque arrivé au bout de mes peines !
Il ne me reste plus qu'à centrer mes images dans chacun des rectangles arrondis de fond et de mettre en place le preloader, mais là je pense qu'il est prévu par l'ide et je cherche à le mettre en place.
Je ne suis pas l'auteur de tout le code, je m'appuie sur un exemple fourni avec flash.
voici le code tel qu'il est actuellement :
Action Script
import mx.transitions.*;
import flash.geom.*;
_global.thisX = 30;
_global.thisY = 25;
_global.thisXC = 30;
_global.thisYC = 185;
_global.thisXCa = 5;
_global.thisYCa = 0;
_global.stageWidth = 750;
_global.stageHeight = 2880;
//creation du rectangle de fond
function rectArrondi (cible:MovieClip, largeur:Number, hauteur:Number, rayon:Number, offset:Number, epaisseur:Number, couleur1:Number, couleur2:Number, alpha1:Number, alpha2:Number)
{
with (cible) {
lineStyle (epaisseur, couleur1, 100, true);
beginFill (couleur2, alpha2);
moveTo (rayon, 0);
lineTo (largeur - rayon, thisXCa);
//Haut Droite
curveTo (largeur - offset, offset, largeur, rayon);
lineTo (largeur, hauteur - rayon);
//Bas Droite
curveTo (largeur - offset, hauteur - offset, largeur - rayon, hauteur);
lineTo (rayon, hauteur);
//Bas Gauche
curveTo (offset, hauteur - offset, 0, hauteur - rayon);
lineTo (0, rayon);
//Haut Gauche
curveTo (offset, offset, rayon, 0);
endFill ();
}
}
//dupliquer le rectangle en les plaçant sur 2 colonnes
function duplicate(nbrimages) {
MC = new Array();
for (var i = 1; i <nbrimages; i++) {
duplicateMovieClip("miniatures","miniatures"+i,1000+i);
MC[i] = this["miniatures"+i];
MC[i]._x = _global.thisXCa;
MC[i]._y = _global.thisYCa;
if ((i+1)%2 == 0){
_global.thisXCa = 5;
_global.thisYCa += 221;
}
else
{
_global.thisXCa += 420;
}
}
};
// Create and configure the XML instance which is used to load the list of gallery images on the fly.
var gallery_xml:XML = new XML();
gallery_xml.ignoreWhite = true;
gallery_xml.onLoad = function(success:Boolean) {
try {
/* if you are able to successfully load and parse the gallery from a remote XML file,
parse out the image names and add them to an array. */
if (success) {
var images:Array = this.firstChild.childNodes[0].childNodes;
//trace(images);
var comment:Array = this.firstChild.childNodes[1].childNodes;
//trace (comment);
var nbcomment= comment.length;
//trace ("nbr comment " + nbcomment);
var flechehaut= this.firstChild.childNodes[2].childNodes;
//trace (flechehaut);
var gallery_txt:Array = new Array();
var gallery_array:Array = new Array();
for (var i = 0; i<images.length; i++) {
gallery_array.push({src:images[i].firstChild.nodeValue});
gallery_txt.push(comment[i].firstChild.nodeValue);
}
displayGallery(gallery_array,gallery_txt);
} else {
throw new Error("Unable to parse XML");
}
} catch (e_err:Error) {
trace(e_err.message);
} finally {
delete this;
}
};
//chargement du fichier XML
gallery_xml.load("retro2.xml");
//creation des movie clip qui vont recevoir photo et texte descriptif
function displayGallery(gallery_array:Array,gallery_txt:Array) {
var galleryLength:Number = gallery_array.length;
var miniaturesMC:MovieClip = this.createEmptyMovieClip("miniatures",1000);
rectArrondi(miniatures,320,220,20,2,1,0x000000,0xFFCD98B,100,100);
miniatures._x = _global.thisXCa;
miniatures._y = _global.thisYCa;
_global.thisXCa += 420;
duplicate(galleryLength);
var thisMC:Array = new Array()
for (var i = 0; i<galleryLength; i++) {
thisMC[i] = this.createEmptyMovieClip("rectan"+i,(2000+i));
//texte descriptif de chaque photo
var my_fmt:TextFormat = new TextFormat();
my_fmt.bold = true;
my_fmt.font = "Vernada";
my_fmt.size = 12;
my_fmt.color = 0x6709F7;
my._fmt.border = true;
var decrip = this.createTextField("decrip",(3000+i),10,20,250,35);
decrip.setNewTextFormat(my_fmt);
decrip.wordWrap = true;
decrip.multiline = true;
decrip.backgroundColor = 0xFFCD98B;
decrip.background = true;
//chargement des textes
decrip.text=(gallery_txt[i]);
//chargement des images
mcLoader_mcl.loadClip(gallery_array[i].src,thisMC[i]);
preloaderMC = this.attachMovie("preloader_mc", "preloader"+i+"_mc", 5000+i);
// and set a default value in the progress bars text field.
preloaderMC.bar_mc._xscale = 0;
preloaderMC.progress_txt.text = "0%";
// position des clips
thisMC[i]._x = _global.thisX;
thisMC[i]._y = _global.thisY;
decrip._x = _global.thisXC;
decrip._y = _global.thisYC;
// set the position of the image preloader.
preloaderMC._x = _global.thisX;
preloaderMC._y = _global.thisY+20;
// nouvelles positions pour avoir 2 colonnes
if ((i+1)%2 == 0) {
_global.thisX = 30;
_global.thisY += 221;
_global.thisXC = 25;
_global.thisYC +=220.5;
} else {
_global.thisX += 420;
_global.thisXC += 420;
}
}
}
// définir le moviecliploader
var mcLoader_mcl:MovieClipLoader = new MovieClipLoader();
var mclListener:Object = new Object();
mclListener.onLoadStart = function() {
};
// while the content is preloading, modify the width of the progress bar.
mclListener.onLoadProgress = function(target_mc, loadedBytes, totalBytes) {
var pctLoaded:Number = Math.round(loadedBytes/totalBytes*100);
// create a shortcut for the path to the preloader movie clip.
var preloaderMC = target_mc._parent["preloader"+target_mc.getDepth()+"_mc"];
preloaderMC.bar_mc._xscale = pctLoaded;
preloaderMC.progress_txt.text = pctLoaded+"%";
};
mclListener.onLoadComplete = function(evt:MovieClip):Void { };
// when the onLoadInit event is thrown, you're free to position the instances
mclListener.onLoadInit = function(evt:MovieClip) {
evt._parent["preloader"+evt.getDepth()+"_mc"].removeMovieClip();
/* set local variables for the target movie clip's width and height,
and the desired settings for the image stroke and border. */
var thisWidth:Number = evt._width;
var thisHeight:Number = evt._height;
var borderWidth:Number = 4;
var marginWidth:Number = 12;
evt.scale = 38;
// draw a white rectangle with a black stroke around the images.
evt.lineStyle(borderWidth, 0x000000, 100);
evt.beginFill(0x9C9CF3, 100);
evt.moveTo(-borderWidth-marginWidth, -borderWidth-marginWidth);
evt.lineTo(thisWidth+borderWidth+marginWidth, -borderWidth-marginWidth);
evt.lineTo(thisWidth+borderWidth+marginWidth, thisHeight+borderWidth+marginWidth);
evt.lineTo(-borderWidth-marginWidth, thisHeight+borderWidth+marginWidth);
evt.lineTo(-borderWidth-marginWidth, -borderWidth-marginWidth);
evt.endFill();
/* scale the target movie clip so it appears as a thumbnail.
This allows users to quickly view a full image without downloading it every time,
but unfortunaltey also causes a large initial download. */
evt._xscale = evt.scale;
evt._yscale = evt.scale;
// rotate the current image (and borders) anywyhere from -5 degrees to +5 degrees.
//evt._rotation = Math.round(Math.random()*-10)+5;
/* when the target_mc movie clip instance is pressed, begin to drag the current movie clip
and set some temporary variables so once you are finished rescaling and positioning
the full image, you can return the instance to its original position. */
evt.onPress = function() {
// start dragging the current clip.
this.startDrag();
/* set the _xscale and _yscale properties back to 100% so the image appears full sized.
You're also storing the original X and Y coordinates so you can return the image where you found it. */
this._xscale = 100;
this._yscale = 100;
this.origX = this._x;
this.origY = this._y;
// find the depth of the current movie clip, and store it within the movie clip.
this.origDepth = this.getDepth();
/* :TRICKY: swap the depth of the current movie clip, with the next highest movie clip of the _parent.
Effectively this makes the current movie clip the top of the "stack". */
this.swapDepths(this._parent.getNextHighestDepth()+1);
// try and center the current movie clip on the Stage.
this._x = (_global.stageWidth-evt._width+30)/2;
//this._y = (_global.stageHeight-evt._height+30)/2;
// apply a transition to the movie clip which makes the movie clip flicker for a split second.
mx.transitions.TransitionManager.start(this, {type:mx.transitions.Photo, direction:0, duration:1, easing:mx.transitions.easing.Strong.easeOut, param1:empty, param2:empty});
};
/* when the movie clip instance is released, stop dragging the movie clip.
Reset the _xscale and _yscale properties as well as the _x and _y coordinates. */
evt.onRelease = function() {
this.stopDrag();
this._xscale = this.scale;
this._yscale = this.scale;
this._x = this.origX;
this._y = this.origY;
};
// if the mouse cursor was released outside of the movie clip, call the onRelease handler.
evt.onReleaseOutside = evt.onRelease;
};
mclListener.onLoadError = function(evt:MovieClip, code:String):Void { trace("erreur"); }
mcLoader_mcl.addListener(mclListener);
Toute la partie onloadprogress et onloadinit n'est pas de moi !
Je joins le fichier fla et le fichier xml pour plus de facilité de lecture pour des aides éventuelles !
Merci !