AS3.0的元素處理（四）–styleSheet

餘二五發表於2017-11-22
S3

     styleSheet和TextFormat類似，也是用來定義文字格式的，二者實現的效果也差不多。但是，styleSheet和TextFormat之間，是存在相容衝突的，設定了styleSheet的文字，將無法再使用TextFormat類，否則編譯時會產生報錯資訊。

      那麼，這兩者之間的區別是什麼呢，我大致歸納了下，有以下幾點：

      (1) styleSheet只能對HtmlText使用，如果沒有設定該屬性則無法使用。TextFormat則不受該限制影響。

      (2) styleSheet可以通過修改外部CSS檔案來變更文字格式，不用重新編譯生成的SWF檔案，這個也是styleSheet最大的優勢。

      (3) 設定了styleSheet的文字欄位是不可以再編輯的。所以如果是一個輸入文字的話，應該避免使用styleSheet。

      由上也可以看到，CSS雖然說可以在Flash檔案中建立，但我覺得，只有外部載入的CSS檔案才有意義，否則，真的體現不出styleSheet的優勢了。同時，如果你要應用styleSheet的話，建議先看下幫助，因為Flash支援的styleSheet樣式元素並不多。

 

      下面我介紹下如何載入外部CSS檔案，首先，我們要建立一個CSS檔案，CSS檔案我就完全不懂了，所以只好抄襲一段程式碼來，大家把下面這段程式碼複製到文字檔案，然後命名為example.css，和Flash檔案放在同一個目錄下：

p {

font-family: Times New Roman, Times, _serif;

font-size: 14;

}

h1 {

font-family: Arial, Helvetica, _sans;

font-size: 20;

font-weight: bold;

}

.bluetext {

color: #0000CC;

}

 

      如果正確套用該CSS檔案，文字會呈現藍色字型。然後我們開啟Flash，寫入AS程式碼如下：

var loader:URLLoader = new URLLoader();

var req:URLRequest = new URLRequest(“example.css”);

loader.load(req);

loader.addEventListener(Event.COMPLETE, onLoaded);

function onLoaded(event:Event) {

var sheet:StyleSheet = new StyleSheet(); //定義styleSheet例項

sheet.parseCSS(loader.data); //解析外部CSS檔案

var myText:TextField = new TextField();

myText.styleSheet = sheet; //呼叫styleSheet例項

myText.htmlText = “<span class=`bluetext`>測試文字</span>”; //採用styleSheet

addChild(myText);

}

 

      最後我再做點補充說明：

      (1) 首先要建立styleSheet例項，然後用parseCSS()方法解析讀取的外部CSS檔案

      (2) 必須在設定htmlText屬性之前應用樣式表，否則CSS樣式是不會生效的。

      (3) 在htmlText檔案中呼叫CSS的方法和正式網頁中相同。

本文轉自 windtoto 51CTO部落格，原文連結：http://blog.51cto.com/windtoto/407640，如需轉載請自行聯絡原作者


相關文章