DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁製作工具 >> Fireworks入門知識 >> Fireworks基礎 >> FWMX系列:數據驅動圖形向導 [1] (1)
FWMX系列:數據驅動圖形向導 [1] (1)
編輯:Fireworks基礎     

數據驅動圖形向導是從MX版本開始出現的一項強勁功能。
這個程序是由Dearmweaver和Fireworks聖經系列叢書的作者Joseph Lowery開發的,
在FWMX內是1.00版,到了FWMX 2004時升級到了2.00版,
並由aftershape.com的站長Edoardo Zubler強化了界面設計和一些附屬程序。

研究過FW數據驅動圖形向導功能的朋友相信不多,
既便是FW自帶的幫助文件和MM的官方網站做功能介紹時也只是一筆帶過。
但是這個功能確實是FW的一大利器,
而且在Fireworks MX 2004推出之際,Macromedia再度聲明這一功能得到改進,
到底怎麼樣,就讓我們一起來實戰一次並且來個詳細對照吧。

在這個實例中,我們使用了一張白色的襯衫做基本素材,

以及一組漂亮的圖標做襯衫的替換標誌。

FW的數據驅動圖形向導必需有一個標准的XML文件作為數據來源,
這個XML文件可以由任何文本編輯器編寫、由ColdFusion生成或是由軟件輸出來產生。
我們在這裡根據准備替換的圖標先寫了一個,命名為datasource.XML,內容如下:

<?XML version="1.0" encoding="iso-8859-1"?>
<items>

 <item>
  <subject></subject>
  <pic>icon1.jpg</pic>
  <linkage>http://www.msn.com</linkage>
 </item>

 <item>
  <subject>Music</subject>
  <pic>icon2.jpg</pic>
  <linkage>http://www.music.com</linkage>
 </item>

 <item>
  <subject>Software</subject>
  <pic>icon3.jpg</pic>
  <linkage>http://www.soft.com</linkage>
 </item>

 <item>
  <subject>Earth</subject>
  <pic>icon4.jpg</pic>
  <linkage>http://www.internet.com</linkage>
 </item>

 <item>
  <subject>Search</subject>
  <pic>icon5.jpg</pic>
  <linkage>http://www.google.com</linkage>
 </item>

</items>

    

這裡可以看到,XML的標簽都是可以自定義的。
其中的subject、pic、linkage,將成為我們數據驅動圖形向導的變量標簽。
XML的書寫格式標准和注意事項請參閱相關文檔,這裡就不贅述了。


XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved