Gewusst wie: Erstellen eines Eigenschaftswert-Editors für Dialogfelder

Artikel
08/10/2011

Im folgenden Codebeispiel wird das Implementieren eines benutzerdefinierten Eigenschaftswert-Editors für Dialogfelder für den WPF Designer für Visual Studio veranschaulicht. Eine vollständige Projektmappe finden Sie im Beispiel zum Eigenschaftswert-Editor für Dialogfelder auf der Website mit den Beispielen für WPF-Designer-Erweiterbarkeit.

Beispiel

In diesem Thema wird erläutert, wie Sie einen Eigenschaftswert-Editor für Dialogfelder erstellen, der ein Dialogfeld zum Öffnen einer Datei anzeigt, wenn im Fenster Eigenschaften auf eine benutzerdefinierte FileName-Eigenschaft geklickt wurde.

using System;
using System.ComponentModel;
using System.Windows.Controls;
using System.Windows;

namespace CustomControlLibrary
{
    public partial class DemoControl : UserControl
    {
        public DemoControl()
        {
            InitializeComponent();
        }

        public static readonly DependencyProperty FileNameProperty = DependencyProperty.Register(
            "FileName", 
            typeof(string), 
            typeof(DemoControl), 
            new PropertyMetadata("File name not set."));

        public string FileName
        {
            get
            {
                return (string)this.GetValue(FileNameProperty);
            }

            set
            {
                this.SetValue(FileNameProperty, value);
            }
        }
    }
}

<ResourceDictionary xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:PropertyEditing="clr-namespace:Microsoft.Windows.Design.PropertyEditing;assembly=Microsoft.Windows.Design.Interaction"
                    xmlns:Local="clr-namespace:CustomControlLibrary.Design"
                    x:Class="CustomControlLibrary.Design.EditorResources">

    <DataTemplate x:Key="FileBrowserInlineEditorTemplate">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <TextBox Grid.Column="0" Text="{Binding StringValue}"/>
            <PropertyEditing:EditModeSwitchButton Grid.Column="1"/>
        </Grid>
    </DataTemplate>

</ResourceDictionary>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace CustomControlLibrary.Design
{
    using System.Windows;
    public partial class EditorResources : ResourceDictionary
    {
        public EditorResources()
            : base()
        {
            InitializeComponent();
        }
    }
}

using System;
using System.ComponentModel;
using System.Windows;
using Microsoft.Windows.Design.Metadata;
using Microsoft.Windows.Design.PropertyEditing;
using Microsoft.Win32;

namespace CustomControlLibrary.Design
{
    public class FileBrowserDialogPropertyValueEditor : DialogPropertyValueEditor
    {
        private EditorResources res = new EditorResources();

        public FileBrowserDialogPropertyValueEditor()
        {
            this.InlineEditorTemplate = res["FileBrowserInlineEditorTemplate"] as DataTemplate;
        }

        public override void ShowDialog(
            PropertyValue propertyValue,
            IInputElement commandSource)
        {
            OpenFileDialog ofd = new OpenFileDialog();
            ofd.Multiselect = false;

            if (ofd.ShowDialog() == true)
            {
                propertyValue.StringValue = ofd.FileName;
            }
        }
    }
}

using System;
using System.ComponentModel;
using System.Windows;
using Microsoft.Windows.Design.Metadata;
using Microsoft.Windows.Design.PropertyEditing;

// The ProvideMetadata assembly-level attribute indicates to designers
// that this assembly contains a class that provides an attribute table. 
[assembly: ProvideMetadata(typeof(CustomControlLibrary.Design.Metadata))]
namespace CustomControlLibrary.Design
{
    // Container for any general design-time metadata to initialize.
    // Designers look for a type in the design-time assembly that 
    // implements IProvideAttributeTable. If found, designers instantiate 
    // this class and access its AttributeTable property automatically.
    internal class Metadata : IProvideAttributeTable 
    {
        // Accessed by the designer to register any design-time metadata.
        public AttributeTable AttributeTable
        {
            get 
            {
                AttributeTableBuilder builder = new AttributeTableBuilder();

                builder.AddCustomAttributes
                    (typeof(CustomControlLibrary.DemoControl),
                    "FileName",
                    PropertyValueEditor.CreateEditorAttribute(
                        typeof(FileBrowserDialogPropertyValueEditor)));

                return builder.CreateTable();
            }
        }
    }
}

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:ccl="clr-namespace:CustomControlLibrary;assembly=CustomControlLibrary"
    Title="MainWindow" Height="300" Width="300">
    <Grid>
        <ccl:DemoControl FileName="" />
    </Grid>
</Window>

Kompilieren des Codes

Kompilieren Sie den vorherigen Beispielcode in drei einzelne Assemblys.

Kompilieren des benutzerdefinierten Steuerelements

Erstellen Sie in Visual Studio ein neues WPF-Benutzersteuerelementbibliothek-Projekt in C# mit dem Namen CustomControlLibrary.
Ändern Sie alle Vorkommen von "UserControl1" in "DemoControl".
Ersetzen Sie den vorhandenen Code in der DemoControl-Klasse durch den zuvor aufgeführten Code.
Erstellen Sie die Projektmappe.

Kompilieren des benutzerdefinierten Eigenschaftswert-Editors für Dialogfelder

Fügen Sie in Visual Studio der Projektmappe ein neues WPF-Benutzersteuerelementbibliothek-Projekt mit dem Namen CustomControlLibrary.Design hinzu.
Legen Sie den Ausgabepfad des Projekts auf folgenden Pfad fest: ".. \CustomControlLibrary\bin\Debug\".
Löschen Sie UserControl1.xaml und UserControl1.xaml.cs aus dem Projekt.
Fügen Sie Verweise auf die folgenden Assemblys hinzu.
- Microsoft.Windows.Design.Extensibility
- Microsoft.Windows.Design.Interaction
Fügen Sie einen Verweis auf das CustomControlLibrary-Projekt hinzu.
Fügen Sie dem Projekt ein Ressourcenwörterbuch mit dem Namen EditorResources hinzu.
Ersetzen Sie den in EditorResources.xaml vorhandenen XAML-Code durch den weiter oben aufgelisteten XAML-Code.
Fügen Sie dem Projekt eine neue Klasse mit dem Namen EditorResources hinzu.
Ersetzen Sie den vorhandenen Code in der EditorResources-Klasse durch den zuvor aufgeführten Code.
Fügen Sie dem Projekt eine neue Klasse mit dem Namen FileBrowserDialogPropertyValueEditor hinzu.
Ersetzen Sie den vorhandenen Code in der FileBrowserDialogPropertyValueEditor-Klasse durch den zuvor aufgeführten Code.
Fügen Sie dem Projekt eine neue Klasse mit dem Namen Metadata hinzu.
Ersetzen Sie den vorhandenen Code in der Metadata-Klasse durch den zuvor aufgeführten Code.
Erstellen Sie die Projektmappe.

Kompilieren der Testanwendung

Fügen Sie in Visual Studio der Projektmappe ein neues WPF-Anwendungsprojekt hinzu.
Fügen Sie einen Verweis auf die CustomControlLibrary-Assembly bzw. auf das entsprechende Projekt hinzu.
Ersetzen Sie in der XAML-Ansicht für MainWindow.xaml den vorhandenen XAML-Code durch den zuvor aufgeführten XAML-Code.
Kommentieren Sie in MainWindow.xaml.cs den Aufruf von InitializeComponent aus.
Generieren Sie die Projektmappe neu.
Klicken Sie in der Ansicht Entwurf auf das DemoControl, um es auszuwählen. Möglicherweise müssen Sie auf die Informationsleiste oben im Designer klicken, um die Ansicht erneut zu laden.
Klicken Sie im Fenster Eigenschaften auf die Schaltfläche neben der FileName-Eigenschaft.

Das Dialogfeld Öffnen wird angezeigt.
Navigieren Sie zu einer Datei, und klicken Sie auf Öffnen.

Der Dateiname wird in der FileName-Eigenschaft des Fensters Eigenschaften angezeigt, und die FileName-Eigenschaft wird in der XAML-Ansicht zugewiesen.