建立和顯示文字

Flash Player 10 以及更新的版本,Adobe AIR 1.5 以及更新的版本

構成 Flash 文字引擎的類別可讓您建立、格式化和控制文字。下列類別是使用 Flash 文字引擎建立和顯示文字的基本建構區塊:

  • TextElement/GraphicElement/GroupElement - 包含 TextBlock 實體的內容

  • ElementFormat - 指定 TextBlock 實體內容的格式特質

  • TextBlock - 建立文字段落的 Factory

  • TextLine - 透過 TextBlock 建立的文字行

若要顯示文字,請從 String 建立 TextElement 物件,並使用 ElementFormat 物件來指定格式特性。指定 TextElement 給 TextBlock 物件的 content 屬性。呼叫 TextBlock.createTextLine() 方法來建立要顯示的文字行。createTextLine() 方法會傳回一個 TextLine 物件,內含指定寬度可容納的最長字串。重複呼叫此方法,直到整個字串格式化為文字行。當不再需要建立文字行時,TextBlock 物件的 textLineCreationResult 屬性會指定值:TextLineCreationResult.COMPLETE。若要顯示文字行,請將它們新增到顯示清單 (並使用適當的 xy 位置值)。

例如,下列程式碼使用這些 FTE 類別來顯示 "Hello World! This is Flash Text Engine!" (使用預設格式和字體值)。在此簡單的範例中,只會建立一行文字。

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; 
        } 
    } 
}

createTextLine() 的參數會指定新的字行要從哪一個字行開始,以及字行的寬度 (像素)。開始新行的字行通常是前一行,但如果是第一行,則為 null

新增 GraphicElement 和 GroupElement 物件

您可以將 GraphicElement 物件指定給 TextBlock 物件,以顯示影像或圖形元素。從圖形或影像建立 GraphicElement 類別實體,並將該實體指定給 TextBlock.content 屬性。接著以一般方式呼叫 TextBlock.createTextline() 以建立文字行。下列範例會建立兩行文字行,其中一行含有 GraphicElement 物件,另一行含有 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; 
        } 
    } 
}
您可以建立 GroupElement 物件來建立一組 TextElement、GraphicElement 和其他 GroupElement 物件。GroupElement 可指定給 TextBlock 物件的 content 屬性。GroupElement() 建構函式的參數是 Vector,可指向組成群組的文字、圖形和群組元素。下列範例會將兩個圖形元素和一個文字元素組成群組,並將它們指定為文字區塊的一個單位。
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; 
        } 
    } 
}

取代文字

呼叫 TextElement.replaceText() 以取代在 TextElement 中指定給 TextBlock.content 屬性的文字,即可取代 TextBlock 實體中的文字。

下列範例使用 replaceText(),先將文字插入行首,接著將文字附加至行尾,最後取代行中的文字。
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); 
        } 
    } 
}

replaceText() 方法會以 newText 參數所指定的文字來取代 beginIndexendIndex 參數所指定的文字。如果 beginIndexendIndex 參數的值相同,則 replaceText() 會將指定的文字插入該位置。否則,它會以新文字取代 beginIndexendIndex 所指定的字元