當前位置:開發者網絡 >> 技術教程 >> 網頁設計 >> Flash >> 內容
精彩推薦
分類最新教程
分類熱點教程
    
Flash MX 2004新特性實例學習五
作者:未知
日期:2005-04-30
人氣:
投稿:(轉貼)
來源:未知
字體:
收藏:加入瀏覽器收藏
以下正文:

    實例六、Text Enhancements

  一、涉及特性

  在實例中,主要涉及在Flash MX 2004中引用和顯示外部的css文件和html文件。這些都是在Flash MX 2004中才有的新特性,應用也非常方便。本實例在Flash MX 2004中的操作非常簡單,不過這正從側面反映了它的功能強大。

  二、製作過程

  1、建立一個文件,命名為sample.css。其內容如下:   

  headline {

   font-family: Arial,Helvetica,sans-serif;

   font-size: 16px;

   font-weight: bold;

   display: block;

  }

  subheadline {

   font-family: Arial,Helvetica,sans-serif;

   font-size: 13px;

   font-weight: bold;

   display: block;

  }

  mainBody {

   font-family: Arial,Helvetica,sans-serif;

   font-size: 10px;

   display: block;

  }

  biline {

   font-family: Arial,Helvetica,sans-serif;

   font-size: 11px;

   font-style: italic;

   display: inline;

  }

  A {

   font-family: Arial,Helvetica,sans-serif;

   color:cccccc;

   font-size: 10px;

   display: inline;

   text-decoration:underline;

  }

  上面的css文件中,中括號裡面的是對應的屬性。比如font-family是字符集,font-size是字體大小,display是字體的顯示方式,等等。只要有簡單的網頁製作知識就應該可以看懂的。

  2、新建一個文件,命名為sample.html,其內容如下:   

   Giant Sea Lion Spotted

   Citizens scared, amazed   

  Today - Our City A giant sea lion was spotted today rampaging around the city's main square, scaring thousands of innocent people just out for a daily stroll in the beautiful downtown district.

  No injuries were reported after the animal's two-hour assault of the shopping district famous for it's sea lion purses and shoes, also known as the "sea lion district". Witnesses said the creature came out of the ocean near the Burger King at 42nd and 1st Avenue, startling many and stalling traffic.

  "The animal caused nearly four million dollars of damage to the neighborhood," said Joseph Valente, owner of "Sea Lions R' Us" at 43rd and 2nd. Onlookers to the scene said that the sea lion appeared ornery, but otherwise in good spirits.

  Officials are uncertain as to when, if ever, the sea lion may return.Click here for more.   

  這個文件的內容是應用了前面所創建的css格式的html文件。(嚴格來說,此文件更像是一個xml文件。)

    3、將一個名為sample.jpg的圖片放到跟第一、二步所創建的文件的同一目錄中。

  4、新建一個Flash MX 2004的文件,保存在跟前面所創建的文件所在的目錄中。

  5、用文本工具在場景中拉一個文本輸入框,命名為content。在屬性面板上設置如1所示。

  6、在TimeLine中新建一個圖層,命名為Action,在此層的Action面板上面增加如下語句:  

  /* Copyright 2003 Macromedia, Inc. All rights reserved.

  The following is Sample Code and is subject to all restrictions

  on such code as contained in the End User License Agreement

  accompanying this product.

  */   

  var ss:TextField.StyleSheet = new TextField.StyleSheet(); //註釋1

  ss.load("sample.css"); //註釋2

  content.styleSheet = ss; //註釋3

  content.multiline= true;

  content.wordWrap = true;

  content.html = true;   

  story = new XML(); //註釋4

  story.ignoreWhite = true;

  story.load("sample.html"); //註釋5

  story.onLoad = function () { //註釋6

   content.htmlText = story;

  }

      註釋1:定義一個變量ss,它的類型為TextField.StyleSheet。

    註釋2:讀取sample.css文件的內容到ss中。這裡要注意所有文件的保存路徑要一致。

    註釋3:設置文本框content的幾個屬性。

    註釋4:創建一個xml對象。

    註釋5:讀入sample.html文件的內容到story中。

    註釋6:設置story的onLoad函數,函數的內容為設置content的htmlText為story。

  三、實際用途

  從實例的製作過程中可以看到,以前在Flash中一行一行地調整文字顯示效果的時候再也不會出現。Flash MX 2004中操作HTML文件非常靈活,修改顯示效果也很方便,只要改一下相應的文件內容就可以了。這在用Flash來做比較多的文字顯示處理的場景中非常有用。

相關文章: