begin process at 2010 02 10 00:35:38
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

ActionScripts

 > SMILEYFIELD :: TEXTFIELD AVEC SMILEY IMAGES

SMILEYFIELD :: TEXTFIELD AVEC SMILEY IMAGES


 Information sur la source

Note :
9,5 / 10 - par 4 personnes
9,50 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :ActionScripts Niveau :Initié Date de création :11/07/2003 Date de mise à jour :11/07/2003 05:18:26 Vu / téléchargé :4 326 / 700

Auteur : BlackWizzard

Ecrire un message privé
Site perso
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (13)
Ajouter un commentaire et/ou une note


 Description

voici un textfield qui prend en compte les smiley!
enfin!!!
il recherche les smiley et les transforme en image, grace a un xml qui permet la correspondance ascii->fichier.

Le code est pas super complexe, mais un debutant va vite etre pommé kan meme.

Tres utile pour une application de chat par exemple.

Source

  • XML_FILE = "smiley.xml";
  • SPACE = 4;
  • LEADING = 18;
  • MAXWIDTH = 200;
  • x = new XML();
  • x.ignoreWhite = true;
  • x.load(_root.XML_FILE);
  • x.onLoad = function(success) {
  • _root.xmlloaded = true;
  • };
  • monFormat = new TextFormat();
  • monFormat.font = "arial";
  • monFormat.size = 12;
  • monFormat.type = "static";
  • //********************************************************************************
  • String.prototype.replace = function(str, rep, chr) {
  • var t = (chr<0) ? this.substr(chr) : this.substr(0, chr);
  • var s = str.length;
  • var r = rep.length;
  • var p = t.indexOf(str);
  • while (p != -1) {
  • t = t.substr(0, p)+rep+t.substr(p+s);
  • p = t.indexOf(str, p+r);
  • }
  • return (chr) ? (chr<0) ? this.substr(0, this.length+chr)+t : t+this.substr(chr) : t;
  • };
  • String.prototype.transCode = function() {
  • input = this;
  • input = input.replace("é", "e");
  • input = input.replace("è", "e");
  • input = input.replace("à", "a");
  • input = input.replace("ç", "c");
  • input = input.replace("ë", "e");
  • input = input.replace("ê", "e");
  • input = input.replace("ù", "u");
  • //input = input.toLowerCase();
  • return input;
  • };
  • function isSmiley(input) {
  • _root.local_rez = 0;
  • ixml = 0;
  • while (x.childNodes[0].childNodes[ixml] != undefined) {
  • S_SMILEY = x.childNodes[0].childNodes[ixml].attributes.smiley;
  • S_URL = x.childNodes[0].childNodes[ixml].attributes.url;
  • S_W = x.childNodes[0].childNodes[ixml].attributes.w;
  • S_H = x.childNodes[0].childNodes[ixml].attributes.h;
  • ixml++;
  • if (input == S_SMILEY) {
  • _root.s_var = S_SMILEY+" "+S_URL+" "+S_W+" "+S_H;
  • _root.local_rez = 1;
  • }
  • }
  • return _root.local_rez;
  • }
  • MovieClip.prototype.write = function(input) {
  • y_size += LEADING;
  • x_size = 0;
  • input = input.transCode();
  • tbl = input.split(" ");
  • for (i=0; i<=tbl.length-1; i++) {
  • reading = tbl[i];
  • if (!_root.isSmiley(reading)) {
  • d++;
  • this.createTextField("tf"+d, d, x_size, y_size, 0, 0);
  • this["tf"+d]._visible = 1;
  • this["tf"+d].text = reading;
  • //this["tf"+d].setTextFormat(monFormat);
  • this["tf"+d].textColor = "0x000000";
  • this["tf"+d].selectable = false;
  • this["tf"+d].autoSize = true;
  • x_size += this["tf"+d].textWidth+SPACE;
  • if (x_size>=MAXWIDTH) {
  • x_size = 0;
  • y_size += LEADING;
  • }
  • } else {
  • sv = _root.s_var.split(" ");
  • d++;
  • this.smiley.duplicateMovieClip("smiley"+d, d);
  • this["smiley"+d].loadMovie(sv[1]);
  • this["smiley"+d]._x = x_size;
  • this["smiley"+d]._y = y_size;
  • this["smiley"+d]._visible = 1;
  • x_size += SPACE+int(sv[2]);
  • }
  • }
  • this["border"]._y = LEADING-1;
  • this["border"]._width = MAXWIDTH;
  • this["border"]._height = y_size+2;
  • this["border"].swapDepths(d+100);
  • };
XML_FILE = "smiley.xml";
SPACE = 4;
LEADING = 18;
MAXWIDTH = 200;
x = new XML();
x.ignoreWhite = true;
x.load(_root.XML_FILE);
x.onLoad = function(success) {
	_root.xmlloaded = true;
};
monFormat = new TextFormat();
monFormat.font = "arial";
monFormat.size = 12;
monFormat.type = "static";
//********************************************************************************
String.prototype.replace = function(str, rep, chr) {
	var t = (chr<0) ? this.substr(chr) : this.substr(0, chr);
	var s = str.length;
	var r = rep.length;
	var p = t.indexOf(str);
	while (p != -1) {
		t = t.substr(0, p)+rep+t.substr(p+s);
		p = t.indexOf(str, p+r);
	}
	return (chr) ? (chr<0) ? this.substr(0, this.length+chr)+t : t+this.substr(chr) : t;
};
String.prototype.transCode = function() {
	input = this;
	input = input.replace("é", "e");
	input = input.replace("è", "e");
	input = input.replace("à", "a");
	input = input.replace("ç", "c");
	input = input.replace("ë", "e");
	input = input.replace("ê", "e");
	input = input.replace("ù", "u");
	//input = input.toLowerCase();
	return input;
};
function isSmiley(input) {
	_root.local_rez = 0;
	ixml = 0;
	while (x.childNodes[0].childNodes[ixml] != undefined) {
		S_SMILEY = x.childNodes[0].childNodes[ixml].attributes.smiley;
		S_URL = x.childNodes[0].childNodes[ixml].attributes.url;
		S_W = x.childNodes[0].childNodes[ixml].attributes.w;
		S_H = x.childNodes[0].childNodes[ixml].attributes.h;
		ixml++;
		if (input == S_SMILEY) {
			_root.s_var = S_SMILEY+" "+S_URL+" "+S_W+" "+S_H;
			_root.local_rez = 1;
		}
	}
	return _root.local_rez;
}
MovieClip.prototype.write = function(input) {
	y_size += LEADING;
	x_size = 0;
	input = input.transCode();
	tbl = input.split(" ");
	for (i=0; i<=tbl.length-1; i++) {
		reading = tbl[i];
		if (!_root.isSmiley(reading)) {
			d++;
			this.createTextField("tf"+d, d, x_size, y_size, 0, 0);
			this["tf"+d]._visible = 1;
			this["tf"+d].text = reading;
			//this["tf"+d].setTextFormat(monFormat);
			this["tf"+d].textColor = "0x000000";
			this["tf"+d].selectable = false;
			this["tf"+d].autoSize = true;
			x_size += this["tf"+d].textWidth+SPACE;
			if (x_size>=MAXWIDTH) {
				x_size = 0;
				y_size += LEADING;
			}
		} else {
			sv = _root.s_var.split(" ");
			d++;
			this.smiley.duplicateMovieClip("smiley"+d, d);
			this["smiley"+d].loadMovie(sv[1]);
			this["smiley"+d]._x = x_size;
			this["smiley"+d]._y = y_size;
			this["smiley"+d]._visible = 1;
			x_size += SPACE+int(sv[2]);
		}
	}
	this["border"]._y = LEADING-1;
	this["border"]._width = MAXWIDTH;
	this["border"]._height = y_size+2;
	this["border"].swapDepths(d+100);
};
 

 Conclusion

pour fonctionner, fo tout decompresser dans le meme rep!
le swf dans le zip, sert a rien si le reste est pas decompressé...

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec Zip Source avec une capture SPORE-LIKE DEMO
Source avec Zip Source avec une capture LINECHART / AREACHART : COMPOSANT AS2, SOURCE XML, STYLE PAR...
Source avec Zip COURS FLASH: COMMUNICATION FLASH/PHP
Source avec Zip 3D TEMPS REEL EN AS2
Source avec Zip Source avec une capture CLASS PIECHART: CODE ET COURS (8 PAGES FLASHPAPER/WORD)

 Sources de la même categorie

Source avec Zip NAVIGATION DANS UN FICHIER XML par inaden
Source avec Zip Source avec une capture TWSCROLLBAR, UNE CLASSE DE SCROLLBAR SIMPLE ET PRATIQUE À UT... par Twinspirit
Source avec Zip Source avec une capture REBOND DE BALLON AVEC TWEEN par habibcode
Source avec Zip DIAPORAMA AS2 par ahmedhrbdj
Source avec Zip EXAMPLES DE TWEENS AS2 par rajas

Commentaires et avis

Commentaire de r1one le 11/07/2003 07:50:41

hehehe cool ! Je retrouve enfin de "vraies" sources :)

Commentaire de flashman007 le 11/07/2003 11:01:32

arf ca c marrant et pratique...

Commentaire de righton le 11/07/2003 12:21:48

Excellent je l'avais déjà fait dans un chat mais j'utilisais une police smiley plutôt que des images. bien joué !

Commentaire de Tortuegeniale le 21/09/2005 10:25:53

Excelent ^^

Commentaire de oriann666 le 07/06/2007 10:46:07

Bonjour, c bien jolie tout ça

j'ai essayé de faire un chat en flash avec des smileys aussi. Au début j ai pensé qu il fallait utiliser la balise <img>, mais en fait c pas vraiment fait pour ca j ai l impression, l image arrive tojours en  dessous, ce qui n a rien à voir avec ce que je veux.

J ai donc cherché longuement sur google, pour finir sur FlashKod, le meilleur site où on trouve des soluces.

Maintenant que j y suis, je tombe sur ce tuto, génial, j v enfin comprendre. Et puis, la, pas de commentaires dan sle code, aucunes explications -_-... Ouai je sais, je suis pas un pro, mais encore un newbie.

Donc si je pouvais avoir un petit résumé sur le fonctionnement  de l'étape :
-> il recherche les smiley et les transforme en image, grace a un xml qui permet la correspondance ascii-&gt;fichier.

Comment est ce possible? Quel est le vrai changement qui se passe quand on change ":)" par "01.jpg"

Merci d'avance !!

Commentaire de BlackWizzard le 07/06/2007 17:50:03 administrateur CS

En fait, le texte est decomposé en mots. chaque mot est placé dans une nouveau textfield, qui est repositionné et redimentionné.
Les smileys sont reconnu via le fichier xml et remplacé par un emptyMovieClip qui charge l'image en loadMovie. le clip est ensuite positionné.
Les calculs sont assez chaud, il faut prendreen compte la taille des smileys dans la phrase, la taille des mots, etc...

Au final, ça donne l'impression d'etre un textfield, mais c'est un gros puzzle.

Commentaire de oriann666 le 07/06/2007 19:37:50

Ouahou d'accord,

c'est donc un gros bordel si je puis dire, mais ça marche.
Crois tu, oui on se tutoie sur le net ;) que c'est comme ca qu une interface Flash de chat telle que http://www.123flashchat.com/demo.html fonctionne pour insérer des smileys?

car j'ai essayé de mon coté d'insérer une image avec une balise <img src=''>, mais l'image apparait en dessous. Sinon je voulais aussi utiliser les smileys d'une typo, mais quand je fais : champ-texte.htmlText += "balbalbal"
ca me ramèe à la ligne quand même car aparement, une balise <p> se ferme automatiquement </p>, donc j'attérit à la ligne, ce qui est très ennuyeux.

Bon voila, t es pas obligé de me répondre ^_^, c juste un problème que j'ai rencontré et que j'ai toujours pas résolu, et dont quelqu'un a la réponse.

Merci

Tcho

Commentaire de BlackWizzard le 08/06/2007 04:24:18 administrateur CS

je sais pas comment fonctionne 123flashchat. faudra analyser leur code via un decompilateur...
mais je pense que c'est le seul moyen.

Commentaire de righton le 08/06/2007 10:44:56

je pense que 123flashchat utilise la même technique que celle de BW mais il y'a un seul textfield. Les smileys sont chargés dans un clip et placé au dessus du textfield dans lequels ils insèrent plusieurs espaces. La question c'est comment font ils pour pouvoir placer le clip précisement après tel mot.

Commentaire de BlackWizzard le 08/06/2007 21:34:24 administrateur CS

Si ils arrivent à faire ça avec un seul textfield, c'est balaise, et ça permet d'alleger au niveau de l'utilisation memoire. parsque faut avouer que ma source est assez lourde apres plusieurs centaines de mots...

Commentaire de oriann666 le 09/06/2007 13:39:42

Faudrait surtout que Adobe améliore cette balise <img> qui pour le coup, perd bcp de son utilité.

Commentaire de OphidiaN le 25/10/2007 18:31:16

ok ça fait longtemps mais ce qui me posait problème avec cette très bonne source, c'est que on ne pouvait donc plus sélectionner d'un coup le texte. j'ai regardé ce qui était faisable avec un seul textfield, et en jouant avec un textfield temporaire, textWidth et textHeight, on peut arriver au résultat de 123flashChat :
bon le code est un peu brutal comme ça en commentaire, mais je suis persuadé que ça aidera quelqu'un...

var smileys:Array = new Array();
smileys.push({search:"[;)]",attach:"smiley_wink",replace:"     "})
smileys.push({search:"[:)]",attach:"smiley_smile",replace:"     "})
// etc ... il suffit de calculer le bon espacement pour votre police

replaceSmileys = function(txt){
var t:TextField = createTextField("temporaryTextField",getNextHighestDepth(),0,100,100,100);
t._visible=false; t.embedFonts=true; t.type="dynamic"; t.autoSize=true;
var tf:TextFormat = t.getTextFormat();
tf.font="myfont"; // la meme font que le textfield de base, pensez au linkage.
// en effet le embedFonts oblige de passer par TextFormat et une font de la biblio.
tf.size=txt.getTextFormat().size;
t.setNewTextFormat(tf);
var baseTexte:String;
for(smiley in smileys){
s=smileys[smiley];
var i=txt.text.indexOf(s.search);
while(i!=-1){
t.text=txt.text.substr(0,i);
var j=t.textWidth;
var nb13=0;
var k=t.text.indexOf(chr(13));
while(k!=-1){ // on compte le nb de saut de lignes dans le textfield
nb13++;
k=t.text.indexOf(chr(13),k+1);
}
var smile=attachMovie(s.attach,"smile"+getNextHighestDepth(),getNextHighestDepth());
smile._y=t.textHeight-smile._height+2*nb13; // un saut de ligne=2pt
var last13=t.text.lastIndexOf(chr(13));
if(last13!=-1) t.text=t.text.substr(last13+1);
smile._x=t.textWidth+4;
txt.replaceText(i,i+s.search.length,s.replace)
i=txt.text.indexOf(s.search);
}
}
}

replaceSmileys(votreTextField);
//pensez à linker des smileys évidemment...
  

Commentaire de OphidiaN le 27/10/2007 00:04:55

hmmmm désolé à l'utilisation j'ai découvert un bug de placement. En effet je remplaçais tous les smileys d'un meme type, puis d'un autre, etc... Cela avait pour effet de décaler les smileys a cause des espaces différents entre les types de smileys.
La solution consiste donc à remplacer le premier smiley trouvé, quel qu'il soit. Voici la solution finale:

var smileys:Array = new Array();
smileys.push({search:"[:)]",attach:"smiley_smile",replace:"     "})
smileys.push({search:"[;)]",attach:"smiley_wink",replace:"     "})

findNextSmiley = function(txt:String){
var id=10000; // rarement vu un texte plus long.
var pos=-1;
for(var smiley in smileys){
var i=txt.indexOf(smileys[smiley].search);
if((i<id) && (i!=-1)){id=i; pos=smiley; }
}
if(id==10000){ id=-1 }
return {id:id,pos:pos};
}

replaceSmileys = function(txt:TextField){
var t:TextField = txt._parent.createTextField("temporaryTextField",getNextHighestDepth(),0,100,100,100);
t._visible=false; t.embedFonts=true; t.type="dynamic"; t.autoSize=true;
var tf:TextFormat = t.getTextFormat();
tf.font="Ad Lib"; // la meme font que le textfield de base, pensez au linkage.
// en effet le embedFonts oblige de passer par TextFormat et une font de la biblio.
tf.size=txt.getTextFormat().size;
t.setNewTextFormat(tf);
var nextSmiley;
nextSmiley=findNextSmiley(txt.text);
while(nextSmiley.id!=-1){
var s = smileys[nextSmiley.pos];
var i=nextSmiley.id;
t.text=txt.text.substr(0,i);
if(t.text=="") t.text=" ";
var k = t.text.indexOf(chr(13)+chr(13));
if(k!=0){
t.replaceText(k,k+2,chr(13)+"deux");
}
var j=t.textWidth;
var nb13=0;
var k=t.text.indexOf(chr(13));
while(k!=-1){
nb13++;
k=t.text.indexOf(chr(13),k+1);
}
var smile=txt._parent.attachMovie(s.attach,"smile"+txt._parent.getNextHighestDepth(),txt._parent.getNextHighestDepth());
smile._y=txt._y + t.textHeight-smile._height+2*nb13;
var last13=t.text.lastIndexOf(chr(13));
if(last13!=-1) t.text=t.text.substr(last13+1);
smile._x=txt._x+t.textWidth+4;
txt.replaceText(i,i+s.search.length,s.replace)
nextSmiley=findNextSmiley(txt.text);
}
}

// voilà, et en +, on peut l'appeller sur n'importe quel textfield, où qu'il soit.

à+

 Ajouter un commentaire




Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,577 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales