Dopo l'articolo introduttivo di settimana scorsa, vediamo come sia possibile utilizzare il Text Layout Framework all'interno di Flash CS4: è possibile utilizzare un approccio principalmente visuale utilizzando l'apposito pannello fornito con il componente per Flash CS4 Professional, in alternativa si può decidere di sfruttare principalmente Actionscript; la prima opzione è consigliabile per prendere confidenza con le varie opzioni offerte dal framework e in generale offre un approccio più "immediato" dato che in pochi passaggi possiamo vedere come apparirà il nostor testo, tuttavia la soluzione tramite Actionscript permette una maggior dinamicità e consente di sfruttare più a fondo le potenzialità del prodotto.
Utilizzo tramite interfaccia grafica
Come detto, questo è il metodo di utilizzo più semplice: è sufficiente aprire il pannello componenti (Window->Components oppure Ctrl+F7), quindi aprire la categoria Standard Components; al suo interno è presente il componente TextLayout.
Possiamo trascinare un'istanza del componente sullo stage, dove il componente risulterà come un movieclip con all'interno la scritta TextLayout Sample Text.
Per gestire il contenuto del componente possiamo affidarci all'apposito pannello che viene fornito con il componente, raggiungibile dal menu Window->Other Panels-> Text Layout; questo aprirà un file identico allo strumento di test online disponibile sugli Adobe Labs.
Notiamo la varietà di opzioni a disposizione: tutta l'area di sinistra è dedicata all'inserimento del testo, a destra abbiamo una serie di pannelli a scorrimento relativi alle opzioni di carattere, paragrafo, spaziatura, antialiasing, allineamento e flusso del testo; mentre nella parte bassa del pannello troviamo le opzioni relative al testo da caricare, o salvare, e le schede relative a eventuali link, o immagini da inserire nel testo; premendo il pulsante Get from stage vedremo apparire il testo TextLayout Simple Text nel nostro file, con un righello a indicare la larghezza del componente presente sullo stage da cui il pannello Text Layout ha appena "ereditato" il testo.
Possiamo dire che il componente sullo stage e il pannello Text Layout lavorino "in simbiosi", infatti possiamo attuare un continuo scambio di dati tra i due, per esempio una volta effettuate le modifiche al testo all'interno del pannello potremo trasferirle al componente usando il pulsante Send to Stage.
Impostazione e personalizzazione del testo
Character (carattere)
Queste opzioni sono relative all'aspetto del testo e possono essere impostate per una (o più) parola.
- Font: stabilisce quale carattere utilizzare per rappresentare il testo;
- Lookup: Device o Embed CFF, ovvero uso dei font di sistema o font incorporati (specificabili tramite il tasto Embed fonts posto nella parte bassa del pannello Text Layout);
- Size: dimensione del testo;
- Leading: stabilisce lo spazio tra una riga e l'altra (può esser settato per ogni riga del testo);
- Stile: pulsanti per grassetti, corsivo, sottolineato, sbarrato, superscript e subscript;
- Kerning: on, off o automatico; il kerning imposta la spaziatura tra alcune coppie di caratteri (per esempio Lt, To, Ta,Tu, Te), è un'informazione solitamente presente in ogni font;
- Track right: stabilisce la spaziatura orizzontale tra i caratteri, adatto per i linguaggi con scrittura da sinistra verso destra;
- Track left: stabilisce la spaziatura orizzontale tra i caratteri, adatto per i linguaggi con scrittura da destra verso sinistra;
- Case: imposta maiuscole e minuscole del testo, sono disponibili le opzioni Default (nessuna modifica), Caps (tutte le iniziali maiuscole), Small Caps (tutte le iniziali minuscole), Caps & Small Caps (tutto il testo maiuscolo, con le iniziali più grosse), Lowercase (tutto minuscolo), Uppercase (tutto maiuscolo) e Title (simile a Caps);
- Color: colore del testo.
Paragraph (paragrafo)
Queste opzioni sono relative principalmente al posizionamento dei vari paragrafi del testo.
- Alignment: allineamento del testo, si può scegliere tra S (Specify Start), E (End Elignment), allineamento a sinistra, centrato, a destra o giustificato;
- Indent: indentazione del testo, stabilisce la distanza tra il contenitore del testo e il primo carattere del paragrafo;
- Left e right margin: margini sinistro e destro del paragrafo;
- Space before e after: spazio (in verticale) prima e dopo il paragrafo, permette di distanzare i paragrafi tra loro.
Le rimanenti opzioni (justification rule, direction, leading basis e leading direction) tornano utili principalmente nell'uso di linguaggi asiatici, generalmente negli altri casi è consigliato lasciare le impostazioni predefinite.
Advanced character (impostazioni avanzate del carattere)
Queste opzioni permettono di personalizzare alcune caratteristiche del font usato, non è detto che tutti i font le prevedano e siano quindi influenzati da queste impostazioni; sono solitamente presenti per i font di tipo OpenType. Tutte le impostazioni seguenti possono essere impostate su uno o più caratteri.
- Digit Case: solitamente questa opzione ha effetto solo sui numeri di alcuni font, può essere impostata su "old style" (numeri solitamente più piccoli delle lettere del font e più "slanciati") oppure su Lining (i numeri sono più squadrati e hanno altezza uguale agli altri caratteri del font);
- Digit width: Tabular (tutti i numeri occupano uno stesso spazio) o Proportional (ogni numero occupa uno spazio basato sulla sua larghezza). L'opzione tabular è utile quando abbiamo bisogno che i numero composti da uno stesso numero di cifre rimangano allineati (tabelle, grafici, etc);
- Dominant e Alignment baseline: alcuni font prevedono allineamenti alternativi della linea di base del testo, solitamente questa impostazione si utilizza per i caratteri giapponesi e cinei che spesso invece di avere la baseline del testo "sotto" il carattere la hanno al centro dell'ideogramma.;
- Baseline shift: imposta la distanza del testo dalla baseline, può essere utile per creare degli effetti simili al superscript e al subscript, o ad esempio per alcune notazioni matematiche;
- Ligatures: le legature vengono usate per sostituire delle coppie di caratteri, sono disponibili solo in alcuni font, solitamente hanno lo scopo di rendere una coppia di caratteri più gradevole stilisticamente oppure più semplice da leggere. È possibile scegliere tra nessuna legatura, legatura minima, legatura comune (che è anche il valore di default), legatura non comune e legatura esotica; a seconda del font utilizzato questo parametro può non avere effetto;
- Rotation: permette di ruotare il carattere;
- Alpha: permette di impostare la trasparenza del carattere;
- Break: imposta il metodo di divisione delle parole quando è necessario andare a capo;
- Locale: indica la lingua in cui è scritto il testo.
Container (contenitore)
Queste opzioni servono per impostare il layout del testo all'interno del suo contenitore, per esempio l'allineamento verticale e il numero di colonne.
- Alignment: imposta l'allineamento verticale del testo nel suo contenitore, si può scegliere tra in alto, centrato, in basso e giustificato;
- Columns: imposta il numero di colonne in cui suddividere il testo;
- Column width: imposta la larghezza di ogni colonna;
- Gap: imposta la distanza tra le colonne;
- Geometry: queste opzioni definiscono il padding del testo (sinistra, destra, sopra e sotto), la distanza della prima linea dal contenitore e l'allineamento della baseline.
Flow (flusso)
Le opzioni di questa sezione semplicemente impostano il flusso del testo.
- Orientation: stabilisce l'orientamento orizzontale o verticale;
- Direction: imposta il testo da sinistra verso destra o viceversa;
- Line breaks: imposta se andare a capo automaticamente o solo quando viene premuto Invio;
- Vertical e horizontal scroll: consentono di abilitare, disabilitare o rendere automatiche le scrollbar verticale e orizzontale nel caso in cui il testo fosse più lungo del suo contenitore.
Altre opzioni del pannello TextLayout
Altre opzioni vengono fornite tramite la barra inferiore del pannello, che offre tre "sezioni", la prima è la sezione Data Source.
- La select a sinistra permette di impostare il testo da un file XML di esempio offerto da Adobe;
- Il pulsante Get from Stage, come abbiamo visto, consente di trasferire il testo da un componente TextLayout al pannello;
- Il pulsante Send to Stage, al contrario, invia il testo inserito nel pannello al componente TextLayout selezionato sullo stage;
- Embed Fonts permette di scegliere quale/i font includere nel proprio filmato;
- La combo appena a fianco permette di scegliere la modalità di utilizzo del testo: ReadSelect (lettura e selezione), ReadWrite (lettura e scrittura) o ReadOnly (solo lettura, senza selezione);
- Il tasto Markup ci mostrerà il codice del testo inserito nel pannello, testo che volendo potremo utilizzare via Actionscript.
La seconda sezione della barra è Links.
Molto semplicemente, una volta selezionata una o più parole potremo applicare un link indicando l'indirizzo (URL) e la finestra dentro cui aprire tale link (target).
L'ultima opzione a disposizione è Graphics.
Da questa sezione è possibile inserire un'immagine, impostandone anche larghezza e altezza. Particolarmente interessante la possibilità di inserire le immagini sulla stessa linea del testo anche in paragrafi complessi.
Conclusioni
Come abbiamo visto le opzioni offerte dal componente Text Layout sono numerosissime, e il distacco tra le operazioni che si potevano eseguire coi testi fino a Flash CS3 e quanto viene reso possibile da questo nuovo strumento è decisamente notevole; purtroppo per sfruttare il Text Layout Framework è necessaria l'ultima versione del Flash Player e questo, unito ovviamente al fatto che al momento la tecnologia sia rilasciata in versione beta, costituisce un grosso ostacolo nell'applicazione di queste novità in ambito lavorativo.
Nonostante ciò è sicuramente consigliabile cominciare a fare pratica con questo strumento che rappresenta finalmente un'evoluzione nella gestione dei testi all'interno di Flash, aspetto che da troppo tempo era rimasto invariato, attendendo una release definitiva che sarà probabilmente prerogativa di grosse innovazioni a livello di interazione e di layout di testi.
