Molto è cambiato tra il modo in cui il testo è stato gestito in Flash CS4 e Flash CS5. Riteniamo che sia un buon momento per tirare su uno sgabello, sederci e rivedere, in termini molto generali, cosa bisogna sapere su TLF prima di "cablare" un esercizio o un progetto usando ActionScript.
Quello che segue è un esercizio della Fondazione Flash CS5 per i designer di Tom Green e Tiago Dias.Con il nuovo TextLayoutFramework (TLF), il testo si trova in queste cose chiamate contenitori. Possono essere disegnati fisicamente sul palco usando lo strumento Testo e dato un nome di istanza o, come è più comune, possono essere creati in fase di runtime. Sai anche che il testo può essere formattato e manipolato usando il pannello Proprietà. La cosa bella qui è la parola proprietà. Se c'è una proprietà nel pannello, la sua controparte si trova in ActionScript. La cattiva notizia è che ActionScript è una pietra, un freddo stupido. Ad esempio, non ha idea di cosa sia un contenitore finché non gli dici di crearne uno. Non formatterà il testo finché non gli dirai cosa fare. Non metterà nemmeno il testo sul palco finché non gli verrà detto di farlo.
La maggior parte dei progetti inizierà con il dire a Flash di creare un Configurazione()
oggetto, che viene usato per dire a Flash che c'è un contenitore sullo stage e come gestire il Text Layout Framework per le cose nel contenitore. L'aspetto reale è gestito da TextFlow ()
classe, che prende i suoi ordini, per così dire, dal Configurazione()
oggetto.
Naturalmente, essendo stupidi, i Configurazione()
l'oggetto deve essere detto esattamente come gestire il testo nel contenitore. Il formato predefinito viene impostato tramite una proprietà della classe Configuration chiamata textFlowInitialFormat
. Per cambiarlo, usi semplicemente il TextlayoutFormat ()
classe per impostare i caratteri, i colori, l'allineamento e così via, quindi dirlo al capo-Configurazione ()
-questo è textFlowInitialFormat
è cambiato con quelli che hai impostato usando TextLayoutFormat ()
.Il capo lo otterrà, ma non è molto brillante, quindi è necessario dirgli di consegnare il lavoro effettivo a un altro membro del team di gestione, il TextFlow ()
classe. Questa classe ha la responsabilità generale di qualsiasi parola in un contenitore. Essere debole come il capo, TextFlow ()
deve essere detto che cos'è un paragrafo (ParagraphElement), quanto è ampio il paragrafo (SpanElement), se qualche elemento grafico è incorporato nel paragrafo (InlineGraphicElement), se qualche testo contiene collegamenti (Link Element), e così via. Non solo, ma bisogna sapere quale testo viene aggiunto al contenitore in modo che possa gestire la lunghezza della linea e aggiungere eventuali bambini (addChild) che contengono quella formattazione in modo che l'utente possa effettivamente vederlo.
Il TextFlow ()
la classe, pur non essendo troppo brillante, consegnerà il lavoro a un altro membro del team di gestione, il IFlowComposer ()
classe, il cui unico compito è gestire il layout e la visualizzazione del flusso di testo all'interno o tra i contenitori. Il compositore di flussi termina il processo decidendo quanto testo va in un contenitore e quindi aggiunge le righe di testo allo sprite. Questo è realizzato attraverso l'uso del addController ()
metodo, che crea a ContainerController ()
oggetto i cui parametri identificano il contenitore e le sue proprietà.
Il solito ultimo passaggio consiste nel dire al FlowComposer di aggiornare i controller e mettere il testo sul palco in base a come gli altri membri del team hanno detto al Configurazione() obiettare come deve essere gestito il loro pezzo del progetto.
Con queste informazioni in mano, passiamo a lavorare con TLF in ActionScript. Creeremo una colonna di testo con ActionScript.
Aprire un nuovo documento Flash ActionScript 3.0, rinominare il livello 1 in azioni, selezionare il primo fotogramma del livello azioni e aprire il pannello Azioni.
Fare clic una volta nel riquadro Script e immettere quanto segue:
var myDummyText: String = "L'introduzione della linea di prodotti Adobe CS5 mette nelle tue mani alcuni potenti strumenti tipografici, in particolare una nuova API (Application Programming Interface) chiamata Type Layout Framework (TLF) e più strumenti nella linea Adobe la spinta verso un punto di confluenza con Flash, il campo della grafica del movimento tipografico sul Web sta per entrare in un territorio che deve ancora essere esplorato. Per iniziare questa esplorazione, è necessario capire quale tipo è in Flash e, altrettanto importante , cosa puoi fare per onorare i messaggeri di comunicazione dei tuoi contenuti. ";
Hai bisogno di un testo da aggiungere al palco. Questa stringa è il terzo paragrafo di questo capitolo. Ora che hai il testo da inserire nel contenitore, devi caricare la classe che lo gestirà.
Premi il tasto Invio (Windows) o A capo (Mac) e aggiungi la seguente riga di codice:
var config: Configuration = new Configuration ();
Come avrai notato, non appena hai creato l'oggetto Configuration (), Flash ha importato la classe-flashx.textLayout.elements.Configuration
-il cui compito principale è controllare come si comporta il TLF. Il prossimo blocco di codice dice a TLF come apparirà il testo sullo stage.
Premi due volte il tasto Invio (Windows) o A capo (Mac) e inserisci quanto segue:
var charFormat: TextLayoutFormat = new TextLayoutFormat (); charFormat.fontFamily = "Arial, Helvetica, _sans"; charFormat.fontSize = 14; charFormat.color = 0x000000; charFormat.textAlign = TextAlign.LEFT; charFormat.paddingLeft = 100; charFormat.paddingTop = 100;
La classe TextLayoutFormat, come abbiamo detto prima, è come viene formattato il testo in un contenitore. Le proprietà in questa classe influenzano il formato e lo stile del testo in un contenitore, un paragrafo o anche una singola riga di testo. In questo caso, stiamo dicendo a Flash quali font usare, la dimensione, il colore, come deve essere allineato (nota la maiuscola usata per l'allineamento) e il padding che lo sposta dai bordi del contenitore.
Prima di andare avanti, devi fare qualcosa. C'è un problema di codifica. Scorri fino alle istruzioni di importazione. Se vedi questa linea-import flashx.textLayout.elements.TextAlign;
-procedere al prossimo blocco di codice. In caso contrario, elimina questa riga nel blocco di codice appena inserito: charFormat.textAlign = TextAlign.LEFT;
. Reinserire charFormat.textAlign =
. Digita le prime due lettere della classe (Te
), premere Ctrl + barra spaziatrice e dovrebbe apparire il suggerimento sul codice. Trova TextAlign
, e fai doppio clic su di esso. Questo dovrebbe aggiungere la dichiarazione di importazione mancante. Per preservare la tua sanità mentale, forniremo un elenco delle dichiarazioni di importazione che dovrebbero apparire alla fine di ogni esercizio. Ti consigliamo vivamente di confrontare il tuo elenco di dichiarazioni di importazione con l'elenco presentato e, se ne manchi qualcuno, aggiungili nel tuo codice.
Ora che sai come sarà formattato il testo, devi dire all'oggetto Configuration () di usare la formattazione. Se non lo fai, applicherà qualsiasi impostazione predefinita che sceglie.
Premi due volte il tasto Invio (Windows) o A capo (Mac) e inserisci quanto segue:
config.textFlowInitialFormat = charFormat;
Premi il tasto Invio (Windows) o A capo (Mac) e inserisci il seguente blocco di codice:
var textFlow: TextFlow = new TextFlow (config); var p: ParagraphElement = new ParagraphElement (); var span: SpanElement = new SpanElement (); span.text = myDummyText; p.addChild (span); textFlow.addChild (p);
Il TextFlow ()
l'oggetto deve essere qui perché il suo compito è gestire tutto il testo nel contenitore. Il costruttore-TextFlow (config)
-consente a TLF di sapere che è necessario utilizzare l'oggetto config creato in precedenza in modo che ora sappia come formattare il contenuto del contenitore e persino il contenitore stesso.
Il prossimo costruttore-ParagraphElement ()
-essenzialmente dice a Flash come deve essere gestito un paragrafo. Ce n'è solo uno qui, quindi non ha davvero bisogno di un parametro.
Il passo finale è quello di ottenere tutta la formattazione e il layout nel contenitore sul palco.
Premi il tasto Invio (Windows) o A capo (Mac) e aggiungi queste ultime due righe:
textFlow.flowComposer.addController (new ContainerController (this, 500, 350)); textFlow.flowComposer.updateAllControllers ();
La prima riga aggiunge il ContainerController
e dice a Flash che il contenitore gestito è il DisplayObject corrente (Questo
), che attualmente è lo stage e impostare le sue dimensioni a 500 pixel di larghezza per 350 pixel di altezza.
Salvare il progetto e testare il film. Il testo, come mostrato di seguito, viene visualizzato utilizzando le istruzioni di formattazione impostate.
Queste sono le dichiarazioni di importazione per questo esercizio:
import flashx.textLayout.elements.Configuration; import flashx.textLayout.formats.TextLayoutFormat; import flashx.textLayout.formats.TextAlign; import flashx.textLayout.elements.TextFlow; import flashx.textLayout.elements.ParagraphElement; import flashx.textLayout.elements.SpanElement; import flashx.textLayout.container.ContainerController;
Utilizzo di ActionScript per creare e formattare il contenitore e il relativo testo
Sebbene questo compito di codifica possa, all'inizio, sembrare un processo piuttosto contorto, possiamo assicurarci che non lo è; diventerà quasi una seconda natura quando inizierai a utilizzare ActionScript per giocare con il testo nei contenitori.
Con l'introduzione del formato di layout del testo, la possibilità di creare testo, formattare il testo, inserirlo in colonne e generalmente manipolarlo tramite ActionScript ha notevolmente ampliato le possibilità creative. Prima di essere entusiasti di questo, devi sapere che la parola Struttura è lì per una ragione.
Qualsiasi oggetto di testo TLF creato si baserà su una specifica libreria ActionScript TLF, chiamata anche a libreria condivisa di runtime (RSL). Quando lavori sul palco nell'interfaccia Flash, Flash fornisce la libreria. Questo non è il caso quando si pubblica il file SWF e lo si inserisce in una pagina Web. Deve essere disponibile, proprio come Flash Player, sul computer dell'utente. Quando il file SWF viene caricato, cercherà la libreria in tre punti:
Quando si pubblica un file SWF che utilizza il testo TLF, Flash crea un file aggiuntivo denominato textLayout_X.X.X.XXX.swz (dove le X vengono sostituite dal numero di versione) accanto al file SWF. Opzionalmente puoi scegliere di caricare questo file sul tuo server web insieme al tuo file SWF. Ciò consente il raro caso in cui i server di Adobe non sono disponibili per qualche motivo. Se apri il file in cui hai salvato questo esercizio, vedrai sia il file SWF che, come mostrato nella Figura 6-25, il file SWZ.
Il file .swz contiene il Text Layout Framework.
Stiamo distribuendo questo omaggio in modo un po 'diverso da quando Adam di Aetuts + ha spinto Wildfire a modo mio ... Wildfire è un geniale costruttore di promozioni e rende l'entrare in competizione un pezzo di torta! Se desideri partecipare con la possibilità di vincere una delle tre copie firmate di "Foundation Flash CS5 per designer", inserisci!
I tre vincitori saranno annunciati lunedì 6 settembre. In bocca al lupo!