ASP.NET移動開發入門基礎
隨著硬件的飛速發展,移動設備也如同計算機設備一樣呈現出具有更好的性能、更快的處理速度和更便宜的趨勢。尤其是即將到來的3G技術,將使得移動設備突破現在的帶寬限制,這樣我們就可以構建出許多新穎且功能強大的移動應用。現在已經有許多商業應用都開始向移動設備上進行遷移,所以對開發者來說,現在就開始ASP.NET移動開發的學習將是一種非常適合的時機。
當然我不可能在這例用簡短的篇幅里探討所有的用ASP.NET移動開發應用的詳細過程。這篇文章將介紹一些基礎的知識,這樣使得你對用ASP.NET 2.0技術來開發移動應用有個大概的了解,以便你快速地深入該項技術。首先我們將學習如何使用Visual Studio 2005創建一個ASP.NET 2.0移動程序,然后介紹一些常用的移動開發控件并以適合的方式在程序中加于應用,最后你將學習的是如何開發針對特定移動設備的WEB程序和管理程序中的ViewState(視圖狀態)和Session。
創建一個新的ASP.NET 移動WEB程序
Visual Studio 2005提供了一組功能強大且友好的開發工具來創建移動WEB程序,如果你已經有創建傳統的ASP.NET應用程序的經驗,那么你就會發現創建移動WEB程序和創建傳統的ASP.NET應用程序是非常類似的。你只需要創建一個ASP.NET網站項目并添加一些移動WEB窗體即可。當你添加移動WEB窗體后,你就會發現在工具箱中添加了如下圖所示的ASP.NET移動控件。
現在你可以按照如下的步驟在Visual Studio 2005創建一個新的ASP.NET移動開發的WEB程序:
1. 選擇"文件"-"新建"-"網站"
2. 在"Visual Studio已安裝的模板"列表中選擇"ASP.NET 網站"
3. 設置好程序的"位置"、"語言"和"路徑"等選項后,單擊"確定"按鈕。
當你完成上述步驟后,就已經創建好了一個ASP.NET 網站。現在我們就可以在該網站中添加一些針對移動設備的WEB窗體,其具體的實現過程如下:
1. 在Visual Studio 2005的"解決方案資源管理器"窗口中選擇剛才創建好的網站項目,右鍵點擊并在彈出的菜單中選擇"添加新項"命令。
2. 在彈出的"添加新項"窗體中選擇"移動WEB窗體"項。
3. 設置窗體的"名稱"和"語言"等項,并且確保"將代碼放在單獨的文件中"選擇框處于選中狀態。
當單擊"添加"按鈕后,你會發現Visual Studio 2005自動添加了兩個文件,在這里窗體名稱被設置為"MobileDefault",因此這兩個文件分別為MobileDefault.aspx 和MobileDefault.aspx.cs (如果你選擇的語言為VB的話,則這兩個文件為MobileDefault.aspx和MobileDefault.aspx.vb)。MobileDefault.aspx文件包含在窗體使用的各個ASP.NET 移動控件的聲明方式,而MobileDefault.aspx.cs則包含了一些程序實現代碼和事件處理代碼,這和傳統的ASP.NET應用程序采用的"代碼后置"的方式是一致的。
窗體添加完畢后,我們就可以使用工具箱中的"移動WEB窗體"標簽下的各個控件。如同其它的ASP.NET控件一樣,我們也可以根據需求設置這些控件的屬性和事件行為。你可以在"原代碼"窗口下直接輸入"〈 mobile: /〉"的語法方式來添加移動控件:
- 〈 mobile:TextBox ID="MyTextBox" runat="server" 〉
- 〈 /mobile:TextBox 〉
- 〈 mobile:Label ID="MyLabel" runat="server" 〉
- 標簽控件〈 /mobile:Label 〉
下圖顯示了一個放置了Label、TextBox和Command控件的移動WEB窗體。該窗體所實現的功能是根據TextBox控件中輸入的CustomerID來查找相應的用戶信息,我們并沒有編寫對應的邏輯代碼,只是顯示了該窗體的界面:
Visual Studio 2005中對應的HTML代碼如下所示,我們可以看到上述的3個控件均以 〈mobile: 為前綴在頁面代碼中進行了聲明。同樣的,Form也采用了類似的方式加以聲明,見代碼7所示。在傳統的ASP.NET應用程序中處理窗體和處理控件的方式是不一樣的,這和移動WEB頁面有很大的差別。其最大的不同就是開發人員可以在同一個移動WEB頁面中創建多個窗體,并且可以在這些窗體間自由地導航而無需回發到服務器。利用該項特性可以減少因移動設備帶寬小而帶來的約束,大大減少了和服務器通訊的數據量。換句話說,移動設備中是以窗體為單位進行顯示,而不是像傳統的ASP.NET程序那樣以頁面為單位進行顯示。我們使用移動設備瀏覽不同屏的信息時,可能并沒有跳轉到不同的頁面,而是在同一個頁面的不同窗體間進行跳轉。
- 01 〈%@ Page Language="C#" AutoEventWireup="true"
- CodeFile="MobileDefault.aspx.cs"
- 02 Inherits="MobileDefault" % 〉
- 03 〈%@ Register TagPrefix="mobile"
- Namespace="System.Web.UI.MobileControls"
- 04 Assembly="System.Web.Mobile" % 〉
- 05 〈html xmlns="http://www.w3.org/1999/xhtml" 〉
- 06 〈body 〉
- 07 〈mobile:Form id="Form1" runat="server" 〉
- 08 〈mobile:Label id="lblID" Runat="server" 〉
- Customer ID〈/mobile:Label 〉
- 09 〈mobile:TextBox id="txtCustID" Runat="server" 〉
- 〈/mobile:TextBox 〉
- 10 〈mobile:Command id="cmdGetCustomer"
- Runat="server" 〉Find Customer
- 11 〈/mobile:Command 〉
- 12 〈/mobile:Form 〉
- 13 〈/body 〉
- 14 〈/html 〉
ASP.NET移動開發中的WEB窗體的開發視圖 Visual Studio 2005的開發環境中提供了三種視圖進行ASP.NET 移動WEB窗體的設計和開發。這三種視圖分別為設計視圖、HTML視圖和代碼視圖,我們可以針對不同的開發需求在這些視圖間進行切換。現在我們就這三種視圖進行一個簡短的概要。
#p#
設計視圖
設計視圖狀態下將加載移動WEB窗體,并且自動呈現窗體中所包含的移動控件。你可以從工具箱中以拖拽的方式添加新的控件,你也可以通過屬性窗口修改已存在的控件的屬性。如果想要移除窗體中的某些控件的話,你可以點選該控件并使用"Delete"鍵進行刪除。
注意,ASP.NET移動開發的WEB窗體的設計視圖并不是一個"可見即可得"的編輯器,這是因為不同的移動設備其支持的呈現方式是不同的。例如,在設計視圖狀態下通常一行只能放置一個控件,但是在某些設備上支持在同一行放置多個控件,因此各個控件將會盡量地停靠在同一行上。正因為如此,我們還需要注意ASP.NET移動WEB窗體并不支持控件的絕對位置。
在設計器中,您可以按照希望控件顯示給用戶的順序將它們添加到窗體或面板中,但是不能定義當它們呈現在移動設備的屏幕上時所處的絕對位置。為了適應多種多樣的移動設備,ASP.NET 移動設計器使您能夠針對特定設備自定義移動 Web 窗體頁和控件的外觀。這種靈活性使您可以確保:您的應用程序在目標設備上具有適用且吸引人的外觀。
HTML視圖
HTML視圖狀態下顯示的是HTML源代碼,你可以采用直接編碼的方式設置移動控件和窗體的布局。當然我們已經很少使用這種方式進行程序的開發,你完全可以在設計視圖狀態下設置移動控件和窗體的布局,而后Visual Studio 2005會自動生成相應的頁面代碼。
你可以在Visual Studio 2005開發文檔窗體的底部選擇合適的標簽進行設計視圖和HTML視圖的切換,如圖中箭頭所示:
代碼視圖
在采用代碼后置的方式下,我們可以切換到代碼視圖狀態查看頁面程序的邏輯代碼。你可以在頁面的空白出單擊右鍵,然后選擇"查看代碼"項就可以切換到代碼視圖狀態。
ASP.NET移動開發控件的事件處理
和傳統的ASP.NET控件一樣,移動控件也可以在特定的狀態下激發事件,并提供了一些默認事件來處理經常發生的方案。除此之外,移動控件也可以在某些情況下激發一些其它的處理事件(非默認的事件)。傳統的ASP.NET程序中,用戶通過瀏覽器執行某些操作時會激發相應的事件,移動設備瀏覽器也采用了類似的處理方式。我們可以將一個事件通過回發的方式傳遞到服務器端,繼而引發服務器端對該事件的處理,最終的處理結果將以HTML的形式傳遞到客戶端瀏覽器。處理一個由移動控件激發的默認事件是非常容易的,我們只需在頁面中放置一個移動控件并雙擊該控件即可。下面為一個較常見的事件處理代碼,即一旦用戶單擊命令按鈕就激發其Click事件。
protected void cmdGetCustomer_Click(object sender, EventArgs e)
{……}
創建一個非默認的事件處理器也是非常容易的,我們現在無需考慮語言的相關性。如果你曾經使用過Visual
Studio 2003的話,你會發現用VB.NET來處理事件要比C#復雜。在當前的Visual Studio版本中已經將這兩種語言的操作過程進行了統一,下面的步驟就是創建一個非默認事件處理器的詳細步驟:
1. 在狀態視圖中點選要設置事件的控件。
2. 在屬性窗口中選擇事件按鈕,也就是那個帶有閃電標記的按鈕。單擊后就會在屬性窗體中顯示控件的所有的可用事件。
3. 雙擊你想處理事件的右側空白欄,這時將切換到相應事件的代碼視圖狀態。
使用容器控件
ASP.NET移動開發的WEB窗體中提供了兩種容器控件:Form控件和Panel控件。幾乎所有的移動控件都是放置在這兩種控件之中,唯獨StyleSheet控件例外。StyleSheet控件可以單獨地放置在頁面中,該控件將會在以后的小節中進行詳細的介紹。我們可以將屬于同一組功能的移動控件都放置在一個容器控件中,這樣使得程序的頁面結構更加的清晰。我們還可以為一個容器控件設置特定的樣式表,所有位于該容器的移動控件將會具有一致性的用戶體驗。注意,在頁面中添加的容器控件是沒有固定大小的,因為它將隨著你在其中放置的控件而自動地進行調整,因此我們不可以顯式地為容器控件指定一個特定的大小。
ASP.NET 移動WEB窗體對所有的控件都使用線性布局,即每行只放一個控件。這是因為眾多的移動設備之間存在巨大的差異,尤其是一些支持WML的設備并不支持控件的并排顯示。但是如果強制使用許多控件都支持的BreakAfter屬性的話,則有相應的顯示能力的設備上將啟用并排顯示的布局。另外,它會自動適應不支持并排呈現的設備的呈現規則。將 BreakAfter 屬性設置為 false 將指示 ASP.NET 在所有具備相應顯示能力的設備上并排放置控件。為了適應多種多樣的移動設備,ASP.NET 移動設計器使您能夠針對特定設備自定義移動 Web 窗體頁和控件的外觀。我將在后面的"設備篩選器"小節中詳細介紹如何開發針對特定設備的應用程序。
Form控件
所有的內容和控件都包含在Form控件中,而且每個ASP.NET 移動WEB頁面至少要包含一個Form控件,并且該頁面可以包含多個Form控件。但是,當這些控件顯示在移動設備上時,移動 Web 應用程序一次只能顯示一個移動Form 控件。當你添加一個移動WEB窗體時會自動在頁面上創建一個默認的Form控件。如果你需要在頁面中添加多個Form控件時,可以在工具箱中直接拖拽出。
用戶瀏覽到某移動Web窗體頁時,默認情況下將顯示該頁面上的第一個Form控件。你也可以通過編碼的方式直接在頁面的Page_Load事件中指定一個Form控件為當前的活動窗體。當然你也可以采用編碼的方式并且根據用戶的輸入信息導航到相應的Form控件上。在同一個頁面的不同Form控件之間導航并不需要通過服務器的處理,因此可以極大地提高程序的響應速度。將一個頁面組織成多個Form控件還有個優點,那就是可以在不同的Form控件間傳遞一些豐富的狀態信息。因為一個頁面上的所有 Form 控件都共享相同的代碼隱藏文件和頁面狀態信息,因此各個Form 控件都可以共享相同的方法和成員。
由于ASP.NET移動WEB程序通常是在一些小屏幕的移動設備上運行的,為了適應這種特定的顯示環境,你需要將一個普通的ASP.NET WEB頁面分解成多個移動WEB頁面。如果沒有Form控件的話,這種分解過程是非常繁雜的,因為你需要在ASP.NET WEB頁面和移動WEB頁面間建立一個一對多的映射,這樣使得程序難以維護。
最合適的方式就是在一個移動WEB頁面放置多個Form 控件,這樣使得ASP.NET WEB頁面和移動WEB頁面是一個一對一的鏡像關系。在面對數據量較大的移動WEB頁面時,將所有的Form控件在頁面初始化時就全部加載到移動設備的響應時候是相當長的。但是一旦加載到移動設備后在各個Form控件進行導航的速度又是非常快的,因為一切信息都存放在本地的內存中。這種頁面的加載方法總體上還是利大于弊的,開發人員可以根據實際的需求加以權衡,而且同一頁面上的所有Form控件可以共享相同的代碼隱藏文件和頁面狀態信息。
Panel(面板)控件
使用 Panel 控件可將窗體中的控件進行分組。這使您可以對整個組應用 StyleSheet 控件。面板還能幫助應用程序確定分頁。ASP.NET 會盡量將一個面板中的所有控件都同時顯示在屏幕上。
若要將面板添加到應用程序中,請從"工具箱"中將其拖放到應用程序。面板中的所有控件都繼承該面板的樣式。可以將面板插入Form控件或其他面板中。應用程序隱藏或顯示面板時,它將對該面板包含的控件應用相同的操作。此外,應用程序還可將面板控件用作動態創建的控件的容器。
Panel控件必須放在Form控件中、另一Panel控件中或控件模板中。除StyleSheet控件、DeviceSpecific控件和Form控件外,所有其他控件也都必須放在Form或Panel控件中。
【編輯推薦】