相關(guān)文章：DreamweaverCS4首次新功能試用。

這次DreamweaverCS4的界面幾乎是做了一次脫胎換骨的改進(jìn)，從中看到了更多的設(shè)計(jì)元素，讓DW也稍稍帶著點(diǎn)蘋果的味道。如果說(shuō)VISTA和OFFICE2007創(chuàng)造了軟件界面設(shè)計(jì)的新紀(jì)元，那么Adobe相當(dāng)于取代了蘋果的設(shè)計(jì)地位而緊隨MS之后。唯一的區(qū)別就是，MS老是抄人家蘋果的（汗一個(gè)，微軟的Fans別砸我），而Adobe卻是實(shí)實(shí)在在的自己創(chuàng)造，設(shè)計(jì)界的老大地位實(shí)至名歸……

DreamweaverCS4界面新增功能介紹

圖1

界面方面的變化相當(dāng)大，讓我們從頭部開始，看看DW在界面上究竟新增了哪些功能。

從下圖可以看到，DWCS4給菜單增加了三個(gè)平級(jí)下拉按鈕，他們分別是布局、DW擴(kuò)展和站點(diǎn)管理器。

布局按鈕：這個(gè)按鈕似乎和下方的代碼、分割、設(shè)計(jì)按鈕功能重復(fù)，目前還不明白DW的意圖，唯一增加的新功能是垂直分割，讓代碼和設(shè)計(jì)界面以垂直對(duì)比的方式呈現(xiàn)。

DreamweaverCS4界面新增功能介紹

圖2

DW擴(kuò)展：

DreamweaverCS4界面新增功能介紹

圖3

站點(diǎn)管理器：

DreamweaverCS4界面新增功能介紹

圖4

菜單的最右邊，則是最新的外觀面板排布管理菜單。在7.5GB的版本中，DW只有3種外觀模式；而在150MB的版本里，卻可以看到DW一口氣推出的八種布局，由此推測(cè)，這個(gè)7.5GB的版本可能是國(guó)外的愛好者從ADODB內(nèi)部搞出來(lái)的半成品，并非ADODB官方網(wǎng)站放出的那份，

八種外觀模式分別為：應(yīng)用程序開發(fā)、應(yīng)用程序開發(fā)增強(qiáng)、古典、代碼、代碼增強(qiáng)、設(shè)計(jì)、精簡(jiǎn)設(shè)計(jì)、雙屏模式。

DreamweaverCS4界面新增功能介紹

圖5

下面給出幾個(gè)比較有代表性的界面：

應(yīng)用程序開發(fā)增強(qiáng)：左上方是和數(shù)據(jù)相關(guān)的面板，包括數(shù)據(jù)庫(kù)面板、數(shù)據(jù)綁定面板和行為面板；左下方則是文件與資源相關(guān)的面板，包括文件面板、相關(guān)資源面板、代碼收集器等；右邊則是設(shè)計(jì)相關(guān)面板，包括插入面板、CSS樣式表面板、AP元素面板（用來(lái)為浮動(dòng)層定位）。應(yīng)該說(shuō)這是一個(gè)萬(wàn)金油布局，幾乎適用所有的開發(fā)者，同時(shí)，它也把大部分菜單展示在用戶面前，其他的七種布局可以說(shuō)只是在這個(gè)基礎(chǔ)上進(jìn)行一些排列和隱藏。

DreamweaverCS4界面新增功能介紹

圖6

精簡(jiǎn)設(shè)計(jì)：這是我最喜歡的一個(gè)布局，它提供了更多的可視區(qū)域，同時(shí)可以把右邊的菜單收縮到只剩下圖標(biāo)。對(duì)于習(xí)慣了ADODB其他設(shè)計(jì)軟件的朋友來(lái)說(shuō)，這的確是非常貼心的設(shè)計(jì)。

DreamweaverCS4界面新增功能介紹

圖7

雙屏模式比較特殊，有點(diǎn)類似于Delphi7的開發(fā)界面，面板全部浮動(dòng)起來(lái)，給用戶更多的自由。我還不是太習(xí)慣這種模式，就不上圖贅述了。

無(wú)論你是一個(gè)程序員還是一個(gè)設(shè)計(jì)師，DW給出的界面可以說(shuō)是相當(dāng)討好了，比如我，就特別鐘愛精簡(jiǎn)設(shè)計(jì)的模式，因?yàn)樗鼛缀鹾臀业腜hotoshop的界面一模一樣，就如同圖一所展示的，可以讓我從頁(yè)面的全局來(lái)進(jìn)行思考和工作。

在下方的文檔面板上，DW新增加了一個(gè)實(shí)時(shí)預(yù)覽功能——LiveView。它的作用是在DW窗口中實(shí)時(shí)查看代碼的效果，包括Javascript特效！

DreamweaverCS4界面新增功能介紹

圖8

這是一個(gè)很不錯(cuò)又很有必要的進(jìn)步。怎么說(shuō)呢，這個(gè)功能本應(yīng)早就具備的，不過(guò)在CS4里才看到，之前的版本都只能另開瀏覽器來(lái)預(yù)覽，讓使用者頻繁的在窗口間切換，費(fèi)了不少功夫！而我在幾年前使用一個(gè)類似于Editplus之類編輯器的時(shí)候，就已經(jīng)開始使用這個(gè)相當(dāng)實(shí)用的軟件內(nèi)預(yù)覽功能了。不過(guò)這次DW的LiveView實(shí)時(shí)瀏覽功能做的有些奇怪，好像沒有使用IE或者FIREFOX的內(nèi)核，因?yàn)榭丶耐庥^還不是瀏覽器中實(shí)際顯示的樣式，有點(diǎn)類似于蘋果瀏覽器Safari，但又不是。截圖如下：

DreamweaverCS4界面新增功能介紹

圖9

在使用中，經(jīng)測(cè)試發(fā)現(xiàn)LiveView右邊的按鈕LiveCode并沒有起到任何作用，HTML級(jí)的所有的動(dòng)態(tài)功能都可以在LiveView中實(shí)現(xiàn)，點(diǎn)擊LiveCode后反而不能編輯代碼。這倒是一個(gè)很奇怪的功能了，希望在下節(jié)的代碼里能夠測(cè)試到它究竟是針對(duì)何種代碼才能生效。同時(shí)也歡迎網(wǎng)友一起參與DWCS4試用，談?wù)劯惺?

更多信息請(qǐng)查看IT技術(shù)專欄