[FLEX] image slideshow

[Cryothic]

Hoi allemaal,

ik ben momenteel een site aan het bouwen in Flex, en ik heb daar een soort van image-slideshow blokje in.
Er komt (via XML) een lijst van images binnen, en om de X seconden wisselen die.

Dat heb ik allemaal voor elkaar.

Het probleem is alleen ik er een animatie in wil hebben. Een mooie fade ofzo.
Dat had ik als volgt gedacht.

code:

<mx:Image id="imgObject" showEffect="myFade" hideEffect="myFade" />
<mx:Fade id="myFade" duration="100" />

alleen als ik nu in actionscript iets doe als volgt (weet het niet helemaal precies, want ik zit nu op m'n werk dus heb niet echt toegang tot m'n prive project)

code:

  imgObject.visible = false;
  imgObject.source = images[index];
  imgObject.visible = true;

dan gaan de fades door elkaar heen lopen en zit ik 9 van de 10 keer tegen een leeg blokje aan te kijken.

Ik heb geprobeerd het af te vangen met:

code:

while (myFade.isPlaying){
//do nothing
}

maar het enige wat dat deed is de applicatie laten hangen.

Heeft iemand een mooie oplossing? Of een voorbeeld?
Als ik google op slideshow kom ik niet echt tegen wat ik zoek. En als ik zoek op image-rotator kom ik results tegen waarin ze afbeeldingen gaan draaien

Alvast bedankt.

[Iska]

Ik heb fading gebruikt op mijn site (met name in de gallery): www.jasperkouwenberg.com.. de js+css files kan je denk ik wel uit de source halen

[ Voor 10% gewijzigd door Iska op 29-09-2008 16:44 ]

[tonyisgaaf]

In het algemeen (omdat ik AS niet ken, maar JS wel): je zult de "onfinish" property van de ene fade moeten knopen aan de "start" method van de andere. Misschien zelfs de "fadeout" eerst knopen aan de "onload" van volgende image (dus eerst wachten op het laden van de nieuwe afbeelding, voordat je de oude afbeelding laat verdwijnen). Zo kun je de twee "animators" synchroniseren.

Als ik zo snel zit te kijken moet je wachten met "imgObject.source" tot de Fade.effectEnd() wordt afgevuurd (dispatched). Je moet dus je "source" toewijzing doen d.m.v. een callback, geknoopt aan Fade.effectEnd().
Netter in mijn ogen zou zijn:

• De volgende image preloaden, onload een callback op de fadeOut (dus imgObject.visible = false).
• Op de callback van de fadeout (Fade.effectEnd dus) de source van het imgObject omzetten naar die van de ge-preloade image.
• Fade-in (d.m.v. imgObject.visible = true).

[ Voor 45% gewijzigd door tonyisgaaf op 29-09-2008 17:49 ]

[Tsjilp]

Je moet inderdaad wachten totdat de image geladen is, EN wachten tot dat de fadeout klaar is.