Flash CS3 - Flash CS4

Free tutorials and scripts for all.
Actionscript 3.0

Creare un output HTML con Flash CS3

This is a discussion on Creare un output HTML con Flash CS3 within the Articoli e tutorials forums, part of the Flash CS3 e Actionscript 3.0 category; Avete mai provato ad ottenere un output HTML da Flash ? La cosa è davvero interessante. Ho giocato un po con i ...


Go Back   Forum Flash CS3 Flash CS4 > Flash CS3 e Actionscript 3.0 > Articoli e tutorials

Register FAQ Members List Calendar Search Today's Posts Mark Forums Read
  2 links from elsewhere to this Post. Click to view. #1 (permalink)  
Old 29-05-08, 06:06
Administrator
 
Join Date: Jul 2007
Location: Cesena
Posts: 4,486
Rep Power: 6
Flep is on a distinguished road
Creare un output HTML con Flash CS3

Avete mai provato ad ottenere un output HTML da Flash ?

La cosa è davvero interessante.


Ho giocato un po con i metodi setTextformat e getTextFormat di Actionscript 3.0 e sono riuscito a creare una pagina HTML da Flash usando il PHP.


In pratica ho un campo di testo di tipo input, ho aggiunto un bottone bold e un componente ColorPicker.

Selezionando parte del testo si può assegnare un formato bold e cambiargli colore.

Infine, chiamando uno script PHP e passandogli l' output html del campo di testo, genero una pagina html con lo stesso formato.


Chiaramente questo è solo un esempio di quello che si potrebbe fare, apre migliaia di porte.

Creare un text editor, un editor WYSIWYNG.

Per qualsiasi applicazione che necessita un output html da Flash, questo è il primo passo da cui partire.








Selezionare parte del testo, assegnare il bold e scegliere un colore.

Cliccare send !


Creo un FLA che salvo con nome main.fla .

Al suo interno ho un campo di testo dinamico di tipo input con nome istanza field_txt econ un testo a caso.

Ho anche una MovieClip con nome istanza bold_mc ed un componente ColorPicker con nome istanza picker_mc.

Poi ho un bottone con nome istanza send_btn.

Infine ho 2 campi di testo che mi servono per incorporare i caratteri della font che uso ( in questo caso Arial ), uno normal e l' altro bold.

Per chi non sapesse di cosa sto parlando, meglio che si legga questo tutorial:

come incorporare le fonts in un SWF.


Adesso creo la Document Class, un file AS che salvo con nome Main.as, implementata in questo modo:


Code:
package
{
	import flash.display.*;
	import flash.events.*;
	import flash.text.*;
	import flash.net.*;
	
	public class Main extends MovieClip
	{
		public function Main()
		{
			addEventListener(Event.ADDED_TO_STAGE,init);
		}
		
		private function init(evt:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE,init);
			
			stage.focus=field_txt;
			
			addBoldListener();
			addColorPickerListener();
			addSendListener();
		}
		
		private function addBoldListener():void
		{
			bold_mc.mouseChildren=false;
			bold_mc.buttonMode=true;
			bold_mc.addEventListener(MouseEvent.MOUSE_DOWN,setBoldDown);
		}
		
		private function addColorPickerListener():void
		{
			picker_mc.addEventListener(Event.CHANGE,setColorChange);
		}
		
		private function addSendListener():void
		{
			send_btn.addEventListener(MouseEvent.MOUSE_DOWN,setSendDown);
		}
		
		private function setBoldDown(evt:MouseEvent):void
		{
			var f:TextFormat=field_txt.getTextFormat(field_txt.selectionBeginIndex,field_txt.selectionEndIndex);
			field_txt.setTextFormat(getBoldFormat(f,true),field_txt.selectionBeginIndex,field_txt.selectionEndIndex);
		}
		
		private function setSendDown(evt:MouseEvent):void
		{
			var variables:URLVariables=new URLVariables();
			variables.content=field_txt.htmlText;
			
			var request:URLRequest=new URLRequest("http://www.flepstudio.org/swf/PlayingWithSetFormat/myFormat.php");
			request.method=URLRequestMethod.POST;
			request.data=variables;
			
			var caller:URLLoader=new URLLoader();
			caller.addEventListener(Event.COMPLETE,htmlSent);
			caller.dataFormat=URLLoaderDataFormat.TEXT;
			try 
			{
				caller.load(request);
			} 
			catch (error:Error) 
			{
				trace('Unable to load requested document.');
			}
		}
		
		private function htmlSent(evt:Event):void
		{
			var caller:URLLoader=URLLoader(evt.target);
			var vars:URLVariables=new URLVariables(caller.data);
			var request:URLRequest=new URLRequest();
			request.url="http://www.flepstudio.org/swf/PlayingWithSetFormat/"+vars.answer;
			navigateToURL(request,"_blank");
		}
		
		private function setColorChange(evt:Event):void
		{
			var f:TextFormat=field_txt.getTextFormat(field_txt.selectionBeginIndex,field_txt.selectionEndIndex);
			field_txt.setTextFormat(getColorFormat(f,evt.target.selectedColor),field_txt.selectionBeginIndex,field_txt.selectionEndIndex);
		}
		
		private function getBoldFormat(fo:TextFormat,b:Boolean):TextFormat
		{
			fo.bold=b;
			return fo;
		}
		
		private function getColorFormat(fo:TextFormat,b:uint):TextFormat
		{
			fo.color=b;
			return fo;
		}
	}
}
Creo un PHP in questo modo:
PHP Code:
<?php
    header
