Freigeben über

Exemplarische Vorgehensweise: Ändern des Verhaltens einer Eigenschaft zur Entwurfszeit

  • Artikel

Wenn Sie den WPF Designer für Visual Studio mithilfe der Erweiterbarkeit anpassen, ist es häufig notwendig, benutzerdefinierte Steuerelemente zu erstellen. Manchmal soll sich eine Eigenschaft des Steuerelements zur Entwurfszeit anders verhalten als zur Laufzeit, wobei der Benutzer jedoch den Wert der Eigenschaft auf normale Weise festlegen kann. Beispielsweise soll der Benutzer die visible-Eigenschaft eines Steuerelement auf false festlegen können, das Steuerelement soll jedoch trotzdem zur Entwurfszeit sichtbar sein.

In dieser exemplarischen Vorgehensweise erstellen Sie ein benutzerdefiniertes Button-Element und ändern das Verhalten der Background-Eigenschaft und der Content-Eigenschaft. Um dies zu erreichen, erstellen Sie einen DesignModeValueProvider und fügen diesen an das benutzerdefinierte Steuerelement an. Der DesignModeValueProvider erfasst vom Benutzer vorgenommene Eigenschaftenänderungen, Sie fügen Ihre eigene Logik in die TranslatePropertyValue-Methode ein, und der DesignModeValueProvider übergibt die neuen Werte an den Designer.

Wichtig

Wenn Sie dieses Verfahren verwenden, entspricht das Verhalten einer Eigenschaft im Designer nicht dem Wert der Eigenschaft in der XAML-Ansicht. In der XAML-Ansicht wird der Wert angezeigt, den der Benutzer zur Entwurfszeit eingegeben hat. Der Wert in der XAML-Ansicht stellt das Verhalten dar, das die Eigenschaft zur Laufzeit zeigt.

Im Verlauf dieser exemplarischen Vorgehensweise führen Sie folgende Aufgaben aus:

  • Erstellen eines benutzerdefinierten WPF-Steuerelementbibliothek-Projekts

  • Erstellen eines benutzerdefinierten DesignModeValueProvider

  • Erstellen eines benutzerdefinierten Schaltflächensteuerelements

  • Hinzufügen des DesignModeValueProvider zum benutzerdefinierten Steuerelement

  • Erstellen einer Testanwendung

  • Testen des benutzerdefinierten Steuerelements

Tipp

Je nach den aktiven Einstellungen oder der Version unterscheiden sich die Dialogfelder und Menübefehle auf Ihrem Bildschirm möglicherweise von den in der Hilfe beschriebenen. Klicken Sie im Menü Extras auf Einstellungen importieren und exportieren, um die Einstellungen zu ändern. Weitere Informationen finden Sie unter Arbeiten mit Einstellungen.

Vorbereitungsmaßnahmen

Zum Durchführen dieser exemplarischen Vorgehensweise benötigen Sie die folgenden Komponenten:

  • Visual Studio 2010

Erstellen eines benutzerdefinierten WPF-Steuerelementbibliothek-Projekts

So erstellen Sie das Projekt

  1. Erstellen Sie ein neues benutzerdefiniertes WPF-Steuerelementbibliothek-Projekt in Visual Basic oder Visual C# mit dem Namen CustomButton.

    Der Code für CustomControl1 wird im Code-Editor geöffnet.

  2. Fügen Sie einen Verweis auf die folgende Assembly hinzu.

    • Microsoft.Windows.Design.Extensibility

  3. Ändern Sie im Projektmappen-Explorer den Namen der Codedatei in CustomButton.cs oder CustomButton.vb.

    Wenn eine Meldung mit der Frage angezeigt wird, ob Sie eine Umbenennung für alle Verweise in diesem Projekt vornehmen möchten, klicken Sie auf Ja.

  4. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

Erstellen eines benutzerdefinierten DesignModeValueProvider

