如何在LightSwitch中建立多欄自動完成的下拉框

 

在這篇博文中，我想介紹一種非常常見的下拉用法（下拉框也稱組合框或者自動完成框），能夠讓使用者從尋找或者父表中一系列值中進行選擇，此下拉用法通常稱為“尋找列表”。通常，這些列表呈現一個欄，比如項目的“名稱”。但很多時候我們希望呈現給使用者多欄的資訊。通過Visual Studio LightSwitch，這不僅僅容易實現，還非常的靈活，會根據你建立的布局應變。在這篇博文中，我會介紹各種常見的使用LightSwitch中自動完成框的布局。要知道的是，這些技術中大部分都不僅局限於自動完成框。實際上你會發現這些布局控制在螢幕的任何地方都是適用的。現在就讓我們開始吧。

設定一個尋找列表

要看視頻教學點擊這裡：如何操作：在LightSwitch應用中建立並控制尋找列表的？

當你在Visual Studio LightSwitch中將表關聯之後，父表關係就會自動在螢幕上以完成框的形式呈現。如果產品隸屬於分類，產品表就是分類表的父表。

當你建立了一個項目螢幕時，分類就在自動完成框內展示，並呈現表的摘要屬性。當一行資料顯示在螢幕上時，LightSwitch用摘要屬性來決定該顯示什麼內容的。這不僅適用於自動完成框，而且還適用於系統的任意情境。比如，搜尋螢幕使用這個屬性為所選記錄提供串連至編輯螢幕。系統將其預設為表內首位字串屬性，你可以在資料設計器中的屬性視窗變更。

現在當我們為項目建立一個詳細編輯螢幕時，我們就從分類中擷取了自動完成框。如果你建立並運行應用（F5）你會發現類似於父表的東西呈現在自動完成框內：

摘要屬性預設為顯示，通常這是你所需要的。但是，你也不用局限於此。實際上，你還可以從在螢幕設計器和它豐富多樣的布局控制中找到很多小花樣（查看Sheel在團隊部落格上寫的螢幕設計器貼士）。點擊“設計螢幕”按鈕，進入螢幕自訂模式，展開自動完成框節點，顯示摘要控制：

顯示多欄 要在自動完成框顯示多欄，請點擊摘要控制項下的展開箭頭，將其變更為欄布局：

預設設定下，實體上所有的域都會顯示出來。將你不想在自動完成框中顯示的項目刪除，並按你的喜好重新編排順序。在我的例子中，分類包括名稱，描述和圖片。

系統預設欄寬為150像素。你可以在這個屬性中自行設定你想要的寬度。在這個例子中，我把描述設定為“自動大小”因為我希望欄可以展開。接著在自訂模式中點擊儲存，你就可以看到布局的改變了。

如要看此步驟的視頻教學，點擊：如何操作：在自動完成下拉框中顯示多欄的？

顯示圖片和文本

你會發現這非常簡單。不過如果你想在這裡顯示一張圖片，那麼為實現這個特定目的，你可以使用更好的布局控制項，那就是“圖片和文本”以及“文本和圖片”布局控制項。在這裡你選擇圖片以及其它三個你想顯示的資訊：（TITLE）比其餘的字型要大，而（SUBTITLE）的字型比（DESCRIPTION）大些。

在我的例子中，我還把名稱的寬度屬性設定為“自動大小”。你現在儲存自訂模式就會看到一個更好的布局。當然，你無需選擇圖片，也可以用這個布局單獨顯示文本。

顯示連結以編輯

有時你可能想直接在下拉單中編輯行。這樣使用者就可以無需開啟其它的螢幕，直接更正資訊了。LightSwitch通過設定標籤控製為“連結”形式顯示來實現此操作。這些連結看上去像超連結，它們引導使用者前往編輯畫面。比如回到自訂模式，我們可以選擇名稱屬性然後將其設定為“以連結顯示”。

點擊儲存，你就會看到名稱在自動完成框中以超連結形式出現。如果你點擊它，分類的預設編輯畫面就會出現，讓使用者編輯記錄。在儲存變更之後，點擊自動完成框底部的重新整理按鈕就能看到改動後的效果了。

在Visual Studio LightSwitch中還有很多靈活的布局控制，讓項目編輯變得異常簡單。我的下一篇博文就會告訴你怎樣給自動完成框添加命令，以向列表添加新項目，這也是商業應用中使用者生產率情境中非常常見的。

希望你們喜歡！

 

http://blogs.msdn.com/b/beth_massi/archive/2011/09/27/test1111.aspx