Creazione e visualizzazione di testo

Flash Player 10 e versioni successive, Adobe AIR 1.5 e versioni successive

Le classi che compongono Flash Text Engine consentono di creare, formattare e controllare il testo. Le classi seguenti sono i gli elementi di base per la creazione e la visualizzazione del testo mediante Flash Text Engine:

  • TextElement/GraphicElement/GroupElement: racchiudono il contenuto di un'istanza TextBlock

  • ElementFormat: specifica gli attributi di formattazione del contenuto di un'istanza TextBlock

  • TextBlock: factory con cui creare un paragrafo di testo

  • TextLine: riga di testo creata da TextBlock

Per visualizzare del testo, create un oggetto TextElement da una String, utilizzando un oggetto ElementFormat per specificare le caratteristiche di formattazione. Assegnate il TextElement alla proprietà content di un oggetto TextBlock. Create le righe di testo da visualizzare chiamando il metodo TextBlock.createTextLine() . Il metodo createTextLine() restituisce un oggetto TextLine contenente tanta stringa quanta può essere contenuta nella larghezza specificata. Chiamate il metodo ripetutamente fino a quando la stringa non è stata formatta in righe. Quando non ci sono più righe da creare, alla proprietà textLineCreationResult dell'oggetto TextBlock viene assegnato il valore: TextLineCreationResult.COMPLETE . Per visualizzare le righe, aggiungetele all'elenco di visualizzazione (con i valori di posizione x e y appropriati).

Il codice riportato di seguito, ad esempio, utilizza queste classi FTE per visualizzare "Hello World! This is Flash Text Engine!", utilizzando valori predefiniti per il formato e i caratteri. In questo semplice esempio, viene creata una sola riga di testo.

package 
{ 
    import flash.text.engine.*; 
    import flash.display.Sprite; 
     
    public class HelloWorldExample extends Sprite 
    { 
        public function HelloWorldExample() 
        { 
            var str = "Hello World! This is Flash Text Engine!"; 
            var format:ElementFormat = new ElementFormat(); 
            var textElement:TextElement = new TextElement(str, format); 
            var textBlock:TextBlock = new TextBlock(); 
            textBlock.content = textElement; 
             
            var textLine1:TextLine = textBlock.createTextLine(null, 300); 
            addChild(textLine1); 
            textLine1.x = 30; 
            textLine1.y = 30; 
        } 
    } 
}

I parametri di createTextLine() specificano la riga da cui iniziare la nuova riga e la larghezza in pixel della riga stessa. La riga da cui inizia la nuova riga è in genere la riga precedente, ma nel caso della prima riga è null .

Aggiunta di oggetti GraphicElement e GroupElement

