WebMatrix開發ASP.NET試用手記

  前言

  無可否認,Microsoft的重量級開發工具Visual Studio.NET確實爲我們提供了一個非常強大、優秀的.NET應用系統集成開發環境。但是,使用VS.NET也要面對一些問題,比如:VS.NET要付費(當然D版另當別論),VS.NET安裝比較麻煩,VS.NET佔用空間很大,對機器要求也較高。因此,採用VS.NET來開發要付出比較高昂的使用成本,只有應用於大型的系統開發纔有較好的性效比。

  如果僅僅只是要進行中小型的基於ASP.NET的Web應用系統開發的話,是否一定要用強大而昂貴的Visual Studio.NET呢?

  答案是否定的。最近Microsoft爲開發者提供了一款免費的小巧易用的開發ASP.NET工具,這就是WebMatrix。

圖1:http://www.asp.net/WebMatrix

  圖1是WebMatrix項目的主頁,WebMatrix起源於2000年12月,微軟的工程師完全採用.NET Framework和C#語言開發的一款免費的輕量級ASP.NET快速開發工具,可以方便快捷的完成Web應用系統的開發。

  WebMatrix最突出的特點就是小巧靈活,整個安裝文件不過1.3M左右,安裝後全部大小也不過2.8M左右,使用它只需基本的.NET Framework支持就可以了,甚至不需要安裝IIS,因爲WebMatrix自帶了一個Microsoft ASP.NET Web Matrix Server,可以發佈、運行ASP.NET應用程序。
  走近WebMatrix

  l) 安裝WebMatrix

  WebMatrix目前可以支持的操作系統是Windows 2000和Windows XP,可以從http://www.asp.net/webmatrix/免費下載。

  安裝WebMatrix之前必須先裝好Microsoft .NET Framework 1.1和Internet Expleror 5.5以上版本。安裝過程是傻瓜式的,只管一路"Next"就行了。安裝好後運行可以看到WebMatrix的主界面如圖2所示。其界面佈局與VS.NET有點類似,上部是菜單/工具條,左邊是工具箱,提供開發ASP.NET所需的各種控件工具,右邊是工作區管理欄和屬性欄,分別用於文件/數據的管理和控件屬性的配置,中間是主工作區。

圖2:WebMatrix主界面

 

  2) 第一個ASP.NET程序Hello WebMatrix!

  首先我們來創建第一個ASP.NET程序,從File菜單新建一個文件,可以看到一個新建文件對話框(圖3)。

圖3:新建文件對話框

  WebMatrix與VS.NET的一個很大不同之處是WebMatrix是基於文件來進行開發管理的,而不是象VS.NET那樣基於項目(Project)來管理。這跟WebMatrix主要面對的開發項目是中小型項目有關係,小型項目開發相對比較簡單,管理沒有那麼複雜,WebMatrix自身的定位只是一個輕量級的開發工具。

  從打開的新建文件對話框中可以看到WebMatrix支持新建多種類型的文件,包括.aspx、.sql、.cs、.xml文件等,可以支持三種典型的.NET應用開發語言--C#、J#、Visual Basic.NET。選擇缺省的ASP.NET Page,並輸入要創建的文件名HelloWebMatrix.aspx,選擇C#爲編程語言,即可創建一個空白ASPX頁面文件。

  WebMatrix爲每個ASP.NET文件窗口提供了四種視圖,分別是設計視圖(Design),靜態代碼視圖(HTML),動態代碼視圖(Code)和全局視圖(All),缺省顯示的是設計視圖。

  從左邊的工具箱中的Web Controls欄中選擇Button控件拖放到頁面設計視圖上,可以看到一個Button控件顯示在視圖中,在屬性欄中將其Text屬性修改爲"問候!",可以看到按鈕上的文本隨之變爲"問候!",如圖4所示。從界面右下區域的屬性欄中可以看到該控件的缺省名稱爲Button1。

圖4:在視圖區添加"問候!"按鈕

  這樣HelloWebMatrix程序的可視化編輯就完成了,然後開始編輯代碼。

   雙擊視圖區中的"問候!"按鈕,可以看到頁面視圖區由Design視圖轉到了Code視圖,WebMatrix自動爲按鈕Button1的Click事件創建了一個函數--void Button1_Click(object sender, EventArgs e),函數體尚無內容。在函數體中添入一行代碼:

"Button1.Text = "Hello WebMatrix!"

  整個開發過程就完成了,如圖5所示。

圖5:爲按鈕Click事件添加處理代碼

  點擊工具條上的運行按鈕運行程序,可以看到WebMatrix彈出一個對話框,詢問是採用IIS還是自帶的Web Matrix Server來運行程序,如果機器上沒有安裝IIS,可以選擇其缺省的Web Matrix Server,在端口號中輸入一個本機空閒的端口號,比如8000,點擊Start按鈕即開始運行,如圖6所示。

圖6:選擇ASP.NET應用程序的運行服務器

  運行過程中首先啓動了Web Matrix Server(可以看到Windows系統托盤區出現了一個圖標),然後從彈出瀏覽器窗口中可以看到運行結果--頁面上出現一個"問候"按鈕,點擊該按鈕後按鈕上的文本變爲"Hello WebMatrix!",如圖7所示。

圖7:HelloWebMatrix程序運行效果

  開發數據庫訪問程序

  動態網頁開發中最常見的恐怕就是開發數據庫訪問程序。WebMatrix爲開發ASP.NET數據庫訪問程序提供了很好的支持。觀察一下WebMatrix主界面右上區域的工作區管理欄(Workspace),會發現在Workspace標籤頁的旁邊還有一個Data標籤頁,這裏還提供了一個數據欄(Data) ,點擊Data標籤頁就進入了數據窗口(Data),如圖8所示。


圖8:數據窗口

  開發數據庫訪問程序首先要建立數據庫連接,點擊數據窗口中的添加數據庫連接按鈕,可以看到添加新數據庫連接項目窗口,如圖9所示。


圖9:添加數據庫連接

  WebMatrix可以支持Access數據庫,也可以支持SQL Server/MSDE數據庫/桌面引擎,如果是後者的話,可以得到更好的支持,在這裏爲簡便起見,可以選擇Access Database,點擊OK,從彈出的對話框中選擇一個Access數據庫,比如Access自帶的Sample數據庫:家庭成員地址數據庫文件ADDRBOOK.MDB,點擊OK後可以看到WebMatrix已經在數據窗口中建好了一個數據庫連接,從中可以看到數據庫中的數據表,如圖10所示。


圖10:一個建立好的數據連接

  建好了數據庫連接後,剩下來的事情就簡單了,新建一個ASP.NET程序文件DataBaseAccess.aspx,然後在數據窗口中選擇一個數據表(比如"家庭成員"表)拖放到頁面設計視圖上,可以看到頁面上自動建立了一個MxDataGrid控件和一個AccessDataSourceControl控件,並自動完成了數據集的關聯,如圖11所示。


圖11:拖放一個數據表到頁面設計視圖區後的效果

  此時已經完成了一個具有基本的數據顯示功能的數據庫訪問程序的開發。點擊運行按鈕運行程序,可以看到頁面的顯示效果--頁面上顯示出一張有關家庭成員信息的數據表,可以看到這個數據表還進行了自動分頁顯示處理,在表格的最後一行是數據分頁顯示的頁碼鏈接,用鼠標點擊表格的表頭各列,表中數據可以自動按照該列排序顯示,這樣的數據表已經可以滿足一般的頁面數據顯示需要,而此時你甚至還沒有編寫一行代碼。


圖12:DataBaseAccess程序運行效果

  作爲一個數據庫訪問程序,僅僅有數據顯示功能當然是不夠的,還需要加上一些基本的增、刪、改等交互功能,下面我們爲DataBaseAccess程序加入數據查詢功能。

  回到頁面設計視圖,從工具箱中將WebControls欄中的TextBox和Button拖放到頁面設計視圖上,將Button的"Text"屬性設爲"查詢",再將一個DataGrid控件拖放到下一行,如圖13所示。可以看到這幾個控件的名字被缺省設定爲TextBox1、DataGrid1、Button1。


圖13:添加查詢文本框和按鈕

  此時程序的頁面可視化設計就完成了,接下來實現一個按照用戶在文本框中輸入的成員姓氏查詢成員信息的功能(刪除、修改功能可以以類似方式實現)。

  在頁面視圖區中點擊底部的Code標籤頁 ,頁面視圖區轉到了Code視圖,可以看到WebMatrix界面左邊的工具箱中出現了代碼嚮導(Code Wizard)一欄,如圖14所示。


圖14:代碼嚮導欄

  可以看到"代碼嚮導"提供了幾種基本的數據操作(比如SELECT、INSERT、DELETE、UPDATE等)代碼嚮導,雙擊其中的"SELECT Data Method",可以看到屏幕彈出一個查詢代碼添加嚮導對話框,如圖15。


圖15:查詢代碼添加嚮導對話框

  依照該向導順序操作,

  1) 選擇要進行查詢操作的數據庫(ADDRBOOK.MDB),如圖15;

  2) 選擇要在查詢結果中顯示的數據項(成員編號、名字、姓氏、角色等),如圖16;


圖16:選擇要在查詢結果中顯示的數據項

  3) 點擊WHERE按鈕,選擇要查詢的數據項和查詢條件(姓氏),如圖17;


圖17:選擇要查詢的數據項和查詢條件

  4) 完成設置後點擊Next按鈕進入查詢測試對話框,點擊Test Query按鈕進行查詢測試,輸入編號"趙",可以看到姓趙的成員信息被顯示出來,這說明測試成功,如圖18;


圖18:測試查詢結果

  5) 最後設置生成的查詢方法的名稱(缺省爲MyQueryMethod)和返回類型(缺省爲DataSet),如圖19;


圖19:設置生成的查詢方法名稱和返回類型

  6) 完成設置後回到Code視圖,可以看到WebMatrix自動生成的MyQueryMethod方法源代碼,如圖20。


圖20:生成的查詢方法源代碼

  接下來是最後一步,把查詢按鈕的點擊事件與查詢方法關聯起來。

  點擊頁面視圖區底部的Design標籤頁 回到Design視圖,雙擊前面添加到頁面上的"查詢"按鈕,可以看到頁面視圖區由Design視圖轉到了Code視圖,WebMatrix自動爲"查詢"按鈕的Click事件創建了一個函數--void Button1_Click(object sender, EventArgs e),函數體尚無內容。在函數體中添入兩行代碼:

DataGrid1.DataSource = MyQueryMethod( TextBox1.Text );
DataGrid1.DataBind();

  整個開發過程就完成了,如圖21所示。


圖21:爲查詢按鈕的點擊事件添加關聯代碼

  點擊工具條上的運行按鈕運行程序,可以看到運行效果,頁面出現了文本框和查詢按鈕,在文本框中輸入"趙",點擊"查詢"按鈕後,數據表中所有姓"趙"的成員的信息被查出並顯示在了頁面上,如圖22。


圖22:程序按姓氏進行條件查詢的運行效果

  如果覺得頁面中DataGrid的顯示效果難看的話,可以很方便進行調整修飾。

  回到WebMatrix中的程序頁面設計視圖窗口,點擊頁面上的控件DataGrid1,可以看到WebMatrix右下區域的屬性設置區中出現了對DataGrid的各種屬性設置項,最簡便的修飾外觀的方法是點擊該區域下部的"Auto Format…"鏈接,從彈出的自動格式設置對話框中選擇一種喜歡的外觀樣式就可以了,如圖23所示。


圖23:DataGrid的外觀設置

  再次運行,可以看到界面顯示效果已經自動進行了修飾,如圖24所示。


圖24:加入修飾效果後的數據查詢程序頁面運行效果

  結束語

  至此,相信你已經領會到了WebMatrix的強大功能了,回過頭來想一想,真有點不敢相信這個東西居然只有2.8M。

  WebMatrix在ASP.NET程序代碼處理上與VS.NET的不同之處在於WebMatrix將程序的邏輯處理代碼與頁面靜態代碼放在一個文件中,而不像VS.NET那樣做到了數據與顯示的分離。因此,在程序員與網頁美工的配合上會麻煩一點,但對於開發中小型系統來說,這並不是很大問題。

  總而言之,WebMatrix是一款小巧靈活、功能強大的基於Web的ASP.NET應用系統開發工具,雖然相對VS.NET來說它還是一個非常輕量級的開發工具,但其自身相當有特點,很多功能並不遜於VS.NET,對於中小型的系統開發來說它是一個不錯的選擇,而且最重要的是--它是免費的。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章