DIAPORAMA FLASH DYNAMIQUE + XML AVEC MINIATURES(VIGNETTES) ET CHARGEMENT

Commentaire de ousuisje le 02/03/2007 18:40:36

HELP
Je fais un book pour une copine artiste avec Flash MX. Je connais un peu l'action script, le java script + html pour faire des popup! Elle voudrait une galerie sympa, avec planche contact de miniatures que l'on peut agrandir et lire les commentaires.
Ce book sera sur CD, donc pas de php and co, sans doute dans un seul swf à lancer. Je suis un peu perdue dans ces codes ! please auriez-vous un code, une solution pour générer une galerie simplement ?
Full merci
Sofi

Commentaire de baillezon le 02/03/2007 18:53:42

Bonjour !
Pour ajouter des images, c'est très simple.
Pour deux images, tu as un fichier xml qui ressemble à ça :

<gallerie>
  <desc big="grandes/1.jpg" small="vignettes/1.jpg" />
  <desc big="grandes/2.gif" small="vignettes/2.gif" />
</gallerie>

Si tu veux rajouter une 3ème photo, tu place la miniature dans le dossier "vignettes", et la photo originale dans le dossier "grandes". Puis tu rajoute la ligne suivante à ton fichier :

<desc big="grandes/3.jpg" small="vignettes/3.jpg" />

Ce qui, au final, te donne :

<gallerie>
  <desc big="grandes/1.jpg" small="vignettes/1.jpg" />
  <desc big="grandes/2.gif" small="vignettes/2.gif" />
  <desc big="grandes/3.jpg" small="vignettes/3.jpg" />
</gallerie>

Et c'est tout :)
En esperant avoir pu t'aider ;)

Commentaire de ousuisje le 03/03/2007 11:27:38

merci! c'est très simple! bravo
en ce qui concerne les options,  peut-on rajouter des commentaires? as-tu réfléchi aux améliorations que tu peux ajouter?

Commentaire de ousuisje le 03/03/2007 14:08:18

justement, j'ai pas pu ouvrir le galerie.fla, est-ce normal?
ça m'arrange, plutôt que faire n'importe quoi! quoique prête à regarder de plus près ton code, si action script, ça ira...
peut-être me l'envoyer par email

Commentaire de ousuisje le 03/03/2007 14:21:01

ah non
Flash MX me dit "format inattendu" pour ouvrir le diaporama_baillazon.fla

Commentaire de ousuisje le 03/03/2007 14:34:41

ça marche pas, l'anim est vide d'images

est-ce que ce code remplace ton premier code? dois-je garder le dossier content? et que faire du anim.swf?
comprends plus rien

merci de m'éclairer

Commentaire de marsupulamis le 09/03/2007 16:07:45

Super source ! Est-ce possible d'ajouter quelques lignes de code pour que les minatures apparaissent entièrement ?

a+

Commentaire de nlex le 09/03/2007 18:21:27

euh oublie mon message, voila ce que je veux dire:

- je ne comprends pas, j'ouvre le fichier FLA (flash 8) et je ne vois rien sur la scene pourtant si je fais un rendu ça fonctionne, tu peux nous expliquer ?

- peut on changer le fadin et remplacer par une anim du type left-right ?

- peut on integrer ce genre de fichier SWF sur un blog type wordpress ?

Commentaire de baillezon le 10/03/2007 13:47:30

Pardon, j'ai pas finis le 2eme point :)

