作者：easyinfonet
email: easyinfonet@sina.com.cn
日期：2001-2-16 11:27:31
3.3 NetObjects Fusion
    NetObject Fusion是一個(gè)可視化的Web站點(diǎn)的構(gòu)建和管理工具。NetObjects Fusion是Web站點(diǎn)構(gòu)建過(guò)程的中心。NetObjects Fusion是一個(gè)面向站點(diǎn)的工具，而不是僅僅處理單個(gè)頁(yè)面。在Web站點(diǎn)開(kāi)發(fā)的過(guò)程中，會(huì)創(chuàng)建許多頁(yè)面，頁(yè)面之間有很多鏈接。手工地更改這個(gè)結(jié)構(gòu)是相當(dāng)困難的。用NetObjects Fusion可以設(shè)計(jì)Web站點(diǎn)的通用元素，創(chuàng)建并維護(hù)Web站點(diǎn)的結(jié)構(gòu)，構(gòu)建各個(gè)頁(yè)面，并能容易地維護(hù)這些頁(yè)面。
總之，使用NetObject Fusion，可以設(shè)計(jì)Web站點(diǎn)、構(gòu)建各個(gè)頁(yè)面、容易地維護(hù)Web站點(diǎn)。下面介紹NetObject Fusion 中的站點(diǎn)視圖（Site view）、頁(yè)面視圖（Page view）、樣式視圖（Style view）、對(duì)象集視圖（Assets View、或稱資源視圖）、和發(fā)布視圖（Publishing view）。
    1．站點(diǎn)視圖
    站點(diǎn)的結(jié)構(gòu)視圖（參見(jiàn)圖3-1）是站點(diǎn)視圖的一種，單擊“輪廓視圖”標(biāo)簽就顯示站點(diǎn)的輪廓視圖。在結(jié)構(gòu)視圖中，頁(yè)面的顏色是可以由開(kāi)發(fā)者選擇，通常用來(lái)為頁(yè)面分組，但是頁(yè)面顏色對(duì)實(shí)際頁(yè)面沒(méi)有影響。用戶站點(diǎn)的文件格式為“*.nod”，模板文件格式為“*.nft”， 樣式文件格式為“*.ssf”。使用站點(diǎn)視圖，可以創(chuàng)建（或修改）一個(gè)站點(diǎn)的層次結(jié)構(gòu)、操縱頁(yè)面、引入/導(dǎo)出（Import/Export）站點(diǎn)、引入模板以改變站點(diǎn)的風(fēng)格、打印站點(diǎn)的結(jié)構(gòu)圖等等。例如，可以引入一個(gè)已有的站點(diǎn)將它轉(zhuǎn)成NetObjects Fusion的格式或保留為外部HTML頁(yè)面。如果這些被引入的頁(yè)面不會(huì)被改變，通常可以將引入的頁(yè)面保留為外部HTML頁(yè)面。
圖3-1：站點(diǎn)視圖

    2．頁(yè)面視圖
站點(diǎn)的頁(yè)面視圖（見(jiàn)圖3-2）包括頁(yè)面布局（Page Layout）和主控邊框（MasterBorder），并提供面板和工具欄。面板包括屬性面板和對(duì)象樹(shù)，工具欄包括標(biāo)準(zhǔn)工具欄、表單工具欄、組件工具欄、和高級(jí)工具欄。對(duì)象樹(shù)是關(guān)于當(dāng)前頁(yè)面中所有對(duì)象的樹(shù)狀結(jié)構(gòu)，開(kāi)發(fā)者可以通過(guò)對(duì)象樹(shù)來(lái)定位目標(biāo)對(duì)象，也可以直接選擇目標(biāo)對(duì)象。一旦選定目標(biāo)對(duì)象，屬性面板就顯示該對(duì)象的屬性，對(duì)象屬性依賴于對(duì)象的類型，不同類型的對(duì)象（如文本和applet）有不同的屬性，可以使用屬性面板來(lái)設(shè)置對(duì)象屬性，當(dāng)然有的屬性可以可視地編輯。
在頁(yè)面視圖中，可以可視地或通過(guò)屬性面板來(lái)定義主控邊框和頁(yè)面布局。主控邊框勾畫(huà)出一個(gè)頁(yè)面的五個(gè)區(qū)域：中間的布局區(qū)域和四個(gè)（左、右、上、下）邊緣區(qū)域。這些邊緣區(qū)域包含多個(gè)頁(yè)面共有的元素，如水平標(biāo)注和導(dǎo)航條，可以通過(guò)屬性面板設(shè)置主控邊框的自動(dòng)邊框（AutoFrame）屬性，把某些邊緣設(shè)置成框架（frame）。關(guān)于布局，而布局區(qū)域用來(lái)放置該頁(yè)面的內(nèi)容。需要注意的是頁(yè)面布局包括頁(yè)面的實(shí)際內(nèi)容，不僅僅是頁(yè)面的布局，也許一個(gè)頁(yè)面有好幾個(gè)布局或版本，例如有框架（frame）的和沒(méi)有框架的版本。NetObjects Fusion使用表格（table）來(lái)組織它生成的HTML頁(yè)的內(nèi)容，也可以通過(guò)設(shè)置布局屬性來(lái)選擇布局是表單。也可以通過(guò)彈出菜單或單擊屬性面板中的“HTML”按扭在來(lái)顯示生成的HTML文檔。
圖3-2  頁(yè)面視圖
工具欄通常在窗口的邊上，也可以拖進(jìn)窗口里面（如圖3-2）。工具欄包括標(biāo)準(zhǔn)工具欄、表單工具欄、組件工具欄、和高級(jí)工具欄。這些工具欄為頁(yè)面的制作提供了許多實(shí)用工具。
	(1) 標(biāo)準(zhǔn)工具條
   = 選擇（Select）：選擇一個(gè)特定的組件并移到另一個(gè)地點(diǎn)或重新設(shè)置大小。
   = 縮放（Zoom In/Out）：使頁(yè)面的視圖圍繞鼠標(biāo)擊中的區(qū)域放大或縮小。
   = 文本（Text）：向頁(yè)面增加一個(gè)包含一些文本的組件。
   = 圖片（Picture）：向頁(yè)面增加一個(gè)圖片。可以是一個(gè).gif或.jpg文件。Fusion接受BMP，PCX，PICT，GIF，JPEG的圖。
   = 熱點(diǎn)（Hotspots）：把一個(gè)圖片中的某個(gè)區(qū)域標(biāo)記為可單擊（鏈接到某個(gè)URL），從而使該區(qū)域成為熱點(diǎn)。這個(gè)區(qū)域可以是圓形、矩形、和多邊形
   = 布局區(qū)域（Layout Region）：在布局區(qū)域或主控邊框里創(chuàng)建一個(gè)布局區(qū)域，它可以擁有與包含元素不同的布局屬性（例如，一個(gè)不同的背景色）。
   = 表格（Table）：創(chuàng)建一個(gè)HTML表格，可以規(guī)定表格的行數(shù)和列數(shù)。
   = 表單區(qū)域（Form Area）：創(chuàng)建一個(gè)或多個(gè)表單。可以選擇創(chuàng)建基于布局區(qū)域的表單、基于表格的表單、或基于文本的表單。也可以把一個(gè)表單加到邊緣區(qū)域，從而能在多個(gè)頁(yè)面里顯示。
   = 導(dǎo)航條（Navigation Bar）：用來(lái)創(chuàng)建導(dǎo)航條。可以使用按鈕或文字形式，從當(dāng)前頁(yè)面鏈向站點(diǎn)里的別的頁(yè)面，比如在Web站點(diǎn)結(jié)構(gòu)里的父層、當(dāng)前層或子層。
   = 水平標(biāo)注（Banner）。用來(lái)在頁(yè)面的任何地方創(chuàng)建一個(gè)水平標(biāo)注，反映這個(gè)頁(yè)面的名字。通常在頁(yè)面的頂部，來(lái)標(biāo)志這個(gè)頁(yè)面。
   = 繪制（Draw）：繪制工具，這些工具用來(lái)在一個(gè)頁(yè)面里畫(huà)圓形、矩形、圓角矩形和多邊形。
   = 直線（Line）：畫(huà)直線的工具，這些工具用來(lái)在一個(gè)頁(yè)面里畫(huà)水平線、任意角度的在線、站點(diǎn)樣式的水平線。
    需要注意的是Hotspots、Draw、Line這三個(gè)工具還包括可選的子工具，按下按扭不放就會(huì)顯示可選的子工具，保持按下按扭并移動(dòng)就可選擇所要的工具。
   (2) 表單工具欄
    這些工具用來(lái)創(chuàng)建表單。表單可以用來(lái)收集信息，然后送回服務(wù)器端CGI程序或Java Servlet。
   = 表單按扭（Button）：一個(gè)表單按鈕通常被用來(lái)啟動(dòng)一個(gè)后端服務(wù)程序或來(lái)重置表單。
   = 表單復(fù)選框（Check Box）：一個(gè)復(fù)選框代表一個(gè)布爾值，選中表示真值，否則表示假。
   = 表單單選按扭（Radio Button）：一個(gè)單選按鈕是一組單選按扭的一部分，這組單選按扭是互斥的，即只能有一個(gè)為真，而別的都為假互斥的。
   = 表單編輯字段（Edit Field）：表單上的一個(gè)區(qū)域，用戶可以輸入一行信息如名或姓。
   = 表單多行文本（Multi-Line）：表單上的一個(gè)區(qū)域，用戶可以輸入多行信息，如對(duì)一個(gè)產(chǎn)品的說(shuō)明或目錄里的一項(xiàng)。
   = 表單組合框（Combo box）：一個(gè)下拉列表，用戶可以選擇。一個(gè)例子是：頭發(fā)顏色的列表。用戶可以選一個(gè)。
   (3) 組件工具欄
	= 動(dòng)態(tài)按扭（DynaButtons）：對(duì)按鈕使用站點(diǎn)風(fēng)格
	= 磁帶（Ticker Tape）：一個(gè)水平滾動(dòng)文字區(qū)域，不斷重復(fù)。
	= 站點(diǎn)映射器（Site Mapper）：一個(gè)用來(lái)顯示站點(diǎn)結(jié)構(gòu)的按扭。
	= 消息板（Message Board）：一個(gè)BBS 設(shè)施
	= 表單句柄（Form Handler）：實(shí)現(xiàn)一個(gè)簡(jiǎn)單的CGI程序。用來(lái)檢查表單中的字段
	= 圖片反轉(zhuǎn)（Picture Rollover）：一個(gè)反轉(zhuǎn)按扭。當(dāng)鼠標(biāo)滾過(guò)圖片，圖片改變成指定的圖片反轉(zhuǎn)。當(dāng)= 鼠標(biāo)在圖片上單擊，圖片會(huì)改變，一個(gè)URL鏈接會(huì)顯示。
	= 基于時(shí)間的圖片（Time Based Picture）：在這個(gè)地點(diǎn)的不同時(shí)間顯示不同的圖。
	= 圖片加載器（Picture Loader）：使用其它資源中的圖片
	= 旋轉(zhuǎn)圖片（Rotating Picture）：簡(jiǎn)單動(dòng)畫(huà)。通常用來(lái)顯示廣告。
   (4)高級(jí)工具欄
	= Media：一個(gè)子工具條，包括了一些項(xiàng)目象Shockwave、Quicktime、Video、Sound和別的插件
	= Java：允許往頁(yè)面上加一個(gè)Java applet。
	= ActiveX Control：允許往頁(yè)面上加一個(gè)ActiveX控件。
	= Data：一個(gè)子工具條，允許你訪問(wèn)內(nèi)部和外部數(shù)據(jù)對(duì)象。
	= External HTML：包括一些需要特殊的、手工寫(xiě)的HTML頁(yè)面。可以在外部引用HTML文件并把
它們放在站點(diǎn)的任何地方，而不是引入并轉(zhuǎn)換這個(gè)HTML。NetObjects Fusion在發(fā)布Web站點(diǎn)時(shí)不分析這個(gè)HTML。
    上述工具欄提供的有關(guān)工具可用來(lái)增加頁(yè)面的互動(dòng)性。如可以在頁(yè)面上增加腳本、放置ActiveX控件、增加Java applets等等。腳本可以加到一個(gè)Fusion生成的HTML元素的前面、后面或里面。增加Java applets時(shí)使用Java對(duì)象屬性設(shè)置有關(guān)參數(shù)，F(xiàn)usion將增加的class文件作為對(duì)象集(assets)中的元素。
    3．樣式視圖
樣式視圖（參見(jiàn)圖3-3）可用來(lái)選擇站點(diǎn)樣式、編輯樣式、或創(chuàng)建新的樣式。Fusion提供的樣式適合于簡(jiǎn)單的站點(diǎn)或者可用來(lái)取得用戶的反饋信息，重要的站點(diǎn)通常需要?jiǎng)?chuàng)建新的樣式。Fusion用樣式中指定的字體生成水平標(biāo)注和按鈕上的文字。因此，應(yīng)該為水平標(biāo)注和按鈕選擇任何你的系統(tǒng)里的字體，F(xiàn)usion將使用指定的字體生成有關(guān)圖象，瀏覽器只看到一個(gè)圖象。對(duì)于在HTML里創(chuàng)建的文字組件，瀏覽器可以控制自己使用的字體。
圖3-3：樣式視圖

4.	對(duì)象集視圖
對(duì)象集視圖（參見(jiàn)圖3-4）是一個(gè)管理所有對(duì)象的地方，包括文件、鏈接、數(shù)據(jù)對(duì)象、變量，對(duì)象通過(guò)別名來(lái)訪問(wèn)。Fusion提供預(yù)定義的變量，如日期、時(shí)間和站點(diǎn)名等等。開(kāi)發(fā)者可以創(chuàng)建自己的變量，并在對(duì)象集視圖中管理。每當(dāng)開(kāi)發(fā)者需要選擇圖象或別的文件時(shí)，打開(kāi)文件對(duì)話框（Open File dialog）上會(huì)有一個(gè)對(duì)象集標(biāo)簽（Assets tab），單擊該標(biāo)簽就顯示對(duì)象集中的有關(guān)文件，開(kāi)發(fā)者就可以選擇所需要的文件。這種就對(duì)象進(jìn)行統(tǒng)一管理的方式支持“一次更新，每個(gè)地方都更新”。例如標(biāo)識(shí)公司的圖案（logo），如果一個(gè)公司改變了它的標(biāo)識(shí)圖案，只要在對(duì)象集視圖中改變有關(guān)標(biāo)識(shí)圖案的文件，F(xiàn)usion可以改變這個(gè)站點(diǎn)里的每一頁(yè)。

圖3-4：對(duì)象集視圖

5．發(fā)布視圖
發(fā)布視圖（參見(jiàn)圖3-5）用來(lái)配置發(fā)布選項(xiàng)，并進(jìn)行發(fā)布。發(fā)布選項(xiàng)包括本地發(fā)布位置和遠(yuǎn)程發(fā)布位置等。本地發(fā)布是指發(fā)布到本機(jī)的文件系統(tǒng)里，遠(yuǎn)程發(fā)布需要使用FTP把文件傳輸?shù)椒?wù)器。如果你選擇發(fā)布到一個(gè)遠(yuǎn)程站點(diǎn)，這個(gè)站點(diǎn)必須支持FTP，發(fā)布者必須知道所需的用戶名和口令。通常在正式發(fā)布之前需要發(fā)布到一個(gè)臨時(shí)服務(wù)器上進(jìn)行測(cè)試，并需要使用不同平臺(tái)上的不同瀏覽器進(jìn)行測(cè)試。發(fā)布時(shí)，F(xiàn)usion將生成HTML頁(yè)面以及目錄結(jié)構(gòu)，拷貝所有的對(duì)象到指定的目錄，這些目錄里包含HTML文件、圖象、Java 類等等。目錄結(jié)構(gòu)可以是單一的（flat）、基于對(duì)象類型的（asset）、或基于站點(diǎn)區(qū)域的（section）。所有生成的HTML使用相對(duì)路徑。在發(fā)布之前還可以使用預(yù)覽功能。預(yù)覽創(chuàng)建HTML文件，生成任何需要的圖象，但它不拷貝任何別的對(duì)象，從而不顯示嵌入的組件。在按下CTRL 鍵時(shí)單擊預(yù)覽按扭就可以只預(yù)覽當(dāng)前頁(yè)。

圖3-5：發(fā)布視圖

總之，F(xiàn)usion是一個(gè)Web站點(diǎn)的組裝工具，對(duì)管理站點(diǎn)范圍的格式模板有強(qiáng)力支持，支持豐富的“對(duì)象”，鏈接和對(duì)象集管理使得部署到多個(gè)站點(diǎn)變得很容易。可以使用Fusion設(shè)計(jì)站點(diǎn)結(jié)構(gòu)、構(gòu)建和管理站點(diǎn)頁(yè)面、設(shè)計(jì)和寫(xiě)頁(yè)面內(nèi)容、設(shè)計(jì)站點(diǎn)的圖形化風(fēng)格、管理和測(cè)試站點(diǎn)的對(duì)象集、把站點(diǎn)發(fā)布到本地或遠(yuǎn)程服務(wù)器、更新和維護(hù)站點(diǎn)。