("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
    
header("Last-Modified: " gmdate("D, d M Y H:i:s") . " GMT");
    
header("Cache-Control: no-store, no-cache, must-revalidate");
    
header("Cache-Control: post-check=0, pre-check=0"false);
    
header("Pragma: no-cache");
    
    
$content=stripslashes($_POST["content"]);
    
    
$file_directory "files/"//the directory you want to store the new file in
    
    
$file_name time();//the file's name, stripped of any dangerous tags
    
    
$file $file_directory.$file_name.".html"//this is the entire filename
    
    
$create_file fopen($file"w+"); //create the new file
    
    
$chmod chmod($file0755); //set the appropriate permissions.
    
    
$header='<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>'
.$file_name.'</title>
</head>
<body>'
;
                
    
$footer='
</body>
</html>'
;
    
    
fwrite($create_file$header."\n".$content.$footer);
    
    
//attempt to write basic content to the file
    
    
fclose($create_file);
    
    
$answer=$file;
    echo 
"answer=".$answer;
?>

Creo una cartella con nome files ( permessi 777 ) nella quale il PHP salverà i files html che crea in base all' output di Flash.


Analizziamo il codice Actionscript 3.0


Importo le classi che necessito

import flash.display.*;

import flash.events.*;

import flash.text.*;

import flash.net.*;


Dichiaro la classe

public class Main extends MovieClip


Dichiaro la funzione costruttrice

public function Main()

nella quale assegno un listener in ascolto dell' evento Event.ADDED_TO_STAGE che chiama una funzione con nome init. In questo modo, se lo necessitassimo potremmo tranquillamente caricare questo SWF dentro ad un altro.


Metodi

init

removeEventListener(Event.ADDED_TO_STAGE,init);

rimuovo il listener in ascolto dell' evento ADDED_TO_STAGE, dato che è già stato dispacciato.

stage.focus=field_txt;

imposto il focus sul campo di testo e chiamo 3 metodi:

addBoldListener();

addColorPickerListener();

addSendListener();


addBoldListener

in questo metodo assegno un listener alla MovieClip bold_mc in ascolto dell' evento MouseEvent.MOUSE_DOWN che chiamerà un metodo con nome setBoldDown

bold_mc.mouseChildren=false;

bold_mc.buttonMode=true;

bold_mc.addEventListener(MouseEvent.MOUSE_DOWN,set BoldDown);


addColorPickerListener

in questo metodo assegno un listener al ColorPicker ( picker_mc ) in ascolto dell' evento Event.CHANGE che chiamerà un metodo con nome setColorChange al momento in cui verrà scelto un colore

picker_mc.addEventListener(Event.CHANGE,setColorCh ange);


addSendListener

in questo metodo assegno un listener a send_btn in ascolto dell' evento MouseEvent.MOUSE_DOWN che chiamerà un metodo con nome setSendDown

send_btn.addEventListener(MouseEvent.MOUSE_DOWN,se tSendDown);


setBoldDown

in questo metodo assegno il bold al testo selezionato.

var f:TextFormat=field_txt.getTextFormat(field_txt.sel ectionBeginIndex,field_txt.selectionEndIndex);

field_txt.setTextFormat(getBoldFormat(f,true),fiel d_txt.selectionBeginIndex,field_txt.selectionEndIn dex);


setColorChange

in questo metodo assegno il colore al testo selezionato

var f:TextFormat=field_txt.getTextFormat(field_txt.sel ectionBeginIndex,field_txt.selectionEndIndex);

field_txt.setTextFormat(getColorFormat(f,evt.targe t.selectedColor),field_txt.selectionBeginIndex,fie ld_txt.selectionEndIndex);


setSendDown

in questo metodo chiamo lo script PHP passandogli il valore della proprietà htmlText del campo field_txt

var variables:URLVariables=new URLVariables();

variables.content=field_txt.htmlText;

var request:URLRequest=new URLRequest("http://www.flepstudio.org/swf/PlayingWithSetFormat/myFormat.php");

request.method=URLRequestMethod.POST;

request.data=variables;

var caller:URLLoader=new URLLoader();

caller.addEventListener(Event.COMPLETE,htmlSent);

caller.dataFormat=URLLoaderDataFormat.TEXT;

try

{

caller.load(request);

}

catch (error:Error)

{

trace('Unable to load requested document.');

}


htmlSent

questo è il metodo che viene eseguito quando il PHP mi restituisce l' echo col nome del file che ha creato.

var caller:URLLoader=URLLoader(evt.target);

var vars:URLVariables=new URLVariables(caller.data);

var request:URLRequest=new URLRequest();

request.url="http://www.flepstudio.org/swf/PlayingWithSetFormat/"+vars.answer;

navigateToURL(request,"_blank");


getBoldFormat

questo metodo cambia il bold al TextFormat del testo selezionato

fo.bold=b;

return fo;


getColorFormat

questo metodo cambia il colore al TextFormat del testo selezionato

fo.color=b;

return fo;


Alla prossima !


 

Attached Files
File Type: zip PlayingWithTextFormat.zip (626.6 KB, 55 views)

__________________

 


I recommend: Essential Actionscript 3.0

- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
- I do not reply technicians pvt messages. Open a thread !
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #2 (permalink)  
Old 11-09-08, 12:35
Junior Member
 
Join Date: Jan 2008
Posts: 1
Rep Power: 0
gaetes is on a distinguished road
Riferimento: Creare un output HTML con Flash CS3

Ciao,
questo è il mio primo messaggio e credo ne seguiranno molti altri perchè ritengo questo forum utilissimo.
Questo tutorial poi è interessantissimo tanto che vorrei implementarlo in modo tale da creare una pagina web con tanto di header, footer personalizzabili se è possibile.
Potreste gentilmente darmi qualche consiglio in merito?
Grazie anticipatamente per la vostra disponibilità.
Ciao
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #3 (permalink)  
Old 27-10-08, 13:09
Junior Member
 
Join Date: Aug 2008
Posts: 20
Rep Power: 0
rajan is on a distinguished road
Re: Creare un output HTML con Flash CS3

Ciao Flep,
stavo giusto lavorando con un editor di testo fatto in flash.... ma ho notato una cosa strana
come nel tuo esempio viene generato un testo con una dimensione dei caratteri che non è quella usata nel campo di testo, escono dei caratteri giganti!!! Non riesco a capire perchè
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #4 (permalink)  
Old 27-10-08, 14:19
Junior Member
 
Join Date: Aug 2008
Posts: 20
Rep Power: 0
rajan is on a distinguished road
Re: Creare un output HTML con Flash CS3

Dato che sto continuando a sbatterci la testa... mostro i miei progressi...

Il fatto inspiegabile è che la stessa stringa di codice:
HTML Code:
<P ALIGN="LEFT"><FONT FACE="Arial" SIZE="12" COLOR="#000000" LETTERSPACING="0" KERNING="0">Questa è <U>una</U> <FONT SIZE="24" COLOR="#FF00FF">PROVA</FONT></FONT></P>
se inserito in una pagina html da questo:


se inserito in un capo di testo flash e cioè blabla.htmlText="tutta la pappardella di sopra", da questo:




Non capisco perchè la dimensione del font non venga mantenuta se postiamo la stringa a php....
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #5 (permalink)  
Old 28-10-08, 14:04
Administrator
 
Join Date: Jul 2007
Location: Cesena
Posts: 4,486
Rep Power: 6
Flep is on a distinguished road
Re: Creare un output HTML con Flash CS3

Credo sia un problema di proporzioni.
Prova a lanciare l' uotput in una finestra html delle stesse dimensioni dell' SWF.
__________________

 


I recommend: Essential Actionscript 3.0

- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
- I do not reply technicians pvt messages. Open a thread !
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

Flash Multi Gallery
  #6 (permalink)  
Old 28-10-08, 14:16
Junior Member
 
Join Date: Aug 2008
Posts: 20
Rep Power: 0
rajan is on a distinguished road
Re: Creare un output HTML con Flash CS3

Ho continuato a provarci in tutti i modi e con tutte le dimensioni di carattere,
ma questo editor che sto usando sembra generare codice html riconosciuto correttamente solo da flash...
Non credo si un problema di proporzioni perchè in html il testo è sempre della stessa dimensione sia che dall'editor io l'abbia impostato a 8 sia a 40 ....

anche nel tuo editor succede la stesa cosa....

secondo me il fattaccio sta nel codice ma non capisco cosa:
(prova ad incollarlo in una pagina html e in un textfield in flash)
HTML Code:
<P ALIGN="LEFT"><FONT FACE="Arial" SIZE="12" COLOR="#000000" LETTERSPACING="0" KERNING="0">Questa è <U>una</U> <FONT SIZE="24" COLOR="#FF00FF">PROVA</FONT></FONT></P>
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #7 (permalink)  
Old 28-10-08, 14:22
Administrator
 
Join Date: Jul 2007
Location: Cesena
Posts: 4,486
Rep Power: 6
Flep is on a distinguished road
Re: Creare un output HTML con Flash CS3

Concordo con te ma credo ancora che bisognerebbe provare a lanciare l' output in una pagina html con la stessa dimensione dell' SWF per vedere come si comporta.
__________________

 


I recommend: Essential Actionscript 3.0

- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
- I do not reply technicians pvt messages. Open a thread !
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #8 (permalink)  
Old 28-10-08, 14:24
Junior Member
 
Join Date: Aug 2008
Posts: 20
Rep Power: 0
rajan is on a distinguished road
Re: Creare un output HTML con Flash CS3

ok provo....
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #9 (permalink)  
Old 28-10-08, 14:35
Junior Member
 
Join Date: Aug 2008
Posts: 20
Rep Power: 0
rajan is on a distinguished road
Re: Creare un output HTML con Flash CS3

nada.... anche con la pagina delle stesse dimensioni dell'swf il risultato rimane lo stesso...

Forse non c'è soluzione infatti editor di testi più completi ed a pagamento hanno optato per l'utilizzo dei css... solo che nel mio caso non posso mica dare al cliente un editor in cui per fare un titolo rosso in grassetto e corsivo si deve mettere a definire una nuova regloa css!!!

Per ora sto ignorando il problema perchè tanto recupero il contenuto dell'editor con un altro swf ma mi è rimasta la voglia di generare con flash un html compatibile ...

Aspetto sviluppi
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

  #10 (permalink)  
Old 28-10-08, 14:36
Administrator
 
Join Date: Jul 2007
Location: Cesena
Posts: 4,486
Rep Power: 6
Flep is on a distinguished road
Re: Creare un output HTML con Flash CS3

Tienici aggiornati.
__________________

 


I recommend: Essential Actionscript 3.0

- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
- I do not reply technicians pvt messages. Open a thread !
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote

Reply

Bookmarks

Tags
htmlText, output html, php

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is On
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump

Similar Threads

Thread Thread Starter Forum Replies Last Post
Actionscript 3 il Trace non produce output AmiFlash Actionscript 3.0 base 4 11-11-08 22:52
Actionscript 2 url html in flash ROBY94 Flash CS3 generale 7 11-11-08 18:53
Flash PHP output.appendText su Login As3+Php lambertocudia Flash CS3 | PHP | mySQL 2 25-09-08 11:38
Creating HTML output with Flash CS3 Flep Tutorials 1 31-07-08 09:32
php output xml for flash problem derrida Flash CS3 | PHP | mySQL 6 31-07-08 01:40


All times are GMT. The time now is 21:04.


Powered by vBulletin versione 3.7.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC4
Forum SiteMap


FlepStudio
by Filippo Lughi
P.IVA 03605860406