In diesem Verfahren erstellen Sie einen benutzerdefinierten DesignModeValueProvider. In der TranslatePropertyValue-Methode ändern Sie die Content-Eigenschaft für das Button-Element, damit es im Designer in Großbuchstaben angezeigt wird. Außerdem ändern Sie die Background-Eigenschaft für die Button, damit diese im Designer mit der Standardsystemfarbe angezeigt wird. Diese Änderungen beeinflussen nur den Designer. Zur Laufzeit werden die Background-Eigenschaft und die Content-Eigenschaft mit den vom Benutzer festgelegten Werten angezeigt.

Tipp

In diesem Verfahren erstellen Sie einen DesignModeValueProvider, der zwei verschiedene Eigenschaften behandelt. Sie können auch mehrere DesignModeValueProvider-Objekte erstellen, um verschiedene Eigenschaften zu behandeln.

So erstellen Sie einen benutzerdefinierten DesignModeValueProvider

  1. Fügen Sie dem CustomButton-Projekt eine neue Klasse mit dem Namen CustomButtonDesignModeValueProvider.cs oder CustomButtonDesignModeValueProvider.vb hinzu.

    Die neue Klasse wird im Code-Editor geöffnet.

  2. Fügen Sie am Anfang der Datei die folgenden Namespaces hinzu. Ersetzen Sie gegebenenfalls die vorhandenen Namespaces.

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


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

  3. Bearbeiten Sie die CustomButtonDesignModeValueProvider-Klasse, sodass sie vom DesignModeValueProvider erbt.

    
Public Class CustomButtonDesignModeValueProvider
    Inherits DesignModeValueProvider

End Class

    
class CustomButtonDesignModeValueProvider : DesignModeValueProvider
{
}

  4. Fügen Sie der Klasse einen Konstruktor hinzu. Im Konstruktor identifizieren Sie die Eigenschaften, die Sie aufzeichnen möchten.

    
Public Sub New()
    Properties.Add(GetType(Button), "Content")
    Properties.Add(GetType(Button), "Background")
End Sub

    
public CustomButtonDesignModeValueProvider()
{
    Properties.Add( typeof(Button), "Content");
    Properties.Add(typeof(Button), "Background");
}

  5. Überschreiben Sie die TranslatePropertyValue-Methode in der Klasse. Hier geben Sie das neue Verhalten der Eigenschaften zur Entwurfszeit an.

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

    If identifier.DeclaringType Is GetType(Button) And _
       identifier.Name = "Content" Then

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

    If identifier.DeclaringType Is GetType(Button) And _
       identifier.Name = "Background" Then

        Return New SolidColorBrush(SystemColors.ControlColor)
    End If

    Return MyBase.TranslatePropertyValue(item, identifier, value)
End Function

    
public override object TranslatePropertyValue(ModelItem item, PropertyIdentifier identifier, object value)
{
    if (identifier.DeclaringType == typeof( Button ) &&
        identifier.Name == "Content" )
    {
        return ((string)value).ToUpper();
    }

    if (identifier.DeclaringType == typeof(Button) &&
        identifier.Name == "Background")
    {
        return new SolidColorBrush(SystemColors.ControlColor);
    }

    return base.TranslatePropertyValue(item, identifier, value);
}

  6. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

Erstellen eines benutzerdefinierten Schaltflächensteuerelements

In diesem Verfahren erstellen Sie das benutzerdefinierte Steuerelement. Sie erstellen ein einfaches benutzerdefiniertes Steuerelement, das vom Button erbt, aber keine zusätzliche benutzerdefinierte Funktionalität enthält.

So erstellen Sie ein benutzerdefiniertes Schaltflächensteuerelement

  1. Öffnen Sie die CustomButton-Klasse im Code-Editor.

  2. Fügen Sie am Anfang der Datei die folgenden Namespaces hinzu. Ersetzen Sie gegebenenfalls die vorhandenen Namespaces.

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

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

  3. Ersetzen Sie die vorhandene Klasse durch die folgende Klasse.

    
Public Class CustomButton
    Inherits Button

    Shared Sub New()

    End Sub
End Class

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

  4. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

Anfügen des DesignModeValueProvider an das benutzerdefinierte Steuerelement

In diesem Verfahren fügen Sie den DesignModeValueProvider mit dem FeatureAttribute-Attribut an das benutzerdefinierte Steuerelement an.

Tipp

Sie können auch einen DesignModeValueProvider an ein benutzerdefiniertes Steuerelement anfügen, indem Sie benutzerdefinierte Entwurfszeitmetadaten bereitstellen. Weitere Informationen finden Sie unter Bereitstellen von Entwurfszeitmetadaten.

So fügen Sie den DesignModeValueProvider an das benutzerdefinierte Steuerelement an

  1. Suchen Sie im Code-Editor die Deklaration für die CustomButton-Klasse. Sie sollte wie folgt aussehen:

    
Public Class CustomButton
    Inherits Button

    
public class CustomButton : Button

  2. Fügen Sie der Klassendeklaration ein Featureattribut hinzu, und geben Sie den DesignModeValueProvider an.

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

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

  3. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

Erstellen einer Testanwendung

So erstellen Sie eine Testanwendung

  1. Fügen Sie der Projektmappe ein neues WPF-Anwendungsprojekt mit dem Namen CustomButtonTestApplication hinzu.

    Die Datei MainWindow.xaml wird im WPF-Designer geöffnet.

  2. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf das Projekt, und klicken Sie dann auf Als Startprojekt festlegen.

  3. Klicken Sie im Menü Projekt auf Verweis hinzufügen, und verwenden Sie die Registerkarte Projekte, um einen Verweis auf das CustomButton-Projekt hinzuzufügen.

  4. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

Testen des benutzerdefinierten Steuerelements

So testen Sie das benutzerdefinierte Steuerelement

  1. Ersetzen Sie in der XAML-Ansicht für MainWindow.xaml den vorhandenen XAML-Code durch den folgenden Code:

    <Window x:Class="CustomButtonTestApplication.MainWindow"
    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="MainWindow" Height="300" Width="300">
    <Grid>
        <cb:CustomButton Height="75" Width="100">Button1</cb:CustomButton>
    </Grid>
</Window>

  2. Wählen Sie in der Entwurfsansicht die Schaltfläche aus. Falls notwendig, klicken Sie auf die Informationsleiste oben im Designer, um die Ansicht erneut zu laden.

  3. Suchen Sie im Eigenschaftenfenster die Background-Eigenschaft.

  4. Geben Sie Red ein, und drücken Sie die EINGABETASTE.

    Der XAML-Code wird mit dem Code Background="Red" aktualisiert, aber die Farbe der Schaltfläche ändert sich in der Entwurfsansicht nicht.

  5. Suchen Sie im Eigenschaftenfenster die Content-Eigenschaft.

  6. Geben Sie Hello World ein, und drücken Sie die EINGABETASTE.

    Der XAML-Code wird mit dem Inhalt Hello World aktualisiert, aber auf der Schaltfläche wird der Text HELLO WORLD in der Entwurfsansicht angezeigt.

  7. Klicken Sie im Menü Debuggen auf Debuggen starten.

    Die Anwendung wird gestartet, und das Fenster wird angezeigt. Die Schaltfläche ist rot und enthält zur Laufzeit den Text Hello World.

  8. Schließen Sie das Fenster.

Siehe auch

Aufgaben

Gewusst wie: Ändern des Verhaltens einer Eigenschaft zur Entwurfszeit

Gewusst wie: Bestimmen, ob sich ein benutzerdefiniertes Steuerelement in der Entwurfszeit oder der Laufzeit befindet

Weitere Ressourcen

Vergleich zwischen Entwurfszeit- und Laufzeitverhalten

WPF-Designer-Erweiterbarkeit

WPF-Designer-Erweiterbarkeit

Bereitstellen von Entwurfszeitmetadaten