1,Yahoo! UI Library 的介紹
1.1 簡介
Yahoo! User Interface Library(簡稱yui) 是一個使用Javascrīpt編寫的工具和控件庫。它利用DOM腳本,DHTML和AJAX來構造具有豐富交互功能的Web程序。yui也包含幾個核心的CSS文件。yui中的所有組件已經以開源的形式發佈，它們遵循BSD協議並且可以免費使用。可以從Sourceforge站點下載完整的項目文件，同時包含相關文檔和示例。
yui項目開發人員的BLOG：YUI Blog，交流社區：ydn-javascrīpt on Yahoo! Groups。
準備工作：
1、 下載yui
yui項目文件已經發布在Sourceforge站點，文件包含相關文檔，示例和代碼。
注：Yahoo沒有爲yui的運行提供免費的運行環境，你需要運行在你在即Web服務器上。
2、 在你的網頁中加入你需要的類庫文件
爲了使用yui中的組件你必須在你的頁面文件中用<scrīpt>指定相關組件的類庫文件地址。如果該組件依賴於其他組件，你必須使用<scrīpt>指定所依賴的組件的類庫文件地址。
3、 如果有必要，在頁面中加入CSS文件
某些yui的控件包含一個相應的CSS文件，用來設定控件的樣式。此時，你必須在頁面中使用<style>指定相應的CSS文件的地址。你可以通過修改相應的CSS文件達到你想要的效果。
4、 瀏覽相關文檔和示例
每一個組件都包含詳細的API文檔，並且提供了常用的例子。學習完後，回顧一下所有的API，做到心中有數。因爲對於API理解的好壞將影響你對yui的使用效果。
1.2 組件介紹
Yui組件分成2類：工具包和控件庫
Yui 工具包
Yui 工具包利用DOM腳本來簡化瀏覽器內的開發（in-browser devolvement），使用DHTML和AJAX的特性開發所有的Web程序。
動畫（Animation）：在你的頁面中通過指定位置，大小，透明度或者頁面元素的其他特性來創建一個"電影效果（cinematic effects）"。這些效果將在你的頁面發生變化的時候給用戶更好的體驗。
連接管理（Connection Manager）：這個工具包幫助你管理XMLHttpRequest（一般被稱爲AJAX）事務，它提供對錶單提交（form posts），錯誤捕獲（error handling）和callbacks的全面支持。該工具包也支持文件的上傳管理。
DOM：DOM工具包提供更簡單的DOM腳本的功能調用方式，包含元素的位置和CSS樣式的管理。
拖放（Drag and Drop）：創建可拖放的對象。爲了提供豐富的交互功能（比如拖動一個對象到目標位置）你可能需要編寫很多代碼。這個工具包可以在所有支持的瀏覽器中捕獲所有的操作事務並保證其穩定地運行。
事件（Event）：這個神奇的管理類庫給你提供一種簡單安全的方法訪問瀏覽器的事件（比如點擊和鍵盤操作）。這個事件封包中還包含了自定義事件對象，它爲你的程序交互提供一種發佈和訂閱事件的機制。
yui控件：
yui控件庫爲你頁面提供一組高交互性性的可視化元素。這些元素完全在客戶端創建維護，不需要請求服務器進行頁面刷新。
這些控件包括：
自動完成（AutoComplete）控件：自動完成控件爲文本輸入提供一種漸進式的用戶體驗（streamline user interactions）。控件會提供相似項列表和基於多樣化的數據格式的提前鍵入功能（type-ahead functionality based on a variety of data-source formats），並且可以通過XMLHttpRequest訪問服務端的數據。
日曆（Calendar）控件：一個用來日期選擇的動態圖形控件。
容器（Container）控件：一組模仿windows樣式的控件，他們包括Tooltip, Panel, Dialog 和 SimpleDialog。其中Module 和 Overlay控件提供一個可擴展的平臺，你可以控制自定義的模仿windows樣式的控件。
日誌（Logger）控件：提供一個快速和簡單的記錄日誌的方式，它直接將日誌信息輸出到屏幕控制檯（on-screen console）、Firefox的擴展組件FireBug，或者Safari的Javascrīpt控制檯。yui的Debug組件將完整的記錄輸出信息和調試信息。
菜單（Menu）控件：利用此控件只需要幾行簡單的代碼就可以設計一個動態樣式的菜單。可以完全使用javascrīpt構造一個菜單，can be layered on top of semantic unordered lists。
滑塊（Slider）控件：提供一個可滑動的組件，它允許使用者在一定的範圍內（x軸，y軸）改變滑塊的位置。
樹形（TreeView）控件：提供一個節點可縮放的樹形控件。節點可以是鏈接，自定義屬性，並且可以動態加載。節點元素的展現可以通過CSS修改，比如文件夾視圖，TO－DO任務列表或者其他可視化處理
第三章 yui的CSS資源
爲了讓CSS能符合不同等級的瀏覽器（A-Grade browsers）的標準，我們想了很多。我們把這些作爲yui類庫的一部分共享出來，希望能在這裏得到促進，獲得一個簡潔的，可維護並在瀏覽器中表現優秀的設計。
頁面網格樣式（CSS Page Grids）：7個基本的用css組織子組件的頁面框架，支持130種不通的頁面佈局。
標準的CSS字體（Standard CSS Fonts）：標準的跨瀏覽器字體樣式和大小展現。
標準的CSS排列（Standard CSS Reset）：使用這些CSS聲明來排除頁面的空白部分並且公共元素的樣式兼容各種瀏覽器的展現。
 |
YUI version 0.12.0 更新，增加了 TabView控件，以及API的文檔以及所有例子也都做了調整 YUI version 0.12.0: TabView Control, Improved API Documentation, and More The TabView Control: Written by YUI Animation and Dom author Matt Sweeney, this dynamic tab solution is the newest YUI addition and features robust support both for progressive enhancement and for high-gloss richness. Check out Matt's roster of TabView examples for an idea of what the new control can do; view source on the examples to see how they're implemented. |
