Charger une page html dans une animation flash

Soyez le premier à donner votre avis sur cette source.

Vue 33 516 fois - Téléchargée 4 919 fois

Description

Comment inserer une page html dans une animation flash ?
--------------------------------------------------------

>>>Et bien c'est impossible !

Enfin dans le sens strict du terme, flash ne peut pas simuler le comportement d'une iframe ! Mais je vous rassure, on peut tout de mème réussir à charger une page html et a en affiché le contenu. Par contre, votre animation ne reconnaitra que les balises natives de Flash. Donc aucunes balises exotiques, ni de div personnalisées, juste la base ...

Mais on peut quand mème réussir à manipuler le code source de la page chargée, pour en isoler certaines infos, ou pour se faire sa propre mise en forme pour palier aux manques de balises de flash.

Pour l'exemple:
---------------
Dans les 2 exemples du zip, j'ai utilisé un fichier "test.html" se trouvant dans le mème dossier que mon swf. Il faut savoir que pour pouvoir charger un fichier distant (autre domaine), il vous faudra ruser en passant par un fichier php.
Cette methode de contournement, je l'explique dans cette autre billet: Charger un fichier distant

Je vous invite à lire le billet en question après avoir assimilé ce billet-ci ;)

Utilisation de loadvars
-----------------------
Pour recuperer le code source de notre page html, on va evidement utiliser la classe loadvars, qui permet de loader casi n'importe quel fichier dans flash.

Usuellement, si vous vous ètes déjà servi de loadvars, vous savez que l'on se sert de l'evenement "onLoad" pour savoir si le fichier a bien été chargé, et executé notre code seulement à partir de ce moment.

Et bien dans notre cas, on va utiliser un autre evenement, car "onLoad" va interpéter les données chargées (comme les variables de type "&mavar=montexte&autrevar=autre texte&"), ce qui evidement ne nous interèsse pas, etant donné que notre but c'est de recuperer le code sources de la page sans aucune interpretation.

Donc pour mes exemples, je vais utiliser l'evenement "onData":

"Invoqué lorsque les données ont été totalement téléchargées à partir du serveur ou lorsqu'une erreur se produit au cours du téléchargement des données à partir d'un serveur. Ce gestionnaire est invoqué avant l'analyse des données et peut être utilisé pour appeler une routine d'analyse personnalisée au lieu de celle intégrée à Flash Player"

(La routine integrée à Flash est l'evenement "onLoad")

Source / Exemple :


/********************************************************
 
  Creation et paramètres du champs de texte recepteur

                                                                                                                  • /
//Creation du champs de texte var txt_html:TextField = this.createTextField("txt_html", this.getNextHighestDepth(), 0, 0, Stage.width, Stage.height); //Champs de texte multiligne this.txt_html.multiline = true; //On active le retour à la ligne automatique this.txt_html.wordWrap = true; //On supprime les blancs inutiles this.txt_html.condenseWhite = true; //On active le rendu html this.txt_html.html = true; /******************************************************** Chargement de la page html et traitement des données
                                                                                                                  • /
//On crée une reference à _root (pour le ciblage) var root:MovieClip = this; //On crée une nouvelle variable de chargement var lorem_lv:LoadVars = new LoadVars(); //lorsque "lorem" est invoqué this.lorem_lv.onData = function(src:String):Void { if (src != undefined) { //si le fichier html est chargé alors... root.txt_html.htmlText = src; } else { //et si le ficher html n'est pas trouvé root.txt_html.htmlText = "Impossible de charger le fichier"; } }; //Url a charger this.lorem_lv.load("test.html");

Conclusion :


Je joint un zip avec 2 exemples. Celui ci dessus, et un autre plus complexe qui permet par exemple de sortir et d'afficher tous les liens contenu dans le code source d'une page html

1er exemple (ci-dessus):
Cet exemple va donc creer un champs de texte au format html, et y placer le contenu de la page "test.html"
Vous allez vite vous rendre compte des limites de l'interpretation html de flash. La casi totalité de la mise en forme à disparue, et en plus les images sont alignés à gauche.

2ème exemple (dans le zip):
Dans cette exemple, je recupère tous les liens se trouvant dans le code source de ma page "test.html" via la fonction split. Puis je les insère dans notre champs de texte.
Donc à vous de ruser pour retirer les infos dont vous avez besoin ;)

Ps: Plus d'infos sur http://blog.ka-studio.net/index.php?2007/02/10/26-flash-loading-loader-charger-afficher-page-html

Ps2: un tuto sur comment charger un fichier d'un autre domaine en passant par dessus la securiète interdomaine de flash arrive dans quelques minutes ...

Codes Sources

A voir également

Ajouter un commentaire

Commentaires

fabolousk
Messages postés
1
Date d'inscription
dimanche 5 avril 2009
Statut
Membre
Dernière intervention
5 avril 2009
-
J'ai essayer de suivre vos demarche, mais comme c'est une page sur internet, j'ai juste changer le lien test.html en lien http://....//page.html mais ca affiche ke des textes.. esceke ya un moyen de tout afficher la page correctement dans un fichier flash ???
pierrojava
Messages postés
2
Date d'inscription
mardi 16 janvier 2007
Statut
Membre
Dernière intervention
5 juin 2007
-
non, franchement, tu n'as pas une solution pour flash 7 ?
merci
pierrojava
Messages postés
2
Date d'inscription
mardi 16 janvier 2007
Statut
Membre
Dernière intervention
5 juin 2007
-
euh...dis moi, c'est pas compatible avec as2 ca...
tu n'aurais pas une version pour flash MX 2004 ?
non ? dommage...

merci quand meme ^^

pj
flashnew
Messages postés
2
Date d'inscription
mercredi 25 avril 2007
Statut
Membre
Dernière intervention
3 mai 2007
-
Merci pour ton conseil !
Ton idée de réliser cela est varaiment bien et je vois comment tu veux faire - bref pour le principe pas de soucie, par contre pour créer mon code j'ai un peu du mal, si tu peux encore répondre à mes questions...

Toi tu charges tes liens dans un champ de texte ? Correcte?
Moi si je veux charger les images, je crée un clip vide ?

'Faire la recherche dans la chaine' , comment programmer ça? Pour trouver ma balise je mets : root.lien = src.split("<div"");

par contre .join j'ai pas trouvé dans ton script...

Merci
cs_x_mec
Messages postés
63
Date d'inscription
mercredi 25 août 2004
Statut
Membre
Dernière intervention
19 février 2008
-
Et bien tu peux gerer un peu ce que tu veux, comme tu recupère tout le code source, c'est a toi de faire un rechreche dans la chaine (comme l'exemple avec les liens), tu cherches la balise que tu veux et tu delimites (.split et .join).

E si tu as accès au page html (template), tu peux carement y placer des delimiteur perso (genre un commentaire html)

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.