attachBitmap : comment supprimer l'image loadée pour éviter la superposition aveRésolu

Question

Bonsoir à toutes et à tous,

je suis en train d'adapter un diaporama en as2 que j'ai trouvé sur le net.
Ce diaporama n'était pas configuré pour lisser les images loadées via un oadMovie(), par conséquent j'ai modifié ce diaporama en changeant le loadMovie() par un attachBitmap() afin de pouvoir donc lisser les images loadées. La méthode fonctionne bien, seul bémol survenant : les images loadées se superposent les unes sur les autres au fur et à mesure du loading, alors que lorsque les images étaient chargées en loadMovie(), chaque image loadée remplaçait la précédente dans le clip conteneur, ce qui n'est malheureusement plus le cas dorénavant.
Je cherche donc la solution qui permettrait d'écraser l'image loadée afin de conserver les paramètres du redimensionnement de chaque image, car évidemment le fait que les images se superposent fout totalement en l'air le code pour redimensionnser l'image loadée :(...

Bref, si vous avez des suggestions n'hésitez pas car pour l'instant je rame.

Voici la partie de mon code où je loade l'image :
function loadFull(imgToLoad, desc){	
import flash.display.*;

var holder:MovieClip = transBG_mc.picBG_mc.empty_mc;
holder._alpha = 0;

function loadBitmapSmoothed(url:String, cible:MovieClip) { 
var bmc:MovieClip = cible.createEmptyMovieClip("bmc", cible.getNextHighestDepth()); 

var listener:Object = new Object(); 

listener.tmc = cible; 

listener.onLoadInit = function(mc:MovieClip) { 
mc._visible = false; 

var bitmap:BitmapData = new BitmapData(mc._width, mc._height, true); 

this.tmc.attachBitmap(bitmap, this.tmc.getNextHighestDepth(),"auto",true); 
bitmap.draw(mc); 
}; 

var loader:MovieClipLoader = new MovieClipLoader(); 
loader.addListener(listener); 
loader.loadClip(url, bmc); 
}

loadBitmapSmoothed(imageDir+imgToLoad, holder);

var temp = holder._parent.createEmptyMovieClip("temp", holder._parent.getNextHighestDepth());

temp.onEnterFrame = function() {
var loaded = holder.getBytesLoaded();
var total = holder.getBytesTotal();
var perc = Math.round((loaded/total)*100);

//trace(perc);

if(perc == 100) {
// hide the preloader
transBG_mc.preloader_mc.alphaTo(0, 1, "linear", 0, function() { transBG_mc.preloader_mc.removeMovieClip(); });
//trace(holder._width);
checkImageWidth(holder, desc);

delete this.onEnterFrame;
temp.removeMovieClip();
}
}
}

Merci :)

BBFUNK01

Orange73 · Accepted Answer

Hello,

Declare Var Bitmap en dehors de ta fonction et ensuite tu mettra ceci dans ta fonction :

bitmap.dispose();
bitmap = new BitmapData(mc._width, mc._height, true); 



-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

Orange73 · Answer

Hello BBFUNK01,

Orange73 à la rescousse ;-)

Essaie de déclarer var bitmap:BitmapData; en dehors de ta fonction.


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

BBFUNK01 · Answer

Salut Orange73,

une fois de plus tu viens à mon secours tel un mousquetaire :)

J'essaie de suite de modifier mon code en suivant tes conseils, si tu as un peu de temps à tuer, je t'invite à aller voir la structure de mon site qui est presque terminée (enfin... :) ) et je compte sur toi pour me donner tes impressions et me faire des critiques constructives :), pour ma part je trouve qu'il n'est pas parfait mais bon... arriver à la perfection je pense que ce n'est malheureusement pas dans mes cordes. Bref, la structure est en place mais il manque le contenu donc tu ne pourrras pas lire les musiques sachant qu'elles ne sont pas encore en ligne, mais si tu peux malgré tout me dire ce que tu en penses sur le global ce serait sympa (d'autant plus que je te dois la résolution de bons nombres des problèmes que j'ai rencontrés :) )

Merci :)

BBFUNK01

BBFUNK01 · Answer

re,

si je te donnes le lien pour aller voir mon site ce sera plus aisé tout de même :)

musichrono

BBFUNK01

Orange73 · Answer

Sympa ;-)

2 choses :

- Lorsqu'on rentre dans une categorie, on ne sait pas ou cliqué pour revenir au menu... du moins le bouton y est mais pas assez clair.

- Moi j'aurai fusionné ton logo et le menu carrousel ;-) genre le logo au milieu est le carrousel qui tourne autour du logo.

A+ :p 


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

BBFUNK01 · Answer

Re,

ouais c'est une idée qui peut être pas mal, de plus ça comblerait un peu le vide qu'il y a du coup en dessous du logo et du carroussel :)
Et question subsidiaire : chez toi les logos du carroussel apparaissent pixellisés ou lissés ? Pace que j'ai testé mon site sur les nouveaux i-mac qui ont des écrans d'environ 1900x1500 pixels, et... ça pixellise vachement.
Enfin bon, sinon j'ai testé pour mon histoire d'attachBitmap en déclarant var Bitmap en dehors de la fonction mais du coup ça ne me loade plus l'image escomptée dans le clip, mais ce qui est bizarre c'est que le clip se redimensionne au format de chaque image lorsque le mode diaporama est activé. Je continue donc à creuser, merci en tout cas :)

BBFUNK01

Orange73 · Answer

Les logos pour moi c'est bon...
Pour les grand écrans c'est clair que tes logos vont perdre en qualité car tu redimensionne tes clip par rapport a la taille du navigateur. Seul chose qu'il faut faire c'est mettre la propriété smoothing à true sur tes images.

En ehors deta fonction tu fais 
var bitmap:BitmapData;

et dans ta fonction tu fais 
bitmap = new BitmapData(mc._width, mc._height, true); 

a moins que tu cherche a loader plusieurs image en meme temps...


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

BBFUNK01 · Answer

Hum, effectivement j'avais déplacé la ligne complète hors de la fonction :)

Je teste en ne mettant que var bitmap:BitmapData en dehos de la fonction et je te dis de suite.

BBFUNK01

BBFUNK01 · Answer

Bon et bien ça me donne la même chose que si je le déclare dans la fonction ; ça loade les images les unes sur les autres. J'ai cherché sur le net s'il était possible d'effacer l'image loadée lorsque une nouvelle image est chargée mais je n'ai rien trouvé pour la classe BitmapData. Ma foi, j'ai déjà comme piste que suivant où je déclare var "bitmap:BitmapData", soit cela redimensionne le clip aux formats des images mais sans loader les images, soit cela ne redimensionne pas le clip aux formats des images bien que les images soient loadées :). Mais comme le dit l'adage : "tout vient à qui sait attendre", donc en cherchant bien je trouverai :)

BBFUNK01

Orange73 · Answer

Et avec bitmap.dispose(); ?


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

BBFUNK01 · Answer

bitmap.dispose() ?

alors attend, je me renseigne afin de savoir comment ça marche :)

BBFUNK01

BBFUNK01 · Answer

Bon ben d'après ce que je comprends "bitmap.dispose()" sert en fait à effacer un bitmap. Reste à trouver où et comment je dois l'insérer dans mon code pour que ça marche, j'ai fait quelques essais en le mettant comme ceci par exemple mais sans résultat :
function loadFull(imgToLoad, desc){

var tofcharge = imageDir+imgToLoad;

var holder:MovieClip = transBG_mc.picBG_mc.empty_mc;
holder._alpha = 0;

function loadBitmapSmoothed(url:String, cible:MovieClip) { 
var bmc:MovieClip = cible.createEmptyMovieClip("bmc", cible.getNextHighestDepth()); 

var listener:Object = new Object(); 

listener.tmc = cible; 

listener.onLoadInit = function(mc:MovieClip) { 
mc._visible = false;
bitmap.dispose(); 

var bitmap:BitmapData = new BitmapData(mc._width, mc._height, true); 

this.tmc.attachBitmap(bitmap, this.tmc.getNextHighestDepth(),"auto",true); 
bitmap.draw(mc); 
};

var loader:MovieClipLoader = new MovieClipLoader(); 
loader.addListener(listener); 
loader.loadClip(url, bmc); 
}

loadBitmapSmoothed(tofcharge, holder);

var temp = holder._parent.createEmptyMovieClip("temp", holder._parent.getNextHighestDepth());

temp.onEnterFrame = function() {
var loaded = holder.getBytesLoaded();
var total = holder.getBytesTotal();
var perc = Math.round((loaded/total)*100);

//trace(perc);

if(perc == 100) {
// hide the preloader
transBG_mc.preloader_mc.alphaTo(0, 1, "linear", 0, function() { transBG_mc.preloader_mc.removeMovieClip(); });
//trace(holder._width);
checkImageWidth(holder, desc);

delete this.onEnterFrame;
temp.removeMovieClip();
}
}
}

BBFUNK01

BBFUNK01 · Answer

Hello Orange73,

je suis au boulot là donc je ne vais pas pouvoir tester le code avant 18h, j'essaie tout à l'heure et te tiens au courant du résultat.

Merci et bonne journée :)

BBFUNK01

BBFUNK01 · Answer

Re orange73,

bon et bien t'avais vu juste, en déclarant var bitmap:BitmapData; en-dehors de la fonction et en mettant ensuite bitmap.dispose();
bitmap = new BitmapData(mc._width, mc._height, true); et bien ça fonctionne, les images ne sont plus loadées les unes sur les autres. Bon ceci dit ça me génère un autre problème qui devrait je pense être réglé rapidement : le redimensionnement ne se fait plus lorsqu'on passe d'une "grande" image à une plus "petite" image, il doit falloir refaire les chemins pour assigner le bon objet à la gestion du format.
Enfin bon c'est cool car les images affichées sont lissées :)

Une fois de plus un grand merci à toi :)

A plus,

BBFUNK01

BBFUNK01 · Answer

Hello orange73,

bon ben je crois que je me suis avancé un peu vite quand je disais que régler ce problème de redimensionnement du Background de l'image serait à priori facile. En fait c'est carrément difficile car depuis hier soir je cherche sans avoir vraiment avancé. Visiblement la gestion de redimensionnement du background  n'est gérée que sur 2 lignes (2 lignes que j'ai vraiment du mal à piger), et la seule modification avec le précédent code c'est le fait donc de charger les images avec un attachBitmap au lieu d'un loadMovie.
Bref, voici les bouts de code si jamais tu repasses par là et que tu as envie de te divertir avec ce nouveau problème signé BBFUNK01 :)

Le code pour le redimensionnement du background :
transBG_mc.picBG_mc.bg_mc.tween(["_width", "_height"], [mcW+imageBorder, mcH+imageBorder], 0.5, undefined, 0, function() {  });
transBG_mc.picBG_mc.bg_mc.alphaTo(100, 0.5, "linear", 0, function() { imageHolder.alphaTo(100, 2); });

La fonction modifiée avec attachBitmap :
var bitmap:BitmapData;

function loadFull(imgToLoad, desc){

var tofcharge = imageDir+imgToLoad;

var holder:MovieClip = transBG_mc.picBG_mc.empty_mc;
holder._alpha = 0;

function loadBitmapSmoothed(url:String, cible:MovieClip) { 
var bmc:MovieClip = cible.createEmptyMovieClip("bmc", cible.getNextHighestDepth()); 

var listener:Object = new Object(); 

listener.tmc = cible;

listener.onLoadInit = function(mc:MovieClip) { 
mc._visible = false;

bitmap.dispose();
bitmap = new BitmapData(mc._width, mc._height, true); 

this.tmc.attachBitmap(bitmap, this.tmc.getNextHighestDepth(),"auto",true); 
bitmap.draw(mc); 
};

var loader:MovieClipLoader = new MovieClipLoader(); 
loader.addListener(listener); 
loader.loadClip(url, bmc);
}

loadBitmapSmoothed(tofcharge, holder);

var temp = holder._parent.createEmptyMovieClip("temp", holder._parent.getNextHighestDepth());

temp.onEnterFrame = function() {
var loaded = holder.getBytesLoaded();
var total = holder.getBytesTotal();
var perc = Math.round((loaded/total)*100);

//trace(perc);

if(perc == 100) {
// hide the preloader
transBG_mc.preloader_mc.alphaTo(0, 1, "linear", 0, function() { transBG_mc.preloader_mc.removeMovieClip(); });
//trace(holder._width);
checkImageWidth(holder, desc);

delete this.onEnterFrame;
temp.removeMovieClip();
}
}
}

et enfin la fonction d'affichage des images en grand (avec les 2 lignes de code du haut) :
function displayFullImage(imageHolder, desc) {


var imageBorder = 20;
var mcW = imageHolder._width;
var mcH = imageHolder._height;


//total of images in chosen category
var totalImages = myGallery[curCat]["image"].length;
curImage_txt.text = Number(_root.curImage+1)+" sur "+totalImages;

enableImageNav(true);

//trace(mcW);

if(mcW > 710) {
imageHolder.maxWidth = 710;
var newSize = imageHolder.resizeToFit();
imageHolder.tween(["_width", "_height"], [newSize.newWidth, newSize.newHeight], 0.5, undefined);
var mcW = newSize.newWidth;
var mcH = newSize.newHeight;
}

var xCenter = (transBG_mc.fake_btn._width/2) - (Number(mcW+imageBorder)/2);
var yCenter = (transBG_mc.fake_btn._height/2) - (Number(mcH+imageBorder)/2);

// center the image
transBG_mc.picBG_mc.slideTo(xCenter, yCenter, 0.5);
// resize the background
transBG_mc.picBG_mc.bg_mc.tween(["_width", "_height"], [mcW+imageBorder, mcH+imageBorder], 0.5, undefined, 0, function() {  });
transBG_mc.picBG_mc.bg_mc.alphaTo(100, 0.5, "linear", 0, function() { imageHolder.alphaTo(100, 2); });

Je n'ai pas mis la fonction dans sa totalité car après ça touchait à l'affichage de la description (textfield).

C'est coton n'est-ce pas ?

Enfin bon, je continue à faire des tests pour trouver la solution, mais si ça t'inspire n'hésite pas :)

A plus,

BBFUNK01

BBFUNK01 · Answer

Arf, j'oubliais le lien qui permet de voir le problème :
background foireux

BBFUNK01

BBFUNK01 · Answer

Une ampoule vient de s'allumer dans mon cerveau :
en regardant à l'instant mon diaporama je constate que les images loadées quels que soient leurs formats sont chargées en haut à gauche du background, ce qui me laisse à penser que si je parviens à centrer l'image chargée dans le clip conteneur ça pourrait peut-être régler le problème.
Je vais essayer en cherchant de ce côté.

BBFUNK01

Orange73 · Answer

Je vois pas dans ton code ou est appeler displayFullImage(); ???

michelseris (skype id) 


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

Orange73 · Answer

Correction : serismichel 


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

BBFUNK01 · Answer

Re, je t'envoie le zip du fla car le code fait 1200 lignes donc c'est un peu longuet. En tout cas je suis en train d'essayer de définir les coordonnées du bitmap loadé et je pense que je brûle, mais je n'ai pas encore trouvé le bon réglage car là ça me déforme les images loadées.

BBFUNK01

AttachBitmap : comment supprimer l'image loadée pour éviter la superposition ave

40 réponses

Votre réponse