È possibile assegnare un oggetto GraphicElement a un oggetto TextBlock per visualizzare un'immagine o un elemento grafico. È sufficiente creare un'istanza della classe GraphicElement da un oggetto grafico o da un'immagine e assegnare l'istanza alla proprietà TextBlock.content . Per creare la riga di testo, chiamare TextBlock.createTextline() nel modo consueto. Nell'esempio seguente vengono create due righe di testo, una con un oggetto GraphicElement e una con un oggetto TextElement.
package 
{ 
    import flash.text.engine.*; 
    import flash.display.Sprite; 
    import flash.display.Shape; 
    import flash.display.Graphics; 
 
    public class GraphicElementExample extends Sprite 
    { 
        public function GraphicElementExample() 
        { 
            var str:String = "Beware of Dog!"; 
     
            var triangle:Shape = new Shape(); 
            triangle.graphics.beginFill(0xFF0000, 1); 
            triangle.graphics.lineStyle(3); 
            triangle.graphics.moveTo(30, 0); 
            triangle.graphics.lineTo(60, 50); 
            triangle.graphics.lineTo(0, 50); 
            triangle.graphics.lineTo(30, 0); 
            triangle.graphics.endFill(); 
     
            var format:ElementFormat = new ElementFormat(); 
            format.fontSize = 20; 
             
            var graphicElement:GraphicElement = new GraphicElement(triangle, triangle.width, triangle.height, format); 
            var textBlock:TextBlock = new TextBlock(); 
            textBlock.content = graphicElement; 
            var textLine1:TextLine = textBlock.createTextLine(null, triangle.width); 
            textLine1.x = 50; 
            textLine1.y = 110; 
            addChild(textLine1); 
     
            var textElement:TextElement = new TextElement(str, format); 
            textBlock.content = textElement; 
            var textLine2 = textBlock.createTextLine(null, 300); 
            addChild(textLine2); 
            textLine2.x = textLine1.x - 30; 
            textLine2.y = textLine1.y + 15; 
        } 
    } 
}
Potete creare un oggetto GroupElement per creare un gruppo di oggetti TextElement, GraphicElement e altri oggetti GroupElement. Un oggetto GroupElement può essere assegnato alla proprietà content di un oggetto TextBlock. Il parametro della funzione di costruzione GroupElement() è un Vector, che contiene un riferimento agli elementi di testo, grafica e gruppo che compongono il gruppo. Nell'esempio seguente, due elementi grafici e un elemento testuale vengono raggruppati e assegnati come unità a un blocco di testo.
package 
{ 
    import flash.text.engine.*; 
    import flash.display.Sprite; 
    import flash.display.Shape; 
    import flash.display.Graphics; 
     
    public class GroupElementExample extends Sprite 
    { 
        public function GroupElementExample() 
        { 
            var str:String = "Beware of Alligators!"; 
 
            var triangle1:Shape = new Shape(); 
            triangle1.graphics.beginFill(0xFF0000, 1); 
            triangle1.graphics.lineStyle(3); 
            triangle1.graphics.moveTo(30, 0); 
            triangle1.graphics.lineTo(60, 50); 
            triangle1.graphics.lineTo(0, 50); 
            triangle1.graphics.lineTo(30, 0); 
            triangle1.graphics.endFill(); 
             
            var triangle2:Shape = new Shape(); 
            triangle2.graphics.beginFill(0xFF0000, 1); 
            triangle2.graphics.lineStyle(3); 
            triangle2.graphics.moveTo(30, 0); 
            triangle2.graphics.lineTo(60, 50); 
            triangle2.graphics.lineTo(0, 50); 
            triangle2.graphics.lineTo(30, 0); 
            triangle2.graphics.endFill(); 
             
            var format:ElementFormat = new ElementFormat(); 
            format.fontSize = 20; 
            var graphicElement1:GraphicElement = new GraphicElement(triangle1, triangle1.width, triangle1.height, format); 
            var textElement:TextElement = new TextElement(str, format); 
            var graphicElement2:GraphicElement = new GraphicElement(triangle2, triangle2.width, triangle2.height, format); 
            var groupVector:Vector.<ContentElement> = new Vector.<ContentElement>(); 
            groupVector.push(graphicElement1, textElement, graphicElement2); 
            var groupElement = new GroupElement(groupVector); 
            var textBlock:TextBlock = new TextBlock(); 
            textBlock.content = groupElement; 
            var textLine:TextLine = textBlock.createTextLine(null, 800); 
            addChild(textLine); 
            textLine.x = 100; 
            textLine.y = 200; 
        } 
    } 
}

Sostituzione del testo

È possibile sostituire il testo in un'istanza TextBlock chiamando TextElement.replaceText() per la sostituzione del testo nel TextElement assegnato alla proprietà TextBlock.content .

Nell'esempio seguente viene utilizzato repaceText() per inserire del testo all'inizio della riga, quindi aggiungere testo alla fine della riga e, infine, sostituire testo al centro della riga.
package 
{ 
    import flash.text.engine.*; 
    import flash.display.Sprite; 
 
    public class ReplaceTextExample extends Sprite 
    { 
        public function ReplaceTextExample() 
        { 
     
            var str:String = "Lorem ipsum dolor sit amet"; 
            var fontDescription:FontDescription = new FontDescription("Arial"); 
            var format:ElementFormat = new ElementFormat(fontDescription); 
            format.fontSize = 14; 
            var textElement:TextElement = new TextElement(str, format); 
            var textBlock:TextBlock = new TextBlock(); 
            textBlock.content = textElement; 
            createLine(textBlock, 10); 
            textElement.replaceText(0, 0, "A text fragment: ");  
            createLine(textBlock, 30);  
            textElement.replaceText(43, 43, "...");   
            createLine(textBlock, 50);     
            textElement.replaceText(23, 28, "(ipsum)"); 
            createLine(textBlock, 70); 
        } 
             
        function createLine(textBlock:TextBlock, y:Number):void { 
            var textLine:TextLine = textBlock.createTextLine(null, 300); 
            textLine.x = 10; 
            textLine.y = y; 
            addChild(textLine); 
        } 
    } 
}

Il metodo replaceText() sostituisce il testo specificato dai parametri beginIndex e endIndex con il testo specificato dal parametro newText . Se i valori dei parametri beginIndex e endIndex sono identici, replaceText() inserisce il testo specificato in tale posizione. In caso contrario, sostituisce i caratteri specificati da beginIndex e endIndex con il nuovo testo.