Dreamweaver CS4界面和功能都做了很大的改變，下面就讓我們跟隨作者去看看DW CS4在界面上究竟新增了哪些功能。接下來還腳本之家會陸續(xù)為大家?guī)黻P于DW CS4的一些設計、代碼方面的體驗，希望大家能喜歡!
相關文章：Dreamweaver CS4 首次新功能試用。
　　這次DreamweaverCS4的界面幾乎是做了一次脫胎換骨的改進，從中看到了更多的設計元素，讓DW也稍稍帶著點蘋果的味道。如果說VISTA和OFFICE 2007創(chuàng)造了軟件界面設計的新紀.元，那么Adobe相當于取代了蘋果的設計地位而緊隨MS之后。唯一的區(qū)別就是，MS老是抄人家蘋果的（汗一個，微軟的Fans別砸我），而Adobe卻是實實在在的自己創(chuàng)造，設計界的老大地位實至名歸……

圖1 ( 點擊上圖可放大)
　　界面方面的變化相當大，讓我們從頭部開始，看看DW在界面上究竟新增了哪些功能。
　　從下圖可以看到，DW CS4給菜單增加了三個平級下拉按鈕，他們分別是布局、DW擴展和站點管理器。
　　布局按鈕：這個按鈕似乎和下方的代碼、分割、設計按鈕功能重復，目前還不明白DW的意圖，唯一增加的新功能是垂直分割，讓代碼和設計界面以垂直對比的方式呈現(xiàn)。

圖2
　　DW擴展：

圖3
　　站點管理器：

圖4
#p#
　　菜單的最右邊，則是最新的外觀面板排布管理菜單。在7.5GB的版本中，DW只有3種外觀模式；而在150MB的版本里，卻可以看到DW 一口氣推出的八種布局，由此推測，這個7.5GB的版本可能是國外的愛好者從ADODB內(nèi)部搞出來的半成品，并非ADODB官方網(wǎng)站放出的那份，呵呵~
　　八種外觀模式分別為：應用程序開發(fā)、應用程序開發(fā)增強、古典、代碼、代碼增強、設計、精簡設計、雙屏模式。

圖5
　　下面給出幾個比較有代表性的界面：
　　應用程序開發(fā)增強：左上方是和數(shù)據(jù)相關的面板，包括數(shù)據(jù)庫面板、數(shù)據(jù)綁定面板和行為面板；左下方則是文件與資源相關的面板，包括文件面板、相關資源面板、代碼收集器等；右邊則是設計相關面板，包括插入面板、CSS樣式表面板、AP元素面板（用來為浮動層定位）。應該說這是一個萬金油布局，幾乎適用所有的開發(fā)者，同時，它也把大部分菜單展示在用戶面前，其他的七種布局可以說只是在這個基礎上進行一些排列和隱藏。

圖6
　　精簡設計：這是我最喜歡的一個布局，它提供了更多的可視區(qū)域，同時可以把右邊的菜單收縮到只剩下圖標。對于習慣了ADODB其他設計軟件的朋友來說，這的確是非常貼心的設計。

圖7
#p#
　　雙屏模式比較特殊，有點類似于Delphi7的開發(fā)界面，面板全部浮動起來，給用戶更多的自由。我還不是太習慣這種模式，就不上圖贅述了。
　　無論你是一個程序員還是一個設計師，DW給出的界面可以說是相當討好了，比如我，就特別鐘愛精簡設計的模式，因為它幾乎和我的Photoshop的界面一模一樣，就如同圖一所展示的，可以讓我從頁面的全局來進行思考和工作。
　　在下方的文檔面板上，DW新增加了一個實時預覽功能——Live View。它的作用是在DW窗口中實時查看代碼的效果，包括Javascript特效！

圖8
　　這是一個很不錯又很有必要的進步。怎么說呢，這個功能本應早就具備的，不過在CS4里才看到，之前的版本都只能另開瀏覽器來預覽，讓使用者頻繁的在窗口間切換，費了不少功夫！而我在幾年前使用一個類似于Editplus之類編輯器的時候，就已經(jīng)開始使用這個相當實用的軟件內(nèi)預覽功能了。不過這次DW的Live View實時瀏覽功能做的有些奇怪，好像沒有使用IE或者FIREFOX的內(nèi)核，因為控件的外觀還不是瀏覽器中實際顯示的樣式，有點類似于蘋果瀏覽器Safari，但又不是。截圖如下：

圖9
　　在使用中，經(jīng)測試發(fā)現(xiàn)Live View右邊的按鈕Live Code并沒有起到任何作用，HTML級的所有的動態(tài)功能都可以在Live View中實現(xiàn)，點擊Live Code后反而不能編輯代碼。這倒是一個很奇怪的功能了，希望在下節(jié)的代碼里能夠測試到它究竟是針對何種代碼才能生效。同時也歡迎網(wǎng)友一起參與DW CS4試用，談談感受!

最新評論