顯示文字

Flash Player 9 以及更新的版本,Adobe AIR 1.0 以及更新的版本

雖然編寫工具 (例如 Adobe Flash Builder 和 Flash Professional) 提供數個顯示文字的選項 (包含文字相關組件或文字工具),但是以程式設計方式顯示文字的最簡單方式還是透過文字欄位。

文字類型

文字欄位內的文字類型依其來源來區分特性:

  • 動態文字

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

  • 輸入文字

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

  • 靜態文字

    靜態文字只能透過 Flash Professional 建立。您無法使用 ActionScript 3.0 建立靜態文字實體。不過,您可以使用 ActionScript 類別 (例如 StaticText 和 TextSnapshot) 來處理現有靜態文字實體。如需詳細資訊,請參閱使用靜態文字

修改文字欄位內容

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

myTextField.text = "Hello World";

您也可以透過指令碼中定義的變數,將值指定給 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 標籤和實體。「Adobe® Flash® Professional CS5 的 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++; 
        } 
    } 
}