顯示文字



雖然編寫工具 (如 Adobe Flex Builder 和 Flash 編寫工具) 可提供一些用於顯示文字的選項 (其中包括文字相關的組件或文字工具),但是以程式設計方式顯示文字的主要方法則是透過文字欄位來完成。

文字的類型

文字欄位內的文字類型是依據它的來源來區分特徵:

  • 動態文字

    動態文字包括從外部來源 (例如文字檔案、XML 檔案,或甚至包括遠端網路服務) 載入的內容。

  • 輸入文字

    輸入文字是指使用者輸入的任何文字,或是使用者可以編輯的動態文字。您可以設定樣式表來格式化輸入的文字,或使用 flash.text.TextFormat 類別為輸入內容的文字欄位指定屬性。如需詳細資訊,請參閱擷取文字輸入

  • 靜態文字

    只能使用編寫工具才能建立靜態文字。您不能使用 ActionScript 3.0 來建立靜態文字實體,但是您可以使用 ActionScript 類別 (如 StaticText 和 TextSnapshot) 來操作現有的靜態文字實體。如需詳細資訊,請參閱使用靜態文字

修改文字欄位內容

您可以將字串指定給 flash.text.TextField.text 屬性,以定義動態文字。您可以直接將字串指定給屬性,如下所示:

myTextField.text = "Hello World";

您也可以透過 Script 中定義的變數,將值指定給 text 屬性,如下列範例所示:

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
 
    public class TextWithImage extends Sprite 
    { 
        private var myTextBox:TextField = new TextField(); 
        private var myText:String = "Hello World"; 
 
        public function TextWithImage() 
        { 
            addChild(myTextBox); 
            myTextBox.text = myText; 
        } 
    } 
}

或者,您可以透過遠端變數將值指定給 text 屬性。從遠端來源載入文字值有三種方式:

  • flash.net.URLLoader 和 flash.net.URLRequest 類別可以從本機或遠端位置載入文字的變數。

  • FlashVars 特質是內嵌於裝載 SWF 檔的 HTML 網頁中,並且可以包含文字變數的值。

  • flash.net.SharedObject 類別可以管理值的持續儲存位置。如需詳細資訊,請參閱儲存本機資料

顯示 HTML 文字

flash.text.TextField 類別具有 htmlText 屬性,您可以利用它將文字字串識別為包含 HTML 標籤的文字字串,以便對內容進行格式化。如下列範例中所示,您必須將字串值指定給 htmlText 屬性 (而不是 text 屬性),Flash Player 或 AIR 才會以 HTML 格式顯示文字:

var myText:String = "<p>This is <b>some</b> content to <i>render</i> as <u>HTML</u> text.</p>"; 
myTextBox.htmlText = myText;

Flash Player 和 AIR 支援 htmlText 屬性之 HTML 標籤的子集和實體。「ActionScript 3.0 語言和組件參考」中的 flash.text.TextField.htmlText 屬性描述,提供有關支援的 HTML 標籤與實體之詳細資訊。

一旦您使用 htmlText 屬性指定內容後,就可以使用樣式表或 textformat 標籤來管理內容的格式化作業。如需詳細資訊,請參閱格式化文字

在文字欄位中使用影像

以 HTML 文字來顯示內容的另一項好處,就是您可以將影像包含在文字欄位中。您可以使用 img 標籤參考本機或遠端影像,並且讓它出現在相關的文字欄位內。

下列範例將建立名為 myTextBox 的文字欄位,並在顯示的文字中嵌入一個眼睛的 JPG 影像,此影像是儲存在與 SWF 檔相同的目錄中:

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
 
    public class TextWithImage extends Sprite 
    { 
        private var myTextBox:TextField; 
        private var myText:String = "<p>This is <b>some</b> content to <i>test</i> and <i>see</i></p><p><img src='eye.jpg' width='20' height='20'></p><p>what can be rendered.</p><p>You should see an eye image and some <u>HTML</u> text.</p>"; 
 
        public function TextWithImage() 
        { 
            myTextBox.width = 200; 
            myTextBox.height = 200; 
            myTextBox.multiline = true; 
            myTextBox.wordWrap = true; 
            myTextBox.border = true; 
 
            addChild(myTextBox); 
            myTextBox.htmlText = myText; 
        } 
    } 
}

img 標籤支援 JPEG、GIF、PNG 和 SWF 檔。

捲動文字欄位中的文字

在許多情況下,您的文字會超出文字欄位可以顯示的文字長度。或是,您的輸入欄位允許使用者輸入的文字超出一次可以顯示的文字長度。您可以使用 flash.text.TextField 類別中與捲動相關的屬性來管理過長的內容,包括垂直或水平捲動。

與捲動相關的屬性包括 TextField.scrollVTextField.scrollHmaxScrollVmaxScrollH。您可以使用這些屬性回應事件,例如按一下滑鼠或按下按鍵。

下列範例將建立固定大小的文字欄位,其中包含的文字超出欄位一次可以顯示的長度。當使用者按一下文字欄位時,文字便會垂直捲動。

package 
{ 
    import flash.display.Sprite; 
    import flash.text.*; 
    import flash.events.MouseEvent; 
 
    public class TextScrollExample extends Sprite 
    { 
        private var myTextBox:TextField = new TextField(); 
        private var myText:String = "Hello world and welcome to the show. It's really nice to meet you. Take your coat off and stay a while. OK, show is over. Hope you had fun. You can go home now. Don't forget to tip your waiter. There are mints in the bowl by the door. Thank you. Please come again."; 
 
        public function TextScrollExample() 
        { 
            myTextBox.text = myText; 
            myTextBox.width = 200; 
            myTextBox.height = 50; 
            myTextBox.multiline = true; 
            myTextBox.wordWrap = true; 
            myTextBox.background = true; 
            myTextBox.border = true; 
 
            var format:TextFormat = new TextFormat(); 
            format.font = "Verdana"; 
            format.color = 0xFF0000; 
            format.size = 10; 
 
            myTextBox.defaultTextFormat = format; 
            addChild(myTextBox); 
            myTextBox.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownScroll); 
        } 
 
        public function mouseDownScroll(event:MouseEvent):void 
        { 
            myTextBox.scrollV++; 
        } 
    } 
}