逐步解說：在 LightSwitch 中設計 Silverlight 螢幕
本逐步解說示範如何使用 LightSwitch 螢幕設計工具建立螢幕，以顯示 Northwind 範例資料庫中的客戶資料。 螢幕設計工具是可用來修改螢幕外觀的視覺化設計畫布。
本逐步解說示範如何執行下列工作：
建立螢幕
變更螢幕的配置
從螢幕中移除欄位
變更項目的順序
變更項目的顯示名稱
變更項目的控制項類型
在執行中的應用程式中自訂螢幕
必要條件
這個逐步解說是假設您已經將 Northwind OData 服務加入至您的專案中做為資料來源。
如需如何加入 Northwind OData 服務做為專案中的資料來源的詳細資訊，請參閱連接到 LightSwitch 應用程式中的資料。
建立螢幕
本節說明如何建立螢幕以顯示 Northwind 範例資料庫中的客戶資料。 此螢幕分為兩個部分。 第一個部分會顯示所有客戶的摘要清單，另一個部分則顯示所選取客戶的詳細資料。
若要建立螢幕
在 [方案總管] 中，開啟 [Screens] 節點的捷徑功能表，然後選擇 [開啟]。
在功能表列上，選擇 [專案]、[加入螢幕]。
[加入新螢幕] 對話方塊隨即開啟。
在 [選取螢幕範本] 清單中，選擇 [清單和詳細資料螢幕]。
在 [螢幕名稱] 文字方塊中，輸入 Customers。
在 [螢幕資料] 清單中，選擇 [DataSourceName.Customers]。
在 [要包含的其他資料] 區段中，選取 [Customer Details] 和 [Customer Orders] 核取方塊。
這樣會將 [Customer] 實體的欄位與客戶所下訂單的清單一起加入至螢幕的詳細資料部分。
下圖顯示您執行了本節的步驟之後，對話方塊顯示出來的外觀。
.png "加入新畫面對話方塊")
選擇 [確定] 按鈕以建立螢幕。
[螢幕設計工具] 隨即出現。
變更螢幕的配置
[清單和詳細資料] 螢幕具有兩欄資料。 左邊那一欄是一份客戶清單。 右邊那一欄包含兩列資料。 上方的資料列包含所選客戶的詳細資料，下方的資料列則包含與所選客戶相關的訂單。 螢幕設計工具的螢幕內容樹狀結構會顯示此清單的組成方式。
本節說明如何修改螢幕的配置，使螢幕包含兩列資料，而不是兩欄資料。 上方的資料列會包含客戶清單， 下方的資料列會包含兩欄資料。 左邊的資料行會包含所選客戶的詳細資料，右邊的資料行則包含與所選客戶相關的訂單。
若要變更清單的配置
在 [螢幕設計工具] 的 [螢幕內容樹狀結構] 中，選擇顯示在 [Customers] 節點旁邊的向下箭號，然後選擇 [資料列配置]。
[Customers] 節點的配置就會從 [資料行配置] 變更為 [資料列配置]。
選擇顯示在 [Details Column] 節點旁邊的向下箭號，然後選擇 [資料行配置]。
[Details Column] 的配置就會從 [資料列配置] 變更為 [資料行配置]。
從螢幕中移除欄位
根據預設，螢幕上顯示客戶詳細資料的區域 (名為 [Details Column]) 會顯示來自資料來源的所有欄位。 如果您不要顯示所有欄位，可以將不要的欄位移除。 例如，下列步驟會示範如何移除 [Country] 欄位。
若要從螢幕中移除欄位
在 [螢幕內容樹狀結構] 中展開 [Customer Details] 節點 (如果尚未展開)。
選擇 [Country] 欄位，然後在 [螢幕設計工具] 的命令列上，選擇 [刪除] 命令。
變更欄位的順序
下列步驟會示範如何變更欄位 (例如 CustomerID 欄位和 Postal Code 欄位) 的顯示順序。
若要變更欄位的順序
在 [螢幕內容樹狀結構] 中展開 [Customer Details] 節點 (如果尚未展開)。
將 [CustomerID] 欄位拖曳至 [Fax] 欄位下方，讓該欄位移動至詳細資料行的底部。
.gif "注意事項")
注意事項您也可以開啟 [CustomerID] 欄位的捷徑功能表，選擇 [剪下]，開啟 [Fax] 欄位的捷徑功能表，然後選擇 [貼上]。
將 [Postal Code] 欄位拖曳至 [Fax] 欄位和 [Customer ID] 欄位之間，讓該欄位移動至 [Customer ID] 欄位的正上方。
變更欄位的控制項類型
您可以自訂向使用者顯示欄位的方式。 例如，您可以設定文字欄位顯示為 Label 或 TextBox。 下列步驟會示範如何將顯示欄位變更為 Label 欄位，讓使用者無法修改它的值。
若要變更欄位的控制項類型
在 [螢幕內容樹狀結構] 中展開 [Customer Details] 節點 (如果尚未展開)。
開啟 [Customer ID] 欄位的清單，然後選擇 [標籤]。
您可以重複此步驟以變更其他欄位。
若要測試變更，請選擇 F5 鍵執行應用程式。
在執行中的應用程式中自訂螢幕
當應用程式正在執行時，您也可以自訂螢幕。 例如，您可以移除欄位、變更欄位順序以及變更屬性 (例如控制項類型或標籤對齊方式)。
若要在執行中的應用程式中自訂螢幕
如果您的應用程式並不是正在執行，請選擇 F5 鍵來啟動它。
在螢幕命令列上，選擇 [設計螢幕] 連結。
在 [自訂模式] 螢幕中，選擇 [Customer Details] 節點中的 [Customer ID] 欄位，然後選擇工具列上的 [刪除] (
.png "刪除選取的項目。")
) 按鈕，從詳細資料行移除該欄位。在 [Customer Details] 節點中，選擇 [Fax] 欄位，然後選擇工具列上的 [下移] (
.png "將項目移至清單中較低的位置。")
) 按鈕。[Fax] 欄位就會出現在 [Postal Code] 欄位下方。
在 [Customer Details] 節點中，選擇 [Phone] 欄位，然後在 [屬性] 視窗中，將 [顯示名稱] 屬性設定為 Phone Number。
在 [Customer Details] 節點中，選擇 [Phone Number] 欄位，然後在 [屬性] 視窗中，將 [控制項類型] 屬性設定為 [標籤]。
在 [Customer Details] 節點中，選擇 [Company Name] 欄位，然後在 [屬性] 視窗中，將 [標籤位置] 屬性設定為 [靠右對齊]。
對 [Customer Details] 節點中的所有欄位重複這個步驟，然後選取 [儲存] 按鈕。
您的應用程式現在會顯示您剛才所做的變更。
後續步驟
當您選擇螢幕的資料來源時，預設會顯示來源中的所有資料。 如果您只要顯示資料的子集，則可以建立查詢來定義要顯示的資料。 請參閱 如何：使用查詢設計工具設計查詢。