|
==> BUT : le but de ce tutorial est de créer un
shootbox (démo
ici)
==> PUBLIC VISE : débutant
==> PRE-REQUIS : afin de mieux comprendre ce
cours, veuillez d'abord lire les cours sur MySQL si besoin et + les cours
sur flash: Introduction / Interface.
Quoi de plus beau que de disposer de contenu dynamique dans ses
animations flash? Nous allons voir comment créer une shootbox,
affichant des données provenant d'une table MySQL. Il est fortement
conseillé d'avoir un minimum de connaissances du php pour pouvoir
suivre ce tutorial dans les meilleures conditions possibles.
La shootbox sera composée de :
- un champ de texte dynamique
- un
bouton pour scroller vers le bas
- un bouton pour scroller vers le
haut.
Voici un aperçu de ce que vous aurez créé en fin de tutorial :
|
//
1. Commençons
par le champ de texte dynamique.
Créez un champ de texte dynamique et donnez lui
comme nom d'occurence "texte".
Ensuite, dans le panneau des propriétés, réglez les options, et
remplissez les champs de texte comme ci-dessous:
|
En placant texte dans le champ var, vous avez assigné
la variable texte ( que nous récupérerons dans un fichier php ). Il
faut faire aussi bien attention d'avoir bien enfoncé les 3 boutons à
coté de multiligne même si le troisième n'est pas
indispensable :)
|
//
2.Maintenant
occupons nous du code action script, qui permettra de récupérer la
fameuse variable "texte" dans le futur fichier php.
Pour cela nous allons utiliser la fonction loadvariables.
Créez un nouveau calque et nommez le "actions". Cliquez sur la
première frame et ouvrez le panneau des actions, pour y entrer le
code suivant :
|
Voila qui est fait... maintenant il faut créer la table MySQL qui
accueillera les messages.
//
3.
Voici le code pour créer la table dans phpmyadmin :
|
CREATE TABLE
shootbox
(id
INT
NOT NULL
AUTO_INCREMENT,
auteur VARCHAR(20)
NOT NULL,
date VARCHAR(30)
NOT NULL,
messages TEXT
NOT NULL,
PRIMARY KEY(id))
|
Vous devez saisir ce code dans la partie SQL de phpmyadmin ( on y
accède via les onglets de l'interface ).
Cette table s'appelle shootbox se compose de 4 champs
:
» id ( qui sera la clé )
» auteur ( qui contiendra le nom de l'auteur du message )
» date ( la date de postage )
» messages ( ce champs contiendra les message de vos visiteur, c'est à dire le
texte )
Si ca vous tente, vous pouvez insérer un petit message. Ca nous laissera l'occasion d'éffectuer un petit test afin de
nous assurer que tout est en ordre avant de s'aventurer plus loin dans
ce tutorial . Et ce petit test, c'est après la prochaîne étape.
//
4.
Attaquons nous au fichier msg.php ...
Lancez notepad et saisissez ce script php :
|
texte=<?
$db =
mysql_connect("localhost",
"login","password");
mysql_select_db("nom_base",$db);
$requete =
"select * from shootbox order by id desc limit
0,10";
$envoi =
mysql_query($requete);
while($tableau
=
mysql_fetch_array($envoi))
{
// on stock le contenu de
l'enregistrement dans plusieurs variables
$auteur =
$tableau['auteur'];
$date =
$tableau['date'];
$messages
= $tableau['messages'];
// on affiche les
messages
echo
"<font style="font-size:12px;"
color="#2C79AE">Le $date</font><br><b>$auteur</b> à ecrit :<br>$comment<br>________________<br>";
}
mysql_close($db);
?>
|
Il ne reste plus qu'à enregistrer ce fichier sous le nom de
msg.php . Faites également attention de ne pas avoir laissé
d'espace entre texte et =, au début
du code.
- Explications : Vous pouvez voir que le php commence après
texte= . C'est tout à fait normal car c'est en fait
la variable texte que nous allons récupérer sous
flash. Les données renvoyées par php sera le contenu de cette
variable texte .
Nous ne sélectionnerons que les 10 premiers messages, par ordre
d'apparition ( le dernier message posté en premier ). Les données récoltées
sont ensuite affichées.
|
//
5.
Créer un bouton
Dessinez les 4 états des 2 boutons
Nommez
les respectivement : Scroll- et Scroll+
Placez ensuite ces deux boutons sur un nouveau calque ( nommez le
boutons ). Positionnez les deux boutons où vous
le souhaitez.
|
Assignons maintenant le code ActionScript aux boutons de scroll...
Sélectionnez le bouton Scroll- , et ouvrez le panneau
des actions. Saisissez alors ce code :
Pour Scroll+, insérez ce code :
Et voila ! C'est la fin de ce tutorial qui je l'éspère vous aura donné
satisfaction.
Maintenant il ne vous reste plus qu'à adapter cette shootbox au style
de votre site...
|
