逐步解說：在設計階段變更屬性行為

發行項
08/21/2008

更新：2007 年 11 月

當您使用擴充性自訂 Windows Presentation Foundation (WPF) Designer for Visual Studio 時，通常會建立自訂控制項。您有時會需要控制項的屬性在設計階段與執行階段有不同的行為，但又能正常讓使用者設定屬性的值。例如，您可能希望使用者能夠為控制項將可見的屬性設為 false，但是此控制項在設計階段仍應保持可見狀態。

在這個逐步解說中，您會建立一個自訂 Button，並變更 Background 和 Content 屬性的行為。若要完成這個工作，可以建立 DesignModeValueProvider 並附加至您的自訂控制項。DesignModeValueProvider 會擷取使用者所做的屬性變更，您可以在 TranslatePropertyValue 方法中插入自己的邏輯，而 DesignModeValueProvider 會將新的值傳遞至設計工具。

重要事項：
當您使用這個技術時，設計工具中的屬性行為不符合 [XAML] 檢視中的屬性值。[XAML] 檢視會顯示使用者在設計階段輸入的值。[XAML] 檢視中的值表示屬性在執行階段時顯示的行為。

在這個逐步解說中，您會執行下列工作：

建立 WPF 自訂控制項程式庫專案。
建立自訂 DesignModeValueProvider。
建立自訂按鈕控制項。
將 DesignModeValueProvider 附加到自訂控制項。
建立測試應用程式。
測試自訂控制項。

注意事項：
根據您目前使用的設定或版本，您所看到的對話方塊與功能表命令可能會與 [說明] 中描述的不同。若要變更設定，請從 [工具] 功能表中選擇 [匯入和匯出設定]。如需詳細資訊，請參閱 Visual Studio 設定。

必要條件

您需要下列元件才能完成此逐步解說：

Visual Studio 2008

建立 WPF 自訂控制項程式庫專案

若要建立專案

在 Visual Basic 或 Visual C# 中建立名為 CustomButton 的新 WPF 自訂控制項程式庫專案。

CustomControl1 的程式碼隨即在 [程式碼編輯器] 中開啟。
加入下列組件的參考。
- Microsoft.Windows.Design.Extensibility
在 [方案總管] 中，將程式碼檔案的名稱變更為 CustomButton.cs 或 CustomButton.vb。

如果顯示訊息方塊詢問您是否要重新命名專案中的所有參考，請按一下 [是]。
在 [方案總管] 中，展開 [主題] 資料夾，然後開啟檔案 Generic.xaml。

Generic.xaml 會在 WPF 設計工具中開啟。
在 [XAML] 檢視中，以 "CustomButton" 取代檔案 Generic.xaml 中所有出現的 "CustomControl1" 項目。
按一下 [建置] 功能表上的 [建置方案]。

建立自訂 DesignModeValueProvider

在這個程序中，您會建立一個自訂 DesignModeValueProvider。在 TranslatePropertyValue 方法中，您會變更 Button 的 Content 屬性，以在設計工具中顯示為大寫。您也可以變更 Button 的 Background 屬性，才會在設計工具中顯示預設的系統色彩。這些變更只會影響設計工具。在執行階段，內含使用者所設定之值的 Content 和 Background 屬性都會顯示。

注意事項：
在這個程序中，您會建立一個處理兩個不同屬性的 DesignModeValueProvider。您也可以建立多個 DesignModeValueProvider 物件來處理不同的屬性。

若要建立自訂 DesignModeValueProvider

將名為 CustomButtonDesignModeValueProvider.cs 或 CustomButtonDesignModeValueProvider.vb 新類別加入到 CustomButton 專案。

新類別隨即在 [程式碼編輯器] 中開啟。

將下列命名空間加入到檔案的最上方。取代任何現有的命名空間。

Imports System
Imports System.Windows                  'SystemColors
Imports System.Windows.Media            'SolidColorBrush
Imports System.Windows.Controls         'Button
Imports Microsoft.Windows.Design.Model  'DesignModeValueProvider

using System;
using System.Windows;                   //SystemColors
using System.Windows.Media;             //SolidColorBrush
using System.Windows.Controls;          //Button
using Microsoft.Windows.Design.Model;   //DesignModeValueProvider

編輯 CustomButtonDesignModeValueProvider 類別，以從 DesignModeValueProvider 繼承。

Public Class CustomButtonDesignModeValueProvider
    Inherits DesignModeValueProvider

End Class

class CustomButtonDesignModeValueProvider : DesignModeValueProvider
{
}

將建構函式加入至類別。在建構函式中，識別您要擷取的屬性。

Public Sub New()

    Properties.Add(Button.ContentProperty)
    Properties.Add(Button.BackgroundProperty)
End Sub

public CustomButtonDesignModeValueProvider()
{
    Properties.Add(Button.ContentProperty);
    Properties.Add(Button.BackgroundProperty);
}

覆寫類別中的 TranslatePropertyValue 方法。這是您指定屬性之新設計階段行為的地方。

Public Overrides Function TranslatePropertyValue(ByVal identifier As PropertyIdentifier, ByVal value As Object) As Object

    If identifier.DependencyProperty Is Button.ContentProperty Then

        Return value.ToString().ToUpper()
    End If

    If identifier.DependencyProperty Is Button.BackgroundProperty Then

        Return New SolidColorBrush(SystemColors.ControlColor)
    End If

    Return MyBase.TranslatePropertyValue(identifier, value)
End Function

public override object TranslatePropertyValue(PropertyIdentifier identifier, object value)
{
    if (identifier.DependencyProperty == Button.ContentProperty)
    {
        return ((string)value).ToUpper();
    }

    if (identifier.DependencyProperty == Button.BackgroundProperty)
    {
        return new SolidColorBrush(SystemColors.ControlColor);
    }

    return base.TranslatePropertyValue(identifier, value);
}

按一下 [建置] 功能表上的 [建置方案]。

建立自訂按鈕控制項

在這個程序中，您會建立自訂控制項。您會建立繼承自 Button 的簡單自訂控制項，但其中未包含其他自訂功能。

若要建立自訂按鈕控制項

在 [程式碼編輯器] 中開啟 CustomButton 類別。

將下列命名空間加入到檔案的最上方。取代任何現有的命名空間。

Imports System.Windows.Controls             'Button
Imports Microsoft.Windows.Design.Features   'Feature

using System.Windows.Controls;              //Button
using Microsoft.Windows.Design.Features;    //Feature

以下列內容取代現有的類別。

Public Class CustomButton
    Inherits Button

    Shared Sub New()

    End Sub
End Class

public class CustomButton : Button
{
    static CustomButton()
    {
    }
}

按一下 [建置] 功能表上的 [建置方案]。

將 DesignModeValueProvider 附加到自訂控制項

在這個程序中，您會使用 FeatureAttribute 屬性，將 DesignModeValueProvider 附加到自訂控制項。

注意事項：
您也可以使用中繼資料存放區，將 DesignModeValueProvider 附加到自訂控制項。如需詳細資訊，請參閱中繼資料存放區和 HOW TO：使用中繼資料存放區。

若要將 DesignModeValueProvider 附加到自訂控制項

在 [程式碼編輯器] 中，找出 CustomButton 類別的宣告。看起來應該像這樣子：
```
Public Class CustomButton
    Inherits Button
```
```
public class CustomButton : Button
```

將 Feature 屬性 (Attribute) 加入到類別宣告，然後指定 DesignModeValueProvider。

<Feature(GetType(CustomButtonDesignModeValueProvider))> _
Public Class CustomButton
    Inherits Button

[Feature(typeof(CustomButtonDesignModeValueProvider))]
public class CustomButton : Button

按一下 [建置] 功能表上的 [建置方案]。

建立測試應用程式

若要建立測試應用程式

將名為 CustomButtonTestApplication 的新 WPF 應用程式專案加入到方案。

Window1.xaml 隨即在 WPF 設計工具中開啟。
在 [方案總管] 中，以滑鼠右鍵按一下專案，然後按一下 [設定為啟始專案]。
按一下 [專案] 功能表上的 [加入參考]，然後使用 [專案] 索引標籤將參考加入到 CustomButton 專案。
按一下 [建置] 功能表上的 [建置方案]。

測試自訂控制項

若要測試自訂控制項

在 Window1.xaml 的 [XAML] 檢視中，以下列內容取代現有的 XAML：

<Window x:Class="CustomButtonTestApplication.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:cb="clr-namespace:CustomButton;assembly=CustomButton"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <cb:CustomButton Height="75" Width="100">Button1</cb:CustomButton>
    </Grid>
</Window>

在 [設計] 檢視中選取按鈕。如有必要，按一下設計工具頂端的資訊列，重新載入檢視。
在 [屬性] 視窗中，找出 [Background] 屬性。
輸入 Red，然後按 Enter。

XAML 會更新成程式碼 Background="Red"，但按鈕的色彩在 [設計] 檢視中不會變更。
在 [屬性] 視窗中，找出 [Content] 屬性。
輸入 Hello World，然後按 Enter。

XAML 會更新成內容 Hello World，但按鈕會在 [設計] 檢視中顯示文字 HELLO WORLD。
在 [偵錯] 功能表上按一下 [開始偵錯]。

應用程式會啟動且視窗會出現。按鈕在執行階段會變成紅色並內含文字 Hello World。
關閉視窗。