試試看:使用點陣圖效果自訂 SimpleTabItem

本頁僅適用 WPF 專案

使用 SimpleTabItem 範本可簡化自訂索引標籤控制項外觀的程序。

將點陣圖效果新增至 SimpleTabItem

  1. 在畫板上繪製一個 SimpleTabControlSimpleTabControl 依預設包含兩項 SimpleTabItem 範本。

    Cc294648.alert_tip(zh-tw,Expression.10).gif秘訣:

    在 [資產庫] Cc294648.0224cabd-5da1-4e01-bddd-4a647401a098(zh-tw,Expression.10).png 中,可以從 [控制項] 索引標籤的 [簡單樣式] 類別中取得簡單樣式 (Simple Styles) 控制項。從清單中選取簡單樣式 (Simple Styles) 控制項之後,就可以在畫板上繪製該控制項。

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

    Cc294648.alert_tip(zh-tw,Expression.10).gif秘訣:

    若要結束範本編輯模式並返回您的文件範圍,請在 [互動] 面板中的元素樹狀目錄上方,按一下 [選定範圍] Cc294648.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(zh-tw,Expression.10).png 按鈕。

    若要返回現有範本的範本編輯模式,請在 [物件與時間軸] 下,以滑鼠右鍵按一下要編輯範本的元素,指向 [編輯控制項組件 (範本)],然後按一下 [編輯範本]。

  3. 在控制項範本的編輯範圍中,選取 [物件與時間軸] 下的 [框線] 元素,然後在 [屬性] 面板之 [外觀] 類別的進階區段 Cc294648.81e110f1-4068-4299-957d-0693cea95088(zh-tw,Expression.10).png 中,按一下 [BitmapEffect] 屬性旁的下拉式箭號,再按一下 [斜面]。[BevelWidth] 屬性預設為 5。

  4. 在 [觸發程序] 面板中選取 [IsPressed] 狀態,以開啟觸發程序的錄製功能。在 [屬性] 面板中,同樣地按一下 [BitmapEffect] 屬性旁的下拉式箭號,再按一下 [斜面],然後將 [BevelWidth] 屬性變更為 25。

    [觸發程序] 下的 [使用時的屬性] 下方會出現新行,反映當滑鼠按一下索引標籤項目時會發生的屬性變更。

  5. 按一下 [選定範圍] Cc294648.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(zh-tw,Expression.10).png 按鈕,回到文件的編輯範圍。

  6. 若要將自訂範本套用至索引標籤控制項中的其他索引標籤項目,請以滑鼠右鍵按一下 [物件與時間軸] 下的其他索引標籤項目,指向 [編輯控制項組件 (範本)],再指向 [套用資源],然後按一下自訂範本的名稱。

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

請參閱

概念

SimpleTabControl 及 SimpleTabItem