Magazine Internet

[Flash] Phone Book en xml v2

Publié le 17 décembre 2007 par Avi Teboul

Bonjour,

Voici comment améliorer votre carnet d'adresses, nous allons ajouter un bouton qui nous permet lorsque nous cliquons
d'envoyer un mail au contact et un autre bouton qui nous permet d'aller directement sur son site web et une zone qui affichera sa photo.

1) Télécharger la version 1 du phonebook ici
2) Ouvrir le document et ajoutez un calque au dessus du calque bouton et nommez-le photos.
3) Modifier la taille du document en 250X350
4) Descendez les flèches et le champ texte qui affiche le nombre de contacts en bas de l'animation.
5) Créez un moviclip vide déposez-le sur la scène en dessous des champs texte et donnez-lui comme nom : photo
6) Créez un bouton vide dans la bibliothèque, juste créer un cadre dans la 4ème case
7) Déposez le calque sur la scène en vérifiant que l'on est bien sur le calque boutons.
8) Modifier la taille de cette zone pour qu'elle soit égale à la zone de texte mail.
9) Déposez un nouveau bouton sur le calque et adaptez-le à la zone web.
10) Donner comme nom au bouton mail : email et au bouton web : site.
11) Maintenant faites F9, et nous allons ajouter les lignes de code pour nos boutons et notre photo.
12) Après le }; et avant le stop(); placez ces lignes de code.
email.onPress = function(){
getURL("mailto:" + mail);
}
site.onPress = function(){
getURL(web);
}

Ces lignes donnent l'action aux boutons.
13) Maintenant nous allons afficher la photo dans notre movieclip vide.
Après la ligne de code if (success) { et avant la ligne de code du nom = this.... placez cette ligne
loadMovie(this.firstChild.childNodes[_root.entry].attributes.image, photos);
Au cas où, voila le code complet :
var contacts = new XML();
contacts.ignoreWhite = true;
var entry = 0;
var total = 0;
var current = 0;
contacts.load("contacts.xml");
contacts.onLoad = function(success) {
if (success) {
loadMovie(this.firstChild.childNodes[_root.entry].attributes.image, photos);
nom = this.firstChild.childNodes[_root.entry].attributes.nom;
mail = this.firstChild.childNodes[_root.entry].attributes.mail;
web = this.firstChild.childNodes[_root.entry].attributes.web;
_root.total = this.firstChild.childNodes.length;
_root.current = _root.entry + 1;
entryNum = _root.current+" de "+ _root.total;
}
};
email.onPress = function(){
getURL("mailto:" + mail);
}
site.onPress = function(){
getURL(web);
}
stop();

14) Il faut également modifier notre xml, vu que l'on doit afficher une photo il faut lui donner le nom.
Ouvrez votre fichier xml et ajoutez le champ image.
Avant on avait ça :
<entry nom="User1" mail="user1@test.com" web="http://www.user1.com"></entry>
maintenant on a ceci :
<entry>image="images/gingerguy.png" nom="Ginger Guy" mail="user1@test.com" web="http://www.burnside.be"</entry>
15) N'oubliez pas de créer un répertoire images avec vos images dedans.
Voilà faites ctrl+enter et vous devriez voir la photo de votre contact et les liens devraient vous ouvrir votre mailbox et le site web du contact.
Démo : ICI
Source : ICI
Bàv,
Burnside.


Vous pourriez être intéressé par :

Retour à La Une de Logo Paperblog

Ces articles peuvent vous intéresser :

A propos de l’auteur


Avi Teboul 600 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte