試試看：變更 SimpleListBox 中選取之項目的外觀

您可以在 Microsoft Expression Blend 中，使用 SimpleListBoxItem 控制項範本輕鬆地自訂在清單方塊中所選取之項目的外觀。

變更 SimpleListBox 中選取之項目的外觀

1. 在 Expression Blend 的畫板上繪製一個 [SimpleListButton]。

   秘訣：
   在 [資產庫] 中，可以從 [控制項] 索引標籤的 [簡單樣式] 類別中取得簡單樣式 (Simple Styles) 控制項。從清單中選取簡單樣式 (Simple Styles) 控制項之後，就可以在畫板上繪製該控制項。

2. 以滑鼠右鍵按一下 [物件與時間軸] 下的清單方塊，然後按一下 [新增 SimpleListBoxItem]，將項目新增至清單方塊中。

3. 以滑鼠右鍵按一下 [物件與時間軸] 下的其中一個清單方塊項目，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。若不想變更 SimpleStyles.xaml 資源字典，您可以按一下 [編輯複本] 代替 [編輯範本] 來建立新範本並儲存至文件中。如需有關建立複本的詳細資訊，請參閱建立資源。

   秘訣：
   若要結束範本編輯模式並返回您的文件範圍，請在 [互動] 面板中的元素樹狀目錄上方，按一下 [選定範圍] 按鈕 。 若要返回現有範本的範本編輯模式，請在 [物件與時間軸] 下，以滑鼠右鍵按一下要編輯範本的元素，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。

4. 在 [互動] 面板的 [觸發程序] 下，按一下 [IsSelected = True]。根據預設，當您選取某個項目時，框線背景色彩就會變更，如同在 [觸發程序] 面板下的 [使用時的屬性] 下看到的一樣。您可以按一下 [物件與時間軸] 下的 [框線]，然後在 [屬性] 面板的 [筆刷] 下修改 [Background] 屬性，將背景變更為另一種色彩。

   秘訣：
   當 [互動] 面板的 [觸發程序] 下已選取某個屬性觸發程序時，您在 Expression Blend 中任何位置所做的編輯動作，都會在該觸發程序條件上設定一個需要變更的值。在進行任何變更之前，請確定已選取正確的觸發程序。若要讓變更影響控制項範本的預設狀態，請按一下 [觸發程序] 面板下的 [預設]。

5. 若要在修改過範本的清單方塊中新增更多項目，可以按一下 [選定範圍] 按鈕 ，返回文件的編輯模式，接著按兩下清單方塊元素使其成為使用中狀態，然後從 [資產庫] 的 [本機樣式] 索引標籤，新增您的自訂樣式。

6. 測試您的應用程式 (F5) 以查看效果。

使用 ItemContainerStyle 範本來變更所選取之項目的外觀

1. 在 Expression Blend 的畫板上繪製一個 [SimpleListButton]。

   秘訣：
   在 [資產庫] 中，可以從 [控制項] 索引標籤的 [簡單樣式] 類別中取得簡單樣式 (Simple Styles) 控制項。從清單中選取簡單樣式 (Simple Styles) 控制項之後，就可以在畫板上繪製該控制項。

2. 在 [物件與時間軸] 下，按兩下清單方塊加以選取，然後在畫板上的清單方塊中繪製 [矩形] 或其他控制項，即可在清單方塊中新增幾個項目。或是在清單方塊元素上按一下滑鼠右鍵，然後按一下 [新增 SimpleListBoxItem]。

   秘訣：
   如果您要嘗試以資料繫結自動產生清單方塊的項目，可以使用本使用者指南中之試試看： 建立 RSS 新聞閱讀器的程序。

3. 按一下 [物件與時間軸] 下的 [ListBox] 物件。在 [物件] 功能表上，依序指向 [編輯其他樣式]、[編輯 ItemContainerStyle]，然後按一下 [編輯複本]。

   [建立樣式資源] 視窗會隨即出現。若要進一步瞭解 [建立樣式資源] 視窗中的選項，請參閱建立資源。為了配合此程序的目的，請接受預設值，然後按一下 [確定]。

   Expression Blend 會進入 ListBoxItem 樣式的編輯模式。

4. 範本包裝在樣式元素中，因此，若要編輯 ListBoxItem 的範本，請以滑鼠右鍵按一下 [物件與時間軸] 下的 [樣式] 元素，接著指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。

   注意事項：
   此處要按一下 [編輯範本]，而非 [編輯複本]，因為控制項範本包裝在樣式元素中，且您在步驟 3 已按一下 [編輯複本] 建立樣式的複本。

   Expression Blend 會進入清單方塊的每一個項目所使用之範本的 ListBoxItemStyleTemplate 編輯範圍。此範本中有一個名稱為 Bd 的 Border 元素、一個 ContentPresenter 元素以及兩個 IsSelected 狀態的觸發程序。

5. 在 [互動] 面板的 [觸發程序] 下，按一下其中一個 [IsSelected] 觸發程序以進入該觸發程序的錄製模式，然後變更 [Bd] 元素的屬性。

6. 測試您的應用程式 (F5) 以查看效果。

請參閱

概念

SimpleListBox 及 SimpleListBoxItem