Album photos avec images importées

 

On se propose de créer un diaporama avec des images importées à la volée depuis un répertoire dans l'animation.
Cet exemple utilise des scripts assez complexes. Je suppose connu les fonctions de création sur lesquelles je n'insisterai pas.
D'autre part, je ne répondrai à aucun mail concernant cet exemple. A vous de faire l'effort, je pense avoir suffisamment détaillé les explications.
Si vous n'avez aucune connaissance en programmation, bon courage.

⇒ animation ⇐

Attention :
Cet exemple utilise un script PHP éxécutable coté serveur.
Alors, pour tester votre création, il vous faut :
- soit un serveur Apache sur votre ordinateur (avec les modules PHP installés )
- soit mettre les fichiers sur votre site, à condition que votre hébergeur accepte les scripts PHP.

Tout d'abord, téléchargez le fichier contenant 15 images. 
Décompressez le fichier dans un répertoire que vous nommerez imageflash.

Objectifs

Dans une animation 320x240, on va placer des séries de 4 images.
Volontairement, j'ai mis 15 images JPG 120x90 dans le répertoire pour compliquer la tâche.
Ce qui fait que l'on aura 4 pages, mais la dernière n'aura que 3 images.
2 boutons permettront de passer d'une page à l'autre en avant ou en arrière.
Dés que l'on clique sur une image, celle-ci est agrandie à la taille de la scène.
Un bouton permet de revenir à la page avec les 4 images.

Remarques :
320 / 240 = 120 / 90 = 4/3 , ceci pour zoomer correctement.
Il est à noter que Swishmax refuse les images gif en mode dynamique alors que celles-ci sont acceptées en mode statique. (bug?)

Création des Objets

1 - Définissez les dimensions générales 320x240 ainsi que la couleur du fond #CC9900.
Prenez un Frame Rate quelconque.

2 - Créez maintenant un rectangle de couleur #666600, nommé rect1.
Vous devez avoir, par exemple :

Rectangle    Transform

Ce rectangle va servir d'ombre à une image.
La position et la taille ont peu d'importance. Seuls comptent le nom, la case Target cochée et le point d'ancrage Top Left.

3 - Créez ensuite 3 autres rectangles : rect2, rect3, rect4
La position et la taille ont peu d'importance. Seuls comptent le nom, la case Target cochée et le point d'ancrage Top Left.

4 - Insérez un Sprite; nommez le Sprite1.
Vous devez avoir, par exemple :

Sprite    Transform

Ce sprite va héberger une image.
La position et la taille ont peu d'importance. Seuls comptent le nom et le point d'ancrage Top Left.

5 - Insérez de la même façon 3 autres sprites : Sprite2, Sprite3, Sprite4
La position et la taille ont peu d'importance. Seuls comptent le nom et le point d'ancrage Top Left.

6 - Insérez un bouton; nommez le Button1.
Vous devez avoir, par exemple :

Bouton    Transform

Ce bouton va permettre de zoomer une image.
La position et la taille ont peu d'importance. Seuls comptent le nom, la case Target cochée et le point d'ancrage Top Left.

7 - Insérez de la même façon 3 autres boutons : Button2, Button3, Button4
La position et la taille ont peu d'importance. Seuls comptent le nom, la case Target cochée et le point d'ancrage Top Left.

8 - Créez un texte Page précédente de couleur verte.
Convertissez le en bouton, que vous nommerez Prev

Bouton    Transform

Vous pouvez agrémenter les états Over, Down, Up.

9 - Créez un texte Page suivante de couleur verte.
Convertissez le en bouton, que vous nommerez Next

Bouton    Transform

Scene

Vous pouvez agrémenter les états Over, Down, Up.

10 - Créez un texte Retour de couleur bleue.
Convertissez le en bouton, que vous nommerez Retour

Bouton    Transform

Scene

Vous pouvez agrémenter les états Over, Down, Up.

Dans Timeline, mettre Place en Frame 10 du bouton Retour.

Outline

Outline doit ressembler à

Outline

Script PHP

Avec un éditeur de texte, vous allez entrer le texte suivant :

Sauvegardez ce fichier sous le nom readir.php. Il faudra le placer sur le serveur.

Explications :
On balaie le répertoire /imageflash. Tant qu'il y a des fichiers dans ce répertoire, on récupère la largeur et la hauteur des images pour n'avoir au final que la plus petite largeur et la plus petite hauteur.
( En fait, peu importe dans notre exemple, car toutes les images sont identiques )
Le contenu des variables nb_total_image , largeur_min_image , hauteur_min_image , fini va être récupéré dans le script de SwishMax.

Scripts SwishMax

Voici le script général de Scene_1

Voici le script de Button1

Recopiez ce script pour Button2, Button3, Button4 en adaptant
rectK, spriteK, current_image = K avec K = 2 , 3 , 4.

Voici le script du bouton Prev

Voici le script du bouton Next

Voici le script du bouton Retour

 


Si vous aimez le site

 

Select a language if you need :


Page chargée en 0.004 sec.

Dernière Modification : Mer 25 Janvier 2017 8:56
Copyright © 1999-2017 Jean-Paul Molina Tous droits réservés.

vers Google