- Oui, on peut changer le fadin pour remplacer par une anim du type left-right. ( Il faut modifier le clip "fat" de la bibliothèque (les premières images gérant actuellement un affichage progressif de l'image avec un _alpha de plus en plus proche de 100, on peut immaginer la meme chose avec un _x de plus en plus proche de la position centrée)

Commentaire de MeCcA le 10/03/2007 19:37:52

hello, à nouveau.
En fait j'ai une autre question :s.
J'ai rajouté une légende pour chaque vignette.
En rajoutant dans le XML un parametre "com" pour chaque image chargée (ex : com="legende1"), et en créant2 variables dans le fla :
var legende=galleriexml.firstChild.childNodes[i].attributes.com;//legende du fichier
btn.legende=legende; ), je suis arrivé à récuperer la dite légende et à l'afficher dans le swf.
La ou je coince, c'set au niveau de la mise en forme. J'aimerai ajouter du gras et un retour à la ligne. Pour ce faire, j'ai essayé de rejouter des balises html (ex : com="<b>legende1</b><br>sous l&eacute;gende"; mais ces dernières ne sont pas prise en compte. J'aimerai donc savoir si vous aviez une idée de comment faire, ou au moins une piste pour m'aiguiller ?

Merci à nouveau

Commentaire de lenerk64 le 12/03/2007 10:37:32

oui, c'est bon, mais j'aimerais juste que tu va sur ces site www.minus.dk et de me dire si; ils ont utilise le xml pour faire cette  diaporama et cmt ils ont fait de que vous faite un clique sur le photo il s'agrandit...
Merci de votre comprehension

Commentaire de baillezon le 12/03/2007 13:00:29

Voila, je viens de mettre en ligne la mise à jour.
Maintenant :
- Possibilité de mettre un commentaire par photo (desactivable dans le code)
- (+MAJ de la partie "redimmensionnement")

Commentaire de carled le 16/03/2007 13:56:52

Salut,
Et felicitation pour ton travail
Question :
Comment ajuter les commentaires sur 5 lignes ?
Merci de ta réponse
a+
carled

Commentaire de baillezon le 17/03/2007 10:15:37

Rajoute la ligne suivante :

charger(mon_image0.big);//on charge la première image

A la fin du code de l'image clé 4 ;)

Commentaire de ceddeg le 23/03/2007 13:43:49

Bonjour à tous,

J'essaye d'intégrer dans mon fichier fla cette source, mais je n'arrive pas a masquer les vignettes une fois qu'elles ont été chargées...
Une idée???

Commentaire de baillezon le 30/03/2007 12:08:12

Personnelement, chez moi, ça marche sans problèmes.
- As tu bien recupéré la dernière version ?
- As tu bien mis le code : charger(mon_image0.big);//on charge la première image
- Et l'a tu bien mis à la fin du code de l'image clé 4 (Il y a 25 lignes de code avant)

Verifie tout ça et ça devrait fonctionner ;)

Commentaire de starrr le 05/04/2007 11:06:09

Bonjour baillezon, tout dabor je tiens à te féliciter pour ce joli code !
le script fonctionne vraiment bien, et c'est très classe.

j'aimerais ajouter des sous dossier dans le xml du style :
<gallerie>
  <sousdossier>
     <desc big="grandes/1.jpg" small="vignettes/1.jpg" />
     <desc big="grandes/2.gif" small="vignettes/2.gif" />
     <desc big="grandes/3.jpg" small="vignettes/3.jpg" />
  </sousdossier>
  <sousdossier>
              <desc etc.... />
  </sousdossier>
</gallerie>
afin que quand on clic sur un dossier ce soit une galerie qui s'affiche, et si on clic sur un autre une autre... etc..
mais je ne sais pas trop comment faire au niveau du fla, aurais tu une solution?
merci d'avance à toi et encore félicitation pour ce code

Commentaire de ossona le 10/04/2007 16:15:35

Salut,

Merveilleux slideshow !!!!!!!!!!!!!!!!

tres complet mais je me demandai si il serai possible de faire un defilement automatique des vignettes et non pas a l aide de la souris qui va de droite a gauche (dans le meme esprit que la rubrique "A la Une" sur http://www.tf1.fr) ???? et si oui est ce qu íl y aurai une ame charitable pour me mettre sur la voie je galere depuis quelques temps dessus

merci

Commentaire de cups le 11/04/2007 10:35:09

salut,

merci pour ce petit code qui marche à merveille.... juste une petite question ???

Comment fais tu pour donner une position à la grande image ?

Commentaire de le pro masterchief le 10/05/2007 02:28:55

Hum ton diaporama flash souffre d'un problème vraiment bête. Aucun accent ne peut être mis dans les commentaire sinon ça foire! Je te conseille d'y voir. À part c'est pas mal.

Commentaire de baillezon le 11/05/2007 16:49:41

Bonjour à tous,
Nouvelle version en ligne, n'hésitez pas à tester !!

Pour les réponses :

@thyriel : Le problème du diaporama qui fonctionne une fois sur 2 en ligne doit etre reglé, j'ai preloadé l'animation et le fichier XML avant de poursuivre le chargement des vignettes ;)

@le pro masterchief : Ca fonctionne chez moi, il faut penser à enregistrer son fichier XML au format UNICODE (via bloc note)

@mkore : il y aurait pas mal de modifications à faire pour repeter la serie d'image à l'infini car chaque vignette est chargée, cela fait un "bandeau" d'images  dont seulement une partie est affichée. Si tu repete les vignettes à l'infini, tu vas avoir un probleme de ressources... Il faudrait modifier le code pour que l'animation ne charge uniquement les vignettes qui s'affichent à l'écran..

Commentaire de le pro masterchief le 14/05/2007 02:05:55

Merci!

Commentaire de thyriel le 17/05/2007 20:36:28

j'ai un autre souci avec le diaporama, décidement ...
quand je le test en ligne il reste bloqué sur "chargement..."
Je l'appel via un loadmovie dans un clip vide qui ne contient que lui,
y'a qlq chose qui bloc mais je ne vois pas quoi,
je n'avais pas se probleme avec l'ancien du coup je sais pas trop
si ca vient de moi ou du diapo.

Commentaire de pkb35 le 20/05/2007 19:22:45

Salut BAILLEZON.
Tu aurais pu te passer de mettre un copyright sur ta source car tu as toi meme recopié (puis modifié) une autre source sans le préciser.
http://www.flashkod.com/codes/DIAPORAMA-AVEC-SLIDER-MINIATURES-CHARGEES-DEPUIS-XML_36055.aspx

Commentaire de thyriel le 21/05/2007 12:17:23

hello, j'ai cherché dans le code un _root.getBytesLoaded mais je n'ai rien trouvé.
j'ai trouvé un seul root qui est dans un _root.position
J'ai pas trop eu le temps de regarder ces derniers jours mais des que je peux je cherche pour voir.

Commentaire de macintroll le 29/05/2007 06:07:23

Hello et tout d'abord bravo pour cette source qui fonctionne très bien. me reste évidement quelques questions !
1) Je cherche a limiter la zone de reaction du bandeau d'images (uniquement quand la souris est au dessus et plus  sur toute la page comme c'est le cas actuellement. un masque de séléction en quelque sorte. je pense que tout se passe par la au niveau de la gestion de la position de la souris:

//Avance ou recule
function avrec(){
    _root.position=-(this._xmouse-(490/2));
    return _root.position/8;
}

mais je ne vois pas trop comment faire...

2) Lors du chargement d'une image au tout debut  quelle modif faut il faire pour afficher également le commentaire ?

Enfin je tiens a signaler que cette source fonctionne tres bien pour faire une galerie de Videos FLV ;)

Commentaire de oriann666 le 09/06/2007 00:47:12

Voila l'exemple type d un excellent tuto, avec des commentaires très simples et facile à suivre.

Merci bcp ;)

Commentaire de baillezon le 13/06/2007 13:46:27

Oui :)
Dans la fonction avrec, il suffit de diminuer la valeur renvoyée :

[...]
else{
this.position=-(this._xmouse-(490/2));
return this.position/16; //<-- On divise par 16 et non plus par 8 (par exemple)
}

Commentaire de mkore le 14/06/2007 13:18:23

BAILLEZON, as tu remis la version MX à jour ?
Je n'arrive pas a trouver ce fameux "var chargefirstauto" ... pour afficher le commentaire au démmarage.

Commentaire de baillezon le 26/06/2007 13:06:45

Bonjour,
Le diaporama n'est pas séparé en 2 sources.
J'ai simplement enregistré le diaporama en 2 versions :

- Une pour Flash Professionnel
- Une pour Flash MX 2004

Voila ;)

Commentaire de tonib le 25/07/2007 13:11:39

RE :

Bon Finalement tout fonctionne, il s'agissait juste de déposer les images dans un dossier "content" bizarrement inexistant ds le .zip à télécharger.

Nico

++

Commentaire de macsud le 07/09/2007 11:31:50

bonjour,

J'ai moi aussi une question. j'ai agrandi l'anim en 500/600 donc j'ai baissé la position des vignettes ainsi que la barre des commentaires mais je n'arrive pas à régler l'endroit pour que la sourie fasse defiler les vignettes quand on les survollent. car maintenant la zone est resté comme à l'origine et donc elle se trouve au dessus des vignettes.

merci pour votre aide

Commentaire de jeep501 le 01/11/2007 11:24:48

Bonjour,
Titop en effet cette source ! exactement ce que je cherchais - j'ai un dernier probleme à régler qui a été pausé mais sans réponse :
"FAIRE UN MASQUE POUR DeLIMITER LES MINIATURES" (je load cette source sur un clip transparent existant et donc les miniatures dépassent)...

Merci d'avance !

Commentaire de audreycormont le 21/11/2007 23:54:55

bonjour,

superbe diaporama !

je ne trouve pas la partie avrec().
Peut ton m'aider ?

merci, merci, merci.

Commentaire de laul33 le 19/12/2007 16:42:52

@audreycormont
Je suis dans le meme cas que toi, impossible de voir ou modifier la zone de glassade. De plus j'ai des petits problemes ; losque que je vais toute à droite et que je re glisse toute a gauche la derniere vignette de gauche est comme bloquer. :/

Super taff !

Commentaire de lilibloom le 02/02/2008 11:37:55

merci pour ce code très efficace, j 'aimerais savoir comment faire pour que les vignettes miniatures s"éclairent" au survol de la souris. Est-ce possible?