[AS3] soucis avec un htmlText / XML / CSSRésolu

Question

Bonjour à tous,

Mon soucis est simple, je charge un contenu textuel dans flash via un xml externe avec css.

Tout fonctionne à merveille pour ce qui est de la couleur du texte et quelques fonctions de mise en forme :

.unexemple {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FFFFFF;
font-weight: bold;
}

mais il refuse de prendre un compte un background-image par exemple.

Il serait alors possible de passer par le XML plutôt que par le CSS avec une balise  mais l'image recouvre mon texte ...

Je suis un peu perdu, toute aide sera bienvenue.

Orange73 · Accepted Answer

Moi je te propose et conseille ceci : "mon titre mon titre mon titre" Ensuite il te faut juste recuperer l'attribut "img" lors duparsing du xml. -- Orange73 -- "L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

goldorius · Answer

Autant pour moi, pas de background-image pour un textfield dans Flash : http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/text/StyleSheet.html

goldorius · Answer

Pas de réponse, ma demande doit être vague ou incomplete alors voici un bout de code posté le 15/02/2008 par lelutinvert sur ce même forum, et qui reprend la méthode que j'utilise pour travailler avec un xml et css : Exemple XML : À QUI LE TOUR ? Maintenant, vous allez savoir comment utiliser du contenu XML formaté à l'aide de feuilles de styles CSS. Attention, l'entête du contenu des styles CSS ne doit pas contenir une entête comme : @charset "utf-8";. ABRACADABRANTESQUE : Grâce à sa structure XML, l'import de contenu XML peut être formaté par des styles CSS d'un fichier externe, dont les noms sont ceux des balises XML. Fichier CSS : Mon_rapport { font-family: Verdana, Arial, Helvetica, sans-serif; } Mon_titre { font-size: 20px; color:#336600; text-indent: 30pt; } Ma_consigne { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#990000; display: block; } //Propriétés : //Contient les objets du champ texte private var _zoneTexte:TextField; private var _stylesTxt:StyleSheet; //Pour recueillir les données de styles private var _reqCSS:URLRequest; private var _stylesCSS:StyleSheet; private var _chgtFichierCSS:URLLoader; //Pour recueillir les données au format XML private var _reqXML:URLRequest; private var _contenuXML:XML; private var _chgtFichierXML:URLLoader; //Contructeur: public function AffTextes() { //Création des variables recevant les chargements _stylesTxt = new StyleSheet(); _contenuXML = new XML(); //Affichage du champ sur la scène (this) affChampTxt(this); //Les adresses des fichiers à télécharger _reqCSS = new URLRequest("fiche.css"); _reqXML = new URLRequest("Texte.xml"); //Lancement de l'affichage XML formaté CSS chgtStylesCSS(); } //Méthodes : //Affichage du champ de textes private function affChampTxt(cible:MovieClip):void { _zoneTexte = new TextField(); cible.addChild(_zoneTexte); _zoneTexte.selectable = false; _zoneTexte.wordWrap = true; //Dans cet exemple, les valeurs sont entrées en dur, // mais elles devraient être des paramètres _zoneTexte.width = 500; _zoneTexte.height = 400; _zoneTexte.x = 70; _zoneTexte.y = 30; } //Chargement des données CSS private function chgtStylesCSS():void { _chgtFichierCSS = new URLLoader(); _chgtFichierCSS.addEventListener(IOErrorEvent.IO_ERROR, retourneErreur); _chgtFichierCSS.addEventListener(Event.COMPLETE, appliStyles); _chgtFichierCSS.load(_reqCSS); } //À la fin du chargement CSS private function appliStyles(e:Event):void { _stylesTxt.parseCSS(e.currentTarget.data); _zoneTexte.styleSheet = _stylesTxt; chgtXML(); } //Chargement des données XML private function chgtXML():void { _chgtFichierXML = new URLLoader(_reqXML); _chgtFichierXML.addEventListener(IOErrorEvent.IO_ERROR, retourneErreur); _chgtFichierXML.addEventListener(Event.COMPLETE, AffChampTexte); } //Retourne toute erreur de chargement private function retourneErreur(err:Event):void { _zoneTexte.text = "Erreur lors du chargement des données XMl : "+err; } //À la fin du chargement XML, appel du texte à afficher //En jouant sur le nom des balises XML, on peut sélectionner des extraits du contenu private function AffChampTexte(e:Event):void { _contenuXML = XML(e.currentTarget.data); //Exemple du contenu total //_zoneTexte.htmlText = _contenuXML; //Exemple du contenu de la balise Menu_1 _zoneTexte.htmlText = _contenuXML.Menu_1; //Exemple du contenu de la balise Menu_2 //_zoneTexte.htmlText = _contenuXML.Menu_2; } } Ma question est simple, j'aimerai qu'en spécifiant dans le xml (car dans le css c'est pas possible cf. post du dessus) je puisse ajouter un fond (couleur ou image) pour certaines lignes de texte. Un exemple serait d'ajouter une image via xml seulement celle-ci recouvre le texte une fois affiché dans le textField de flash... Merci pour votre aide.

Orange73 · Answer

Si tu charge l'image apres l'affichage de ton texte c'est normal que celle ci recouvre le texte car a chaque fois que tu ajoute un enfant via addChild() cet enfant est ajouté a une profondeur +1.

Donc il faudrait changer cette profondeur avec swapChildren. entre ton texte et ton image.


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

goldorius · Answer

Merci Orange73, hum si simple que ca ?

cible.addChild(_zoneTexte); affiche mon textfield avec les données xml (image et texte confondu).

Il ne me reste donc plu qu'à trouver comment cibler mon image dans le texteFIELD ?

Orange73 · Answer

cible.addChild(_zoneTexte);
cible.addChild(_monImage);

cible.swapChildren(_zoneTexte, monImage);

ou alors tu fais l'inverse :

cible.addChild(_monImage);
cible.addChild(_zoneTexte);



-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

goldorius · Answer

j'entends bien sur le principe, le soucis est que mon image est dans _zoneTexte avec mon texte dans une balise html  ;) je n'ai vraiment aucunes idée de comment la cibler en réalité...

Dans mon cas, dans mon xml j'ajoute une image dans sa balise IMG et je lui indique un hspace ou vspace qui la fait se superposer à mon texte. est-il possible d'avoir l'inverse, l'image sous le texte plutôt que par dessus ?

J'imagine que je dois me compliquer la vie... j'ai entre temps fait différemment mais si tu as une solution je serais ravis de la connaitre.

Orange73 · Answer

Peux tu donner un exemple d'un noeud xml intégrant ta balise  ?


-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

goldorius · Answer

voici l'exemple demandé :

Orange73 · Answer

EDIT: Toujours en gardant le <![CDATA[]]>

-- Orange73 --

"L'homme n'est pas fait pour travailler, la preuve c'est que cela le fatigue" (Voltaire)

goldorius · Answer

Oui c'est un peu ce que je me suis résigné à faire, parser une balise. Donc rien à faire du coté css/xml merci d'avoir pris le temps de me répondre Orange :)

[AS3] soucis avec un htmlText / XML / CSS

11 réponses

Votre réponse

Discussions similaires