Dag iedereen,
Ik ben deze week gestart met een flash Image Gallery om mijn beperkte flashkennis terug wat bij te schaven. Ik maak gebruik van een XML file om afbeeldingen te laden.
Een voorbeeldje vind je op:
http://www.worldkarts.com/imageGallery/imagegallery.html
Bedoeling is om bij het klikken op een thumbnail de juiste afbeelding te tonen. Wanneer een andere thumbnail wordt aangeklikt, moet de vorige afbeelding 'ontladen' en terug de juiste afbeelding worden getoond.
Ik heb dit als volgt aangepakt:
De functie ShowPicture wordt aangesproken bij het klikken op een thumbnail. Parameters zijn het Id van de thumbnail (eerste thumb = 0, tweede thumb = 2, enz...), het album en path naar de afbeelding.
De ShowPicture functie ziet er als volgt uit:
Een voorbeeldje vind je op:
http://www.worldkarts.com/imageGallery/imagegallery.html
Je kan via de kleine ingebouwde debugger (rechts) zien dat de juiste picture MC wordt geladen en de vorige picture MC wordt ontladen via tween en dan een remove.
Maar! Wanneer je nu snel klikt op de verschillende thumbnails merk je dat blijkbaar enkel de laatste vorige picture MC wordt ontladen ipv alle vorige.
Vb in 1 snelle beweging:
klik 1ste thumb, klik 2de thumb, klik 3de thumb, klik 4de thumb.
Nu zou de 1ste, 2de & 3de thumb moeten ontladen, maar het is enkel de 3de thumb die wordt onladen.
Om dit te omzeilen dacht ik om hetvolgende te doen in m'n code:
dit om voor elke vorige picture MC een eigen Tween variable te hebben, maar dit helpt blijkbaar niet.
Voor mij wordt het allemaal nogal ingewikkeld. Ik heb mij al doodgezocht en m'n hersens gepijnigd maar hoop via het forum een kleine beetje verduidelijking of hulp te krijgen!
Bedankt alvast
grtjes
Woutje
Ik ben deze week gestart met een flash Image Gallery om mijn beperkte flashkennis terug wat bij te schaven. Ik maak gebruik van een XML file om afbeeldingen te laden.
Een voorbeeldje vind je op:
http://www.worldkarts.com/imageGallery/imagegallery.html
Bedoeling is om bij het klikken op een thumbnail de juiste afbeelding te tonen. Wanneer een andere thumbnail wordt aangeklikt, moet de vorige afbeelding 'ontladen' en terug de juiste afbeelding worden getoond.
Ik heb dit als volgt aangepakt:
code:
1
2
3
| tumb_mc.onPress = function() {
showPicture(this.id, this.album, this.path);
}; |
De functie ShowPicture wordt aangesproken bij het klikken op een thumbnail. Parameters zijn het Id van de thumbnail (eerste thumb = 0, tweede thumb = 2, enz...), het album en path naar de afbeelding.
De ShowPicture functie ziet er als volgt uit:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
| var oldPicId:Number;
var activePicId:Number;
var counter = 0;
function showPicture(picId, picAlbum, picPath) {
_root.txtOldPicId.text = "oldPicId: " + oldPicId;
_root.txtPicId.text = "picId: " + picId;
if(oldPicId != picId) {
activePicId = picId;
//de huidige thumbnail terug activeren
scroller["tumb"+activePicId].gotoAndPlay("active");
//de vorige thumbnail terug deactiveren
scroller["tumb"+oldPicId].gotoAndPlay("out");
oldPic = this["pic"+oldPicId];
//de vorige foto geleidelijk onzichtbaar maken (_alpha tween)
this["picTween"+oldPicId] = new mx.transitions.Tween(oldPic, "_alpha", mx.transitions.easing.Strong.easeOut, 100, 0, 1, true);
this["picTween"+oldPicId].onMotionFinished = function() {
oldPic.removeMovieClip();
};
oldPicId = activePicId;
this.createEmptyMovieClip("pic"+activePicId, getNextHighestDepth());
p = this["pic"+activePicId];
p._x = 36;
p._y = 66;
p.attachMovie("picture", "picture", getNextHighestDepth());
p.picture.picholder.loadMovie("albums/" + picAlbum + "/" + picPath + ".jpg");
p.picture.loaded = false;
p.picture.txtDebug.text = picId;
/**** Pic preloader ****/
p.picture.preloader._visible = false;
p.picture.onEnterFrame = function() {
loaded = this.picholder.getBytesLoaded();
total = this.picholder.getBytesTotal();
percent = (!isNaN(loaded/total)) ? Math.ceil((loaded*100)/total) : 0 ;
if (loaded != total) {
this.preloader._visible = true;
this.preloader.loadBar._xscale = percent*200;
} else {
this.preloader._visible = false;
this.gotoAndPlay("show");
delete this.onEnterFrame;
};
};
/***********************/
} else {
trace("foto reeds zichtbaar");
};
}; |
Een voorbeeldje vind je op:
http://www.worldkarts.com/imageGallery/imagegallery.html
Je kan via de kleine ingebouwde debugger (rechts) zien dat de juiste picture MC wordt geladen en de vorige picture MC wordt ontladen via tween en dan een remove.
Maar! Wanneer je nu snel klikt op de verschillende thumbnails merk je dat blijkbaar enkel de laatste vorige picture MC wordt ontladen ipv alle vorige.
Vb in 1 snelle beweging:
klik 1ste thumb, klik 2de thumb, klik 3de thumb, klik 4de thumb.
Nu zou de 1ste, 2de & 3de thumb moeten ontladen, maar het is enkel de 3de thumb die wordt onladen.
Om dit te omzeilen dacht ik om hetvolgende te doen in m'n code:
code:
1
| this["picTween"+oldPicId] = new mx.transitions.Tween ... |
dit om voor elke vorige picture MC een eigen Tween variable te hebben, maar dit helpt blijkbaar niet.
Voor mij wordt het allemaal nogal ingewikkeld. Ik heb mij al doodgezocht en m'n hersens gepijnigd maar hoop via het forum een kleine beetje verduidelijking of hulp te krijgen!
Bedankt alvast
grtjes
Woutje