Texte dynamique avec barre de défilement

 

On se propose d'importer dans l'animation, un fichier texte depuis un répertoire et de permettre le défilement du texte grâce à une barre verticale. Cet exemple utilise des scripts assez simples. Je suppose connu les fonctions de création sur lesquelles je n'insisterai pas.

⇒ 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 3 images et un fichier texte. .
Décompressez le fichier dans votre répertoire de travail SwishMax.

Objectifs

Dans une animation 640x480, on va créer un cadre dans lequel sera affiché un texte.
Une barre verticale va permettre de faire défiler ce texte.
Elle comprend :
- un bouton haut et un bouton bas qui permet de monter ou de descendre d'une ligne.
(également possible avec les touches flêches verticales du clavier)
- un ascenseur qui se déplacera en accord avec ce qui précède.
En cliquant dans les zones en dessous ou au dessus de l'ascenseur, on déplacera de 5 lignes vers le haut ou vers le bas.
(également possible avec les touches Page précédente et Page suivante)

Création des Objets

1 - Définissez les dimensions générales 640x480 ainsi que la couleur du fond #000066.
Prenez un Frame Rate quelconque.

2 - Créez maintenant un rectangle de couleur #7C72FC, nommé Cadre avec un contour d'épaisseur 3 et de couleur #DDDDDD.
Vous devez avoir :

Rectangle    Transform

Ce rectangle va servir de fond pour le texte.

3 - Importez maintenant l'image down.gif

image    Transform

Convertissez en bouton.

Button    Outline

Ce bouton va servir au défilement d'une ligne.

4 - Importez maintenant l'image up.gif

image    Transform

Convertissez en bouton.

Button    Outline

Ce bouton va servir au défilement d'une ligne.

5 - Créez maintenant un rectangle de couleur #7C72FC, nommé downside

Vous devez avoir :

Rectangle    Transform

Ce rectangle va servir pour le défilement de 5 lignes.

6 - Créez maintenant un rectangle de couleur #7C72FC, nommé upside

Vous devez avoir :

Rectangle    Transform

Ce rectangle va servir pour le défilement de 5 lignes.

7 - Importez maintenant l'image lift.gif

image   Transform

Ce rectangle va servir d'ascenseur.

8 - Et maintenant la partie délicate : le texte dynamique de couleur #FFFF00. Il m'a fallu chercher un moment pour que çà fonctionne.

Transform    Advanced

Suivez bien les étapes : Advanced, Dimensions, Formatting.

Dimensions   Formatting

Il est important de remarquer que la variable de contrôle scrolltext possède un nom différent du nom de l'objet txt.

Leading permet de modifier la distance entre les lignes en ne respectant pas la police de caractères.

Outline doit ressembler à

Outline

Script PHP

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

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

Explications :
On ouvre le fichier spécifié en lecture. On charge le contenu entier dans un tampon.
Puis on gère les accents éventuels (facultatif). On retourne la variable de texte dynamique scrolltext et fini.

Scripts SwishMax

Voici le script général de Scene_1

Voici le script du bouton scrolldown

Voici le script du bouton scrollup

Voici le script de downside

Voici le script de upside

Et voilà, c'est terminé.

Il faudrait améliorer la barre de défilement en déterminant le nombre de lignes du texte, puis en calculant le pas de déplacement de l'ascenseur de sorte que celui-ci arrive en bas de la barre lorsque la fin du texte est affiché. Mais, bon, je pinaille.

 


Si vous aimez le site

 

Select a language if you need :


Page chargée en 0.020 sec.

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

vers Google