VS 2013 LightSwitch 入門教學 Part 1 - 表格裏是什麼? 描述你的資料

各位夥伴們,

第一次聽到 LightSwitch 這個字眼? 它是什麼呢? 有時候我們想在 Visual Studio 中用工具拖拉點選,快速地 “拉" 出一個資料庫的應用程式,例如中小企業需要一個簡單的產品型錄管理應用、庫存管理、辦公室資產管理、甚至訂便當系統,這類簡單的辦公室應用大都只有基本的資料庫表格操作、以及表單及報表的應用,無需太多客製化空間或是系統整合、也不用寫程式碼,這時候就可以使用 Visual Studio LightSwitch 這個工具!(在以往可能是使用 Access 、甚至是更早期的 FoxPro 工具來設計資料庫應用,但這類的工具無法設計出 Web 版本、往往也侷限在單機操作或是 Client-Server 架構)

我們整理了一系列的 Visual Studio 2013 LightSwitch 入門文章如下,相信按圖學習操作,你馬上在 5 分鐘就可以 ”拉" 出一個簡單的資料庫應用!  也可以看線上學習影片

  [線上影片] 5分鐘打造一個資料庫應用 – 使用 LightSwitch in Visual Studio 2013

VS 2013 LightSwitch 入門 Part 1 - 表格裏是什麼? 描述你的資料


歡迎來到 Visual Studio 2013的 LightSwitch 系列課程第一部分!首先,我們從LightSwitch應用程式建立中最重要的一塊(表格)開始。簡單的說,表格是一種通過行和列組織資料的一種方式,如果你曾用過Excel或者其他的電子表格應用程式,在其中以行為單位來組織資料,然後每行中的每一列代表一個指定資料類型的字段。舉個例子,這就是一張關於客戶資料的表格:

Customer 表格:

LastName

FirstName

BirthDate

Doe

Jane

10/20/1972

Smith

John

11/12/1956

當你使用資料庫時,資料就是以這樣的方式儲存在一系列表格中。然後通過資料字段建立不同表格與表格之間的關係。我們將在下一篇文章中討論表格之間的關係,在這篇文章中,讓我們只專注於如何在LightSwitch中建立和使用表格。

LightSwitch 表格集(實體集)

使用LightSwitch建立的應用程式是以資料為中心的應用程式,它為用戶提供介面用於查看,添加以及修改資料。LightSwitch使用界面和表簡化了上述應用程式的開發。因為LightSwitch可以與其他外部資料源一起工作,這些資料源不需要一定來自資料庫。在LightSwitch中,我們有時將表集稱作“資料實體集”或者直接叫做“實體集”。所以無論你是資料庫中的一個表或者SharePoint中的一個列表,它們在LightSwitch中都是“實體集”,同樣地,一個表中的某一字段或者列表中的某一列都是被當作實體的一個屬性。

實體集是LightSwitch用於展示資料以及組建應用程式非常必要的一個部分。你可以使用LightSwitch內置的資料庫來建立資料實體集,或者從外部資料庫,Odata服務,一個SharePoint列表或其他的資料源中導入資料。當你在建立一個新的LightSwitch專案的時候,你需要選擇是否想要附加一個已經存在的資料源或者建立一個新的表格,如果你選擇建立一個新的表格,LightSwitch將在內置的資料庫中(也稱作本真資料庫)建立它。然後你就可以使用資料設計器來設計表格了。

當你建立表格集以及將它們關聯在一起的時候,你就是在設計一個資料模型,或者資料架構。這種描述資料的方式,如果你以前沒有做過的話,就需要多練習幾遍。然而,你會發現使用LightSwitch非常的直觀。如果你能夠很好的描述你的資料模型,那麼在後面建立界面的時候LightSwitch將會幫助到你更多。

LightSwitch 資料設計器

資料設計器是LightSwitch中所有資料模型化的工具,無論你是附加一個已存在的資料源或者建立一個新的資料庫。使用資料設計器,你可以對你的實體集定義屬性,建立實體集之間的關係。LightSwitch能夠為你處理很多典型的資料控制任務,比如字段驗證,業務處理以及並發衝突的解決方案,你也可以在字段屬性窗口中更改屬性值來自定義這些任務,或者通過代碼來對這些屬性進行重寫或者擴展。

LightSwitch不僅為你在模型化實體時管理底層資料庫表,它還自動建立了一個服務層,可以通過Odata協議公開資料。這樣就允許其他的商業系統和外部的客戶端(像Excel就是一個例子)非常容易和安全的連接到你的資料。你在實體集中定義的任何商業邏輯和用戶權限都會被很好的執行,無論什麼客戶端訪問你的這些服務。

關於資料設計器的參考,請參閱Data: The Information Behind Your Application

關於如何使用資料設計器的視頻演示,請參閱:How Do I: Define My Data in a LightSwitch Application?

關於更多LightSwitch中的OData服務,請參閱:Creating and Consuming LightSwitch OData Services .

關於更多LightSwitch應用程式的整體結構,請參閱:Exploring LightSwitch Architecture

建立一個“Contact”實體

我們來演練一個具體的建立實體的例子,假設我們想建立一個管理聯絡人的應用程式,像一個地址薄。我們需要建立一個實體來儲存聯絡人的資料。首先打開Visual Studio 2013(專業版或者更高版本)。然後選擇編程語言,Visual Basic或者C#,接著選擇LightSwitch節點和將要建立的LightSwitch應用程式類型。在這個系列中,我們要建立一個HTML應用程式。將專案命名為ContractManager。

 

在你點擊新建專案對話框上的OK以後,LightSwitch主頁面會詢問你是否想要建立一個表格或者附加一個外部資料源。

 

點擊“建立新表格”,就會彈出資料設計器。現在你可以開始描述聯絡人實體了,當窗口打開以後,你的光標會坐落在實體窗口的標題欄。將其命名為“Contract”然後點擊Enter鍵。

 

一旦你這樣做你就會在解決方案中資料源文件夾下的ApplicationData節點中看見“Contracts”。ApplicationData代表LightSwitch為你建立的內部資料庫。Contracts指的就是資料庫中儲存所有的聯絡人記錄的那個表格。你也可以將其想像成實體集,這就是為什麼LightSwitch多元化的原因。

現在我們需要開始定義實體的屬性,和表格中的列(或者字段)關聯。你應該注意到Contract實體有一個稱作“Id”的屬性,這個屬性不可以更改。這個內部字段代表一行特定資料的唯一鍵值。當你模型化資料庫中的表格時,表格中的每一行必須都有一個唯一的鍵值,所以一個特定的行才能在表中被定位。這個Id屬性名稱左邊會有一個被稱作主鍵的標識。這是必須的,唯一的,它會以一個整型進行儲存。LightSwitch會自動為你管理這些主鍵。

所以我們現在需要考慮我們想要捕捉那些屬性在一個聯絡人記錄中。還需要決定以何種類型儲存指定的資料以及該字段的值是否是必須的。我已經選擇好儲存下面這些資料:LastName,FirstName,BirthDate,Gender,Phone,Email,Address1,Address2,City,State和ZIP。另外只有LastName是必須的,其它的字段的值就不強制用戶輸入了。

 

你也注意到了我選擇的資料類型與我想要儲存的資料類型匹配的非常緊密。例如電話號碼和郵件地址我選擇了使用“Phone Number”和“Email”類型,這些業務類型在界面上為你提供內置的驗證和編輯功能。這些資料在底層表中仍然是以字符串的形式進行儲存,在界面上它將為你進行自動格式化和驗證。驗證用戶的輸入對保持資料的一致性是非常重要的。在屬性窗口中你可以設置這些規則,像字段的值是必須的,字符串類型的值的最大長度,數值類型的屬性的有效值區間,日期類型的值的日期區間,以及其他的一些設置。你也可以自己定義一些驗證的代碼。

如果你看不見屬性窗口,就點擊一下F4打開它。在實體上選擇一個屬性然後你會看見一些相關的設置,你可以根據下方的視圖配置它。服務器的視圖允許你配置儲存和驗證屬性以及默認的字段顯示名稱。

根據你選擇的不同資料類型,你會看到不同的一些設置項目。在屬性窗口中所有的屬性都有一個都有一個“外觀”模塊,在你裡你可以指定其顯示名稱,這個名稱會顯示在應用程式的螢幕上的字段標籤欄。默認情況下,如果你對你的實體屬性使用駝峰命名法(aka Pascal Case),LightSwitch就會在一個短語中間放入一個空白字符。舉個例子,“LastName”屬性的顯示名稱就會自動變成“Last Name”。所以這個例子對你的實體屬性一個很好的示範。

 

如果想支持多國語言,你可以將顯示名稱用資源標識符作為代替,更多詳情,請參閱演練:Localizing a LightSwitch Application

你在資料設計器中的所有設置都會影響到應用程式的顯示,雖然你可以根據需要做其他的自定義特殊的顯示處理,但是你會花很多的時間來在設計器上配置你的資料模型。這樣,你就不必每次都在建立一個新的視窗的時候做很多顯示設置了。在建立一個新的用戶界面的時候,你對你的實體模型化工作做得越好,LightSwitch就能為你做更多自動化的事情。

對於聯絡人實體,我們來做一些額外的設置。首先,選擇Id字段,在打開的字段屬性窗口中的外觀區域,取消選擇“默認顯示”。這樣這個字段就不會在用戶界面的任何一個地方顯示了。前面說過,主鍵是一個內部字段,用於定位表中的每一行而且不可以被更改,所以用戶沒必要再應用程式的顯示端看到它。

對於BirstDate字段,設置其最小值為1/1/1900,這樣用戶就不能輸入這個日期以前的一個日期。

 

你可以在這裡為其設置一個最大值,但是這樣的話就會在驗證代碼中硬編碼一個靜態的值。然而,我們可能想要的是動態的驗證這個值。事實上,我們通常都會寫一段代碼來執行一個常見的資料驗證功能。舉個例子,假設我們想確保用戶輸入的日期不是一個未來的日期?在屬性窗口中點擊“自定義驗證”,然後提供驗證代碼來進行驗證。這個驗證會在服務器端的任何時候執行當聯絡人正在保存的時候。

VB:

   1: Private Sub BirthDate_Validate(results As EntityValidationResultsBuilder)

   2: 'Write code here:

   3: If Me .BirthDate.HasValue AndAlso Me .BirthDate > DateTime.Today Then

   4: results.AddPropertyError( "Birthdate cannot be in the future." )

   5: End If

   6: End Sub

C#:

   1: partial void BirthDate_Validate(EntityValidationResultsBuilder results)

   2: {

   3: //Write code here:

   4: if ( this .BirthDate.HasValue && this .BirthDate > DateTime.Today)

   5: {

   6: results.AddPropertyError( "Birthdate cannot be in the future." );

   7: }

   8: }

關於更多驗證的規則,請參閱:Common Validation Rules in LightSwitch Business Applications

對於性別,我們想要為用戶顯示一個靜態的值的集合:“女”,“男”。為了在LightSwitch中做到這一點,我們可以用一個選擇列表。一個選擇列表非常適合於那些總是靜態的和相對較少的選項,如這個地方的性別或者“是/否”這些值。如果一個選擇列表時一個動態的(或者非常龐大的列表),你應該建立一個表格來負責查找其值以及通過多對一的關係關聯到你的主表格上。這會引起LightSwitch自動的在應用程式界面上建立一個選擇列表。在下一篇博客中有更多的關於關係方面的內容。

在屬性窗口中點擊“選擇列表”,會打開一個窗口,讓你定義這些值以及你希望用戶看到的顯示名稱,這些值是會被保存到表中。在這裡,我們只是想存儲存一個“F”或者“M”在底層資料庫表中。因此設置其最大長度為1.

 

默認情況下,字符串的最大長度被設置為255個字符,這樣可以處理更多的情況。但是如果你需要你也可以更改它。(注:如果你想在資料庫中儲存一個varchar(max)的字符串,只需要在這裡把255清除使輸入框保持空白就可以了。)

使用屬性窗口可以配置實體本身,在服務器端視圖選擇聯絡人實體標題欄。你會注意到屬性窗口中“打開建立/修改屬性”複選框默認被勾上。當被複選框被勾上時,LightSwitch就會被告知將自動跟踪記錄什麼時間被誰建立或者修改。這樣做就會在表中自動添加4個字段:Created(DataTime),CreatedBy(String),Updated(DataTime)以及UpdatedBy(String)。這些字段在資料設計器中不會自動顯示,但是它會出現在界面設計器中,這樣你就可以選擇是否顯示它們。

現在我們切換到客戶端視圖。注意這裡有一個稱作是摘要屬性的設置。摘要屬性是用於描述你的實體以及當一行記錄呈現在螢幕上的時候LightSwitch決定將顯示什麼。默認情況下,LightSwitch會選擇你在實體上定義的第一個字符串屬性,但是你可以在這裡修改它。

 

關於更多摘要屬性的信息,請參閱:Getting the Most out of LightSwitch Summary Properties

測試聯絡人實體

現在我們已經有了一個設計好的聯絡人實體,讓我們來建立一個界面來快速測試一下。在資料設計器的頂端點擊“界面…”按鈕打開添加一個新的界面對話框。我們將在以後的文章中討論更多界面相關的內容,但是現在請選擇瀏覽資料界面。然後展開界面資料下拉框,選擇Contracts後點擊OK。

 

這樣會打開界面設計器,默認界面中展示了一個簡單Contracts列表,我們以後將會討論更多如何自定義界面的內容。現在,讓我們為這個應用程式添加一些添加/編輯聯絡人功能。展開命令菜單節點,點擊添加…按鈕,會打開添加按鈕對話框,然後選擇一個已存在的方法:addAndEditNew。

 

請注意,LightSwitch提供了預定義動作來自動地與我們的實體交互。我們後面將會深入到這些命令。

當我們選擇了addAndEditNew命令後我們也需要指定要跳轉到的界面,LightSwitch檢測到我們需要一個新的界面,所以只需要在這裡點擊OK。這樣會根據我們所有的選擇再次打開添加新界面的對話框。點擊OK,來為我們的應用程式添加一個新的AddEditContract界面。

 

我們也可以在用戶點擊聯絡人列表中的一個聯絡人時候添加一個事件將兩個界面串聯起來,這樣他們也可以編輯聯絡人詳細信息。返回到BrowseContract界面,選擇Contracts列表,在屬性窗口中點擊動作選項卡。

 

選擇一個已知的的方法,但是這次選擇editSelected。LightSwitch會自動注意到我們已經有一個合適的界面並且將其自動為我們添加好了,點擊OK。

 

點擊F5來編譯並打開應用程式。現在你可以使用這個界面輸入更多地聯絡人信息到Contract表中。點擊下方的添加新聯絡人按鈕來添加新的聯絡人。

 

請注意,如果我們不輸入Last Name,就會在界面上出現一個錯誤,提示這是一個必須的字段。同樣,如果你​​輸入不符合我們之前定義的非法資料的話,同樣會有驗證錯誤的消息顯示出來。請注意,當你調整界面尺寸時,LightSwitch將會自動調整你的界面佈局。這種響應式設計 (Responsive Design) 使得應用程式會非常友好的在平板電腦,手機,已經任何現代化的設備上顯示,只要它支持HTML5。

 

關於更多用戶體驗,LightSwitch提供了它自己的HTML客戶端,請參見:A New User Experience

當我們完成編輯,點擊對話框中上方保存按鈕。這就會將你的資料保存在你使用的開發資料庫中,開發這個應用程式只是測試資料被保存在你的內部資料庫中。真實的資料要直到你發布你的應用到你的用戶以後才會進入系統。

在下一篇文章中,我們將基於我們的資料模型來討論關係以及編譯,下次再見! 

[原文發表地址] Beginning LightSwitch in VS 2013 Part 1: What's in a Table? Describing Your Data 作者:Beth Massi

 

 

延伸閱讀 -