WebSphere快速入門(8)

3.3 NetObjects Fusion
    NetObject Fusion是一個可視化的Web站點的構建和管理工具。NetObjects Fusion是Web站點構建過程的中心。NetObjects Fusion是一個面向站點的工具，而不是僅僅處理單個頁面。在Web站點開發的過程中，會創建許多頁面，頁面之間有很多鏈接。手工地更改這個結構是相當困難的。用NetObjects Fusion可以設計Web站點的通用元素，創建并維護Web站點的結構，構建各個頁面，并能容易地維護這些頁面。
總之，使用NetObject Fusion，可以設計Web站點、構建各個頁面、容易地維護Web站點。下面介紹NetObject Fusion 中的站點視圖（Site view）、頁面視圖（Page view）、樣式視圖（Style view）、對象集視圖（Assets View、或稱資源視圖）、和發布視圖（Publishing view）。
    1．站點視圖
    站點的結構視圖（參見圖3-1）是站點視圖的一種，單擊“輪廓視圖”標簽就顯示站點的輪廓視圖。在結構視圖中，頁面的顏色是可以由開發者選擇，通常用來為頁面分組，但是頁面顏色對實際頁面沒有影響。用戶站點的文件格式為“*.nod”，模板文件格式為“*.nft”， 樣式文件格式為“*.ssf”。使用站點視圖，可以創建（或修改）一個站點的層次結構、操縱頁面、引入/導出（Import/Export）站點、引入模板以改變站點的風格、打印站點的結構圖等等。例如，可以引入一個已有的站點將它轉成NetObjects Fusion的格式或保留為外部HTML頁面。如果這些被引入的頁面不會被改變，通?？梢詫⒁氲捻撁姹Ａ魹橥獠縃TML頁面。
圖3-1：站點視圖

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

4.    對象集視圖
對象集視圖（參見圖3-4）是一個管理所有對象的地方，包括文件、鏈接、數據對象、變量，對象通過別名來訪問。Fusion提供預定義的變量，如日期、時間和站點名等等。開發者可以創建自己的變量，并在對象集視圖中管理。每當開發者需要選擇圖象或別的文件時，打開文件對話框（Open File dialog）上會有一個對象集標簽（Assets tab），單擊該標簽就顯示對象集中的有關文件，開發者就可以選擇所需要的文件。這種就對象進行統一管理的方式支持“一次更新，每個地方都更新”。例如標識公司的圖案（logo），如果一個公司改變了它的標識圖案，只要在對象集視圖中改變有關標識圖案的文件，Fusion可以改變這個站點里的每一頁。

圖3-4：對象集視圖

5．發布視圖
發布視圖（參見圖3-5）用來配置發布選項，并進行發布。發布選項包括本地發布位置和遠程發布位置等。本地發布是指發布到本機的文件系統里，遠程發布需要使用FTP把文件傳輸到服務器。如果你選擇發布到一個遠程站點，這個站點必須支持FTP，發布者必須知道所需的用戶名和口令。通常在正式發布之前需要發布到一個臨時服務器上進行測試，并需要使用不同平臺上的不同瀏覽器進行測試。發布時，Fusion將生成HTML頁面以及目錄結構，拷貝所有的對象到指定的目錄，這些目錄里包含HTML文件、圖象、Java 類等等。目錄結構可以是單一的（flat）、基于對象類型的（asset）、或基于站點區域的（section）。所有生成的HTML使用相對路徑。在發布之前還可以使用預覽功能。預覽創建HTML文件，生成任何需要的圖象，但它不拷貝任何別的對象，從而不顯示嵌入的組件。在按下CTRL 鍵時單擊預覽按扭就可以只預覽當前頁。

圖3-5：發布視圖

總之，Fusion是一個Web站點的組裝工具，對管理站點范圍的格式模板有強力支持，支持豐富的“對象”，鏈接和對象集管理使得部署到多個站點變得很容易?？梢允褂肍usion設計站點結構、構建和管理站點頁面、設計和寫頁面內容、設計站點的圖形化風格、管理和測試站點的對象集、把站點發布到本地或遠程服務器、更新和維護站點。

原文轉自：http://www.anti-gravitydesign.com