Procédure pas à pas : hébergement d'un contrôle Windows Presentation Foundation dans les Windows Forms

  • Article

Mise à jour : novembre 2007

Windows Presentation Foundation (WPF) fournit un environnement riche pour créer des applications. Toutefois, lorsque vous avez un investissement substantiel dans le code Windows Forms, il peut être plus efficace d'étendre votre application Windows Forms existante avec WPF plutôt que la réécrire à partir de zéro. Un scénario courant consiste à incorporer une ou plusieurs pages implémentées avec WPF dans votre application Windows Forms

Cette procédure pas à pas vous guide à travers une application qui héberge une page WPF dans une application Windows Forms. La page est une application de saisie de données simple empaquetée dans une DLL. Cet exemple est conçu pour être presque identique en termes d'apparence et de fonctionnalités à Hébergement d'un contrôle composite Windows Forms dans Windows Presentation Foundation, exemple. La différence principale est que le scénario d'hébergement est inversé.

Remarque :

La page hébergée n'est pas un contrôle WPF dans le sens strict du terme. Il s'agit plutôt d'une page WPF ordinaire empaquetée dans une DLL. Toutefois, les techniques pour héberger un contrôle WPF sur un formulaire sont identiques à celles utilisées pour héberger une page ordinaire. Pour une description supplémentaire des contrôles WPF, consultez Personnalisation des contrôles.

La procédure pas à pas est divisée en deux sections. La première section décrit brièvement l'implémentation de la page WPF. La deuxième section explique en détail comment héberger la page dans une application Windows Forms, recevoir des événements de la page, et accéder à quelques-unes des propriétés de la page.

Cette procédure pas à pas illustre les tâches suivantes :

  • Implémentation de la page Windows Presentation Foundation.

  • Implémentation de l'application hôte Windows Forms.

Pour obtenir l'intégralité du code correspondant aux tâches illustrées dans cette procédure pas à pas, consultez Hébergement d'un contrôle Windows Presentation Foundation simple dans les Windows Forms, exemple.

Composants requis

Les composants suivants sont nécessaires pour exécuter cette procédure pas à pas :

  • Visual Studio 2008.

Implémentation de la page Windows Presentation Foundation

La page WPF utilisée dans cet exemple est un formulaire de saisie de données simple qui prend le nom et l'adresse de l'utilisateur. Lorsque l'utilisateur clique sur l'un des deux boutons pour indiquer que la tâche est finie, la page déclenche un événement personnalisé pour retourner cette information à l'hôte. La forme et la fonction de cette page sont essentiellement identique à celles du contrôle Windows Forms utilisé dans Procédure pas à pas : hébergement d'un contrôle composite Windows Forms dans Windows Presentation Foundation. Il n'y a rien de spécial à faire pour personnaliser la page pour l'hébergement sur un formulaire Windows Forms. Vous pouvez tout aussi facilement la charger dans un Frame sur une plus grande page WPF. L'illustration suivante montre la page rendue.

Page Windows Presentation Foundation

Contrôle WPF simple

Création du projet

Pour commencer le projet :

  1. Lancez Microsoft Visual Studio, et ouvrez la boîte de dialogue Nouveau projet.

  2. Sélectionnez le modèle Application de navigateur WPF.

  3. Nommez le nouveau projet MyControls et placez-le dans un dossier à la racine portant un nom pratique, par exemple, WfHostingWpf. Ultérieurement, vous placerez également l'application hôte dans ce dossier. Cliquez sur OK pour créer le projet. Le projet par défaut contient une seule page nommée Page1.

  4. Cliquez avec le bouton droit sur le nom du projet dans l'Explorateur de solutions, puis cliquez sur Propriétés.

  5. Définissez le Type de sortie à Bibliothèque de classes pour compiler la page comme une DLL.

  6. Supprimez les fichiers de définition d'application, MyApp.xaml et MyApp.xaml.cs, du projet. Vous avez besoin de ces fichiers uniquement si vous implémentez la page comme une application.

Remarque :

Lorsque vous compilez une application WPF comme une bibliothèque de classes, vous ne pouvez pas la lancer pour consulter la page rendue. Pour cette raison, il peut être pratique de conserver le type de sortie "Application Windows" jusqu'à ce que l'application soit complètement implémentée. Cela vous permet de vérifier l'apparence des pages en lançant l'application. Lorsque vous êtes satisfait, supprimez les fichiers de définition d'application et modifiez le type de sortie en "Bibliothèque de classes" pour la compiler comme une DLL.

Votre projet doit avoir des références aux DLL système suivantes. Si une de ces DLL n'est pas incluses par défaut, ajoutez-la à votre projet.

  • System

  • PresentationCore

  • PresentationFramework

  • WindowsBase

Implémentation de l'interface utilisateur de la page

L'interface utilisateur (UI) de la page WPF est implémentée avec XAML (Extensible Application Markup Language). Elle est conçue pour être semblable dans l'apparence et les fonctionnalités au contrôle Windows Forms décrit dans Procédure pas à pas : hébergement d'un contrôle composite Windows Forms dans Windows Presentation Foundation. L'interface utilisateur de saisie de données de la page se compose de cinq éléments TextBox. Chaque élément TextBox a un élément TextBlock associé qui sert d'étiquette. Il y a deux éléments Button en bas de la page, OK et Annuler. Lorsque l'utilisateur clique sur un bouton, la page déclenche un événement personnalisé pour retourner les informations à l'hôte.

Disposition de base

Plusieurs éléments de l'interface utilisateur sont contenus dans un élément Grid. Vous pouvez utiliser Grid pour réorganiser le contenu de la page de la même façon que si vous utilisiez un élément Table en HTML. WPF a également un élément Table, mais Grid est plus léger et convient mieux pour les tâches de disposition simples.

L'exemple suivant illustre un code de disposition de base. Ce code définit la structure globale de la page en spécifiant le nombre de colonnes et lignes dans l'élément Grid. Utilisez-le pour remplacer le code dans Page1.xaml.

<Grid xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
      x:Class="MyControls.Page1"
      Background="#DCDCDC"
      Width="375"
      Height="250"
      Name="rootElement"
      Loaded="Init">


...


<Grid.ColumnDefinitions>
  <ColumnDefinition Width="Auto" />
  <ColumnDefinition Width="Auto" />
  <ColumnDefinition Width="Auto"/>
  <ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>

<Grid.RowDefinitions>
  <RowDefinition Height="Auto" />
  <RowDefinition Height="Auto" />
  <RowDefinition Height="Auto" />
  <RowDefinition Height="Auto" />
  <RowDefinition Height="Auto" />
  <RowDefinition Height="Auto" />
</Grid.RowDefinitions>

Ajout d'éléments TextBlock et TextBox à la grille

Vous placez un élément de l'interface utilisateur dans la grille en définissant les attributs RowProperty et ColumnProperty de l'élément sur la ligne et dans la colonne appropriées. Souvenez-vous que la numérotation de la ligne et de la colonne est de base zéro. Vous pouvez avoir un élément qui couvre plusieurs colonnes en définissant son attribut ColumnSpanProperty. Pour plus d'informations sur les éléments Grid, consultez Comment : créer un élément de grille.

L'exemple suivant affiche les éléments TextBox et TextBlock de la page avec les leurs attributs RowProperty et ColumnProperty, configurés pour placer correctement les éléments dans la grille. Ajoutez ce code à Page1.xaml, juste au-dessous de l'élément Grid.

<TextBlock Grid.Column="0"
      Grid.Row="0" 
      Grid.ColumnSpan="4"
      Margin="10,5,10,0"
      HorizontalAlignment="Center"
      Style="{StaticResource titleText}">Simple WPF Control</TextBlock>

<TextBlock Grid.Column="0"
      Grid.Row="1"
      Style="{StaticResource inlineText}"
      Name="nameLabel">Name</TextBlock>
<TextBox Grid.Column="1"
      Grid.Row="1"
      Grid.ColumnSpan="3"
      Name="txtName"/>

<TextBlock Grid.Column="0"
      Grid.Row="2"
      Style="{StaticResource inlineText}"
      Name="addressLabel">Street Address</TextBlock>
<TextBox Grid.Column="1"
      Grid.Row="2"
      Grid.ColumnSpan="3"
      Name="txtAddress"/>

<TextBlock Grid.Column="0"
      Grid.Row="3"
      Style="{StaticResource inlineText}"
      Name="cityLabel">City</TextBlock>
<TextBox Grid.Column="1"
      Grid.Row="3"
      Width="100"
      Name="txtCity"/>

<TextBlock Grid.Column="2"
      Grid.Row="3"
      Style="{StaticResource inlineText}"
      Name="stateLabel">State</TextBlock>
<TextBox Grid.Column="3"
      Grid.Row="3"
      Width="50"
      Name="txtState"/>

<TextBlock Grid.Column="0"
      Grid.Row="4"
      Style="{StaticResource inlineText}"
      Name="zipLabel">Zip</TextBlock>
<TextBox Grid.Column="1"
      Grid.Row="4"
      Width="100"
      Name="txtZip"/>

Application de style aux éléments de l'interface utilisateur

Nombre d'éléments du formulaire de saisie de données ont une apparence semblable, ce qui signifie qu'ils ont des paramètres identiques pour plusieurs de leurs propriétés. Plutôt que définir séparément les attributs de chaque élément, l'exemple de code utilise des éléments Style pour définir des paramètres de propriété standard pour les classes d'éléments. Cette approche réduit la complexité de la page et vous permet de modifier l'apparence de plusieurs éléments à l'aide d'un attribut de style unique.

Les éléments Style sont contenus dans la propriété Resources de l'élément Grid, donc ils peuvent être utilisés dans la page par tous les éléments. Si un style est nommé, vous l'appliquez à un élément en ajoutant un élément Style défini au nom du style. Les styles qui ne sont pas nommés deviennent le style par défaut pour l'élément. Pour plus d'informations sur les styles WPF, consultez Application d'un style et création de modèles.

L'exemple suivant montre les éléments Style pour la page WPF. Ajoutez le code à Page1.xaml, juste au-dessous de l'élément Grid. Pour voir comment les styles sont appliqués aux éléments, consultez l'exemple de code précédent. Par exemple, le dernier élément TextBlock a le style inlineText, et le dernier élément TextBox utilise le style par défaut.

<Grid.Resources>
  <Style x:Key="inlineText" TargetType="{x:Type TextBlock}">
    <Setter Property="Margin" Value="10,5,10,0"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="FontSize" Value="12"/>
  </Style>
  <Style x:Key="titleText" TargetType="{x:Type TextBlock}">
    <Setter Property="DockPanel.Dock" Value="Top"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FontSize" Value="14"/>
    <Setter Property="Margin" Value="10,5,10,0"/>
  </Style>
  <Style TargetType="{x:Type Button}">
    <Setter Property="Margin" Value="10,5,10,0"/>
    <Setter Property="Width" Value="60"/>
  </Style>
  <Style TargetType="{x:Type TextBox}">
    <Setter Property="Margin" Value="10,5,10,0"/>
  </Style>
</Grid.Resources>

Ajout des boutons OK et Annuler

Les derniers éléments dans la page sont les éléments OK et AnnulerButton, qui occupent les deux premières colonnes de la dernière ligne du Grid. Ces éléments utilisent un gestionnaire d'événements commun, ButtonClicked et le style Button par défaut défini dans l'exemple de code précédent. Ajoutez le code suivant à Page1.xaml, juste au-dessous du dernier élément TextBox. La partie XAML de la page est maintenant complète.

<Button Grid.Row="5"
        Grid.Column="0"
        Name="btnOK"
        Click="ButtonClicked">OK</Button>
<Button Grid.Row="5"
        Grid.Column="1"
        Name="btnCancel"
        Click="ButtonClicked">Cancel</Button>

Implémentation du fichier Code-behind de la page

Le fichier code-behind de la page WPF, Page1.xaml.cs, implémente quatre tâches essentielles :

  1. Enregistre le nom de DLL de la page avec l'objet Application, afin de savoir à partir d'où il doit charger la page.

  2. Gère l'événement qui se produit lorsque l'utilisateur clique sur l'un des boutons.

  3. Récupère les données des éléments TextBox, et les empaquette dans un objet d'argument d'événement personnalisé.

  4. Déclenche l'événement OnButtonClick personnalisé, qui notifie l'hôte que l'utilisateur a fini et renvoie les données à l'hôte.

La page expose également plusieurs propriétés de couleur et police qui vous permettent de contrôler l'apparence de la page. Contrairement à la classe WindowsFormsHost, utilisée pour héberger un contrôle Windows Forms, la classe ElementHost expose uniquement la propriété Background de la page. Pour maintenir la ressemblance entre cet exemple de code et l'exemple décrit dans Procédure pas à pas : hébergement d'un contrôle composite Windows Forms dans Windows Presentation Foundation, la page expose directement les propriétés restantes.

Structure de base du fichier code-behind

Le fichier code-behind se compose d'un espace de noms unique, MyControls, qui contient deux classes, Page1 et MyControlEventArgs. Remplacez le code dans Page1.xaml.cs par les éléments suivants :

using System;
using System.Windows;
using System.Windows.Navigation;
using System.Windows.Controls;
using System.Windows.Media;

namespace MyControls
{
  public partial class Page1 : Grid
  {
    //...
  }
  public class MyControlEventArgs : EventArgs
  {
    //...
  }
}

La première classe, Page1, est une classe partielle qui contient le code qui implémente les fonctionnalités de l'interface utilisateur définie dans Page1.xaml. Lorsque Page1.xaml est analysé, le code XAML est converti en la même classe partielle, et les deux classes partielles sont fusionnées pour former la page compilée. Pour cette raison, le nom de classe dans le fichier code-behind doit correspondre au nom de classe assigné à Page1.xaml, et il doit hériter de l'élément racine de la page. La deuxième classe, MyControlEventArgs, est une classe d'arguments d'événement utilisée pour renvoyer les données à l'hôte.

Initialisation de la classe Page1

L'exemple de code suivant implémente plusieurs tâches de base :

  • Déclare un événement privé, OnButtonClick et son délégué associé, MyControlEventHandler.

  • Crée plusieurs variables globales privées qui stockent les données de l'utilisateur. Ces données sont exposées à l'aide des propriétés correspondantes.

  • Implémente un gestionnaire, Init, pour l'événement Loaded de la page. Ce gestionnaire initialise les variables globales en leur assignant les valeurs définies dans Page1.xaml. Pour ce faire, il utilise le Name assigné à un élément TextBlock typique, nameLabel, pour accéder aux paramètres de propriété de cet élément.

Ajoutez le code suivant à la classe Page1.

public partial class Page1 : Grid
{
    public delegate void MyControlEventHandler(object sender, MyControlEventArgs args);
    public event MyControlEventHandler OnButtonClick;
    private FontWeight _fontWeight;
    private double _fontSize;
    private FontFamily _fontFamily;
    private FontStyle _fontStyle;
    private SolidColorBrush _foreground;
    private SolidColorBrush _background;

    private void Init(object sender, EventArgs e)
    {
        //They all have the same style, so use nameLabel to set initial values.
        _fontWeight = nameLabel.FontWeight;
        _fontSize = nameLabel.FontSize;
        _fontFamily = nameLabel.FontFamily;
        _fontStyle = nameLabel.FontStyle;
        _foreground = (SolidColorBrush)nameLabel.Foreground;
        _background = (SolidColorBrush)rootElement.Background;
    }

Gestion des événements Click des boutons

L'utilisateur indique que la tâche de saisie de données est finie en cliquant sur le bouton OK ou le bouton Annuler en bas de page. Les deux boutons utilisent le même gestionnaire d'événements Click, ButtonClicked. Les deux boutons ont un nom, btnOK ou btnFalse, qui permet au gestionnaire de déterminer quel bouton a été utilisé en examinant la valeur de l'argument sender. Le gestionnaire effectue les opérations suivantes :

  • Crée un objet MyControlEventArgs qui contient les données des éléments TextBox de la page.

  • Si l'utilisateur a cliqué sur le bouton Annuler, affecte false à la propriété IsOK de l'objet MyControlEventArgs.

  • Déclenche l'événement OnButtonClick pour indiquer à l'hôte que l'utilisateur a fini, et passe à nouveau les données recueillies.

Ajoutez le code suivant à votre classe Page1, au-dessous de la méthode Init.

private void ButtonClicked(object sender, RoutedEventArgs e)
{
    MyControlEventArgs retvals = new MyControlEventArgs(true,
                                                        txtName.Text,
                                                        txtAddress.Text,
                                                        txtCity.Text,
                                                        txtState.Text,
                                                        txtZip.Text);
    if (sender == btnCancel)
    {
        retvals.IsOK = false;
    }
    if (OnButtonClick != null)
        OnButtonClick(this, retvals);
}

Création de propriétés

Le reste de la classe expose simplement les propriétés qui correspondent aux variables globales décrites ci-dessus. Lorsqu'une propriété change, l'accesseur set modifie l'apparence de la page en modifiant les propriétés des éléments correspondantes et en mettant à jour les variables globales sous-jacentes.

Ajoutez le code suivant à votre classe Page1.

public FontWeight MyControl_FontWeight
{
    get { return _fontWeight; }
    set
    {
        _fontWeight = value;
        nameLabel.FontWeight = value;
        addressLabel.FontWeight = value;
        cityLabel.FontWeight = value;
        stateLabel.FontWeight = value;
        zipLabel.FontWeight = value;
    }
}
public double MyControl_FontSize
{
    get { return _fontSize; }
    set
    {
        _fontSize = value;
        nameLabel.FontSize = value;
        addressLabel.FontSize = value;
        cityLabel.FontSize = value;
        stateLabel.FontSize = value;
        zipLabel.FontSize = value;
    }
}
public FontStyle MyControl_FontStyle
{
    get { return _fontStyle; }
    set
    {
        _fontStyle = value;
        nameLabel.FontStyle = value;
        addressLabel.FontStyle = value;
        cityLabel.FontStyle = value;
        stateLabel.FontStyle = value;
        zipLabel.FontStyle = value;
    }
}
public FontFamily MyControl_FontFamily
{
    get { return _fontFamily; }
    set
    {
        _fontFamily = value;
        nameLabel.FontFamily = value;
        addressLabel.FontFamily = value;
        cityLabel.FontFamily = value;
        stateLabel.FontFamily = value;
        zipLabel.FontFamily = value;
    }
}

public SolidColorBrush MyControl_Background
{
    get { return _background; }
    set
    {
        _background = value;
        rootElement.Background = value;
    }
}
public SolidColorBrush MyControl_Foreground
{
    get { return _foreground; }
    set
    {
        _foreground = value;
        nameLabel.Foreground = value;
        addressLabel.Foreground = value;
        cityLabel.Foreground = value;
        stateLabel.Foreground = value;
        zipLabel.Foreground = value;
    }
}

Renvoi de données à l'hôte

Le dernier composant dans le fichier est la classe MyControlEventArgs, utilisée pour renvoyer les données recueillies à l'hôte. Ajoutez le code suivant à votre espace de noms MyControls. L'implémentation est simple et n'est pas décrite ultérieurement.

public class MyControlEventArgs : EventArgs
{
    private string _Name;
    private string _StreetAddress;
    private string _City;
    private string _State;
    private string _Zip;
    private bool _IsOK;

    public MyControlEventArgs(bool result,
                              string name,
                              string address,
                              string city,
                              string state,
                              string zip)
    {
        _IsOK = result;
        _Name = name;
        _StreetAddress = address;
        _City = city;
        _State = state;
        _Zip = zip;
    }

    public string MyName
    {
        get { return _Name; }
        set { _Name = value; }
    }
    public string MyStreetAddress
    {
        get { return _StreetAddress; }
        set { _StreetAddress = value; }
    }
    public string MyCity
    {
        get { return _City; }
        set { _City = value; }
    }
    public string MyState
    {
        get { return _State; }
        set { _State = value; }
    }
    public string MyZip
    {
        get { return _Zip; }
        set { _Zip = value; }
    }
    public bool IsOK
    {
        get { return _IsOK; }
        set { _IsOK = value; }
    }
}

Implémentation de l'application hôte Windows Forms

L'application hôte Windows Forms utilise un objet ElementHost pour héberger la page WPF sur le formulaire. L'application gère l'événement OnButtonClick de la page pour recevoir les données du formulaire. L'application a également un jeu de cases d'option que vous pouvez utiliser pour modifier l'apparence de la page. La capture d'écran suivante illustre le formulaire rendu.

Page Windows Presentation Foundation hébergée dans une application Windows Forms

Contrôle Avalon d'hébergement Windows Forms

Création du projet

Pour commencer le projet :

  1. Lancez Visual Studio, et ouvrez la boîte de dialogue Nouveau projet.

  2. Sélectionnez Projets C# avec le modèle Application Windows Forms.

  3. Nommez le nouveau projet WFHost et placez-le dans le même dossier à la racine qui contient le projet MyControls. Cliquez sur OK pour créer le projet.

Vous devez également ajouter une référence à la DLL qui contient la page WPF :

  1. Cliquez sur le nom du projet dans l'Explorateur de solutions, puis sélectionnez Ajouter une référence.

  2. Cliquez sur l'onglet Parcourir et naviguez jusqu'au dossier qui contient MyControls.dll.

  3. Sélectionnez MyControls.dll et cliquez sur OK pour ajouter la DLL à la liste de références.

  4. Dans l'Explorateur de solutions, ajoutez une référence à l'assembly WindowsFormsIntegration nommé WindowsFormsIntegration.dll.

Implémentation du design de l'interface utilisateur du formulaire

Ouvrez le Concepteur Windows Forms, et exposez le formulaire tel qu'il apparaît dans l'illustration affichée dans Implémentation de l'application hôte Windows Forms :

  1. Développez le formulaire par défaut pour accommoder les contrôles et la page WPF.

  2. Ajoutez un contrôle System.Windows.Forms.Panel dans le coin supérieur droit du formulaire pour contenir la page WPF.

  3. Ajoutez six jeux de contrôles System.Windows.Forms.RadioButton, comme affiché dans l'illustration.

  4. Ajoutez cinq contrôles System.Windows.Forms.Label dans le coin inférieur droit du formulaire, comme affiché dans l'illustration. Ces contrôles font office d'étiquettes pour les données retournées par le contrôle WPF.

  5. Ajoutez un contrôle Label à droite de chaque contrôle Label ajouté dans l'étape précédente. Affectez "" à la propriété Text de chaque contrôle. Ces contrôles affichent les données retournées par le contrôle WPF.

  6. Ajoutez un autre contrôle Label qui sera utilisé comme titre pour le groupe de contrôles des deux dernières étapes. Étant donné que ce Label est destiné à être utilisé comme titre pour le groupe, augmentez la taille de police de deux points par rapport à celle des contrôles dans le groupe.

Initialisation du formulaire

Vous implémentez généralement le code d'hébergement dans le gestionnaire d'événements Load du formulaire. Dans le Concepteur Windows Forms, doublez-cliquez sur le formulaire pour créer une méthode de gestionnaire d'événements Load. L'exemple de code suivant inclut le gestionnaire d'événements Load de l'exemple, un gestionnaire pour l'événement Loaded de la page WPF, et les déclarations pour plusieurs variables globales utilisées ultérieurement. Remplacez le code dans Form1.cs par les éléments suivants :

partial class Form1 : Form
{
    private ElementHost ctrlHost;
    private MyControls.Page1 wpfAddressCtrl;
    System.Windows.FontWeight initFontWeight;
    double initFontSize;
    System.Windows.FontStyle initFontStyle;
    System.Windows.Media.SolidColorBrush initBackBrush;
    System.Windows.Media.SolidColorBrush initForeBrush;
    FontFamily initFontFamily;

    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        ctrlHost = new ElementHost();
        ctrlHost.Dock = DockStyle.Fill;
        panel1.Controls.Add(ctrlHost);
        wpfAddressCtrl = new MyControls.Page1();
        wpfAddressCtrl.InitializeComponent();
        ctrlHost.Child = wpfAddressCtrl;

        wpfAddressCtrl.OnButtonClick += 
            new MyControls.Page1.MyControlEventHandler(
            avAddressCtrl_OnButtonClick);
        wpfAddressCtrl.Loaded += new RoutedEventHandler(
            avAddressCtrl_Loaded);
    }

    void avAddressCtrl_Loaded(object sender, EventArgs e)
    {
        initBackBrush = (SolidColorBrush)wpfAddressCtrl.MyControl_Background;
        initForeBrush = wpfAddressCtrl.MyControl_Foreground;
        initFontFamily = wpfAddressCtrl.MyControl_FontFamily;
        initFontSize = wpfAddressCtrl.MyControl_FontSize;
        initFontWeight = wpfAddressCtrl.MyControl_FontWeight;
        initFontStyle = wpfAddressCtrl.MyControl_FontStyle;
    }

La méthode Form1_Load dans l'exemple de code précédent affiche la procédure générale pour héberger un contrôle WPF :

  1. Créez un nouvel objet ElementHost.

  2. Affectez DockStyle.Fill à la propriété Dock du contrôle.

  3. Ajoutez le contrôle ElementHost à la collection Controls du contrôle Panel.

  4. Créez une instance de la page WPF.

  5. Hébergez la page sur le formulaire en assignant la page à la propriété Child du contrôle ElementHost.

Les deux lignes restantes dans la méthode Form1_Load associent les gestionnaires à deux événements de page :

  • OnButtonClick est un événement personnalisé déclenché par la page lorsque l'utilisateur clique sur le bouton OK ou Annuler. Vous gérez l'événement pour obtenir la réponse de l'utilisateur et rassembler toutes les données renseignées par l'utilisateur.

  • Loaded est un événement standard déclenché par une page WPF lorsqu'elle est entièrement chargée. L'événement est utilisé ici parce que l'exemple doit initialiser plusieurs variables globales à l'aide de propriétés de la page. Lorsque l'événement Load du formulaire se produit, la page n'est pas chargée pleinement et ces valeurs sont encore null. Vous devez attendre jusqu'à ce que l'événement Loaded de la page se produise avant de pouvoir accéder à ces propriétés.

Le gestionnaire d'événements Loaded est affiché dans l'exemple de code précédent. Le gestionnaire OnButtonClick est présenté dans la section suivante.

Gestion d'OnButtonClick

L'événement OnButtonClick se produit lorsque l'utilisateur clique sur le bouton OK ou Annuler.

Le gestionnaire d'événements vérifie le champ IsOK de l'argument d'événement pour déterminer quel bouton a été utilisé. Les lblvariables de données correspondent aux contrôles Label invisibles décrits précédemment. Si l'utilisateur a cliqué sur le bouton OK, les données des contrôles TextBox de la page sont assignées au contrôle Label correspondant. Si l'utilisateur a cliqué sur Annuler, les valeurs Text sont null.

Ajoutez le code suivant à Form1.cs. Vous pouvez maintenant compiler et exécuter l'application.

void avAddressCtrl_OnButtonClick(
    object sender, 
    MyControls.MyControlEventArgs args)
{
    if (args.IsOK)
    {
        lblAddress.Text = "Street Address: " + args.MyStreetAddress;
        lblCity.Text = "City: " + args.MyCity;
        lblName.Text = "Name: " + args.MyName;
        lblState.Text = "State: " + args.MyState;
        lblZip.Text = "Zip: " + args.MyZip;
    }
    else
    {
        lblAddress.Text = "Street Address: ";
        lblCity.Text = "City: ";
        lblName.Text = "Name: ";
        lblState.Text = "State: ";
        lblZip.Text = "Zip: ";
    }
}

Modification de l'apparence de la page Windows Presentation Foundation

Les contrôles RadioButton sur le côté gauche du formulaire permettent à l'utilisateur de modifier les premier plan et couleurs d'arrière-plan de la page WPF ainsi que plusieurs propriétés de police. La couleur d'arrière-plan est exposée par l'objet ElementHost. Les propriétés restantes sont exposées comme propriétés personnalisées de la page.

Double-cliquez sur les contrôles RadioButton sur le formulaire pour créer des modèles pour les gestionnaires d'événements CheckedChanged correspondants. Extrayez le code des gestionnaires suivants et ajoutez-le aux gestionnaires correspondants dans Form1.cs.

private void radioBackgroundOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = initBackBrush;
}

private void radioBackgroundLightGreen_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = new SolidColorBrush(Colors.LightGreen);
}

private void radioBackgroundLightSalmon_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = new SolidColorBrush(Colors.LightSalmon);
}

private void radioForegroundOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = initForeBrush;
}

private void radioForegroundRed_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = new System.Windows.Media.SolidColorBrush(Colors.Red);
}

private void radioForegroundYellow_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = new System.Windows.Media.SolidColorBrush(Colors.Yellow);
}

private void radioFamilyOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = initFontFamily;
}

private void radioFamilyTimes_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = new FontFamily("Times New Roman");
}

private void radioFamilyWingDings_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = new FontFamily("WingDings");
}

private void radioSizeOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = initFontSize;
}

private void radioSizeTen_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = 10;
}

private void radioSizeTwelve_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = 12;
}

private void radioStyleOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontStyle = initFontStyle;
}

private void radioStyleItalic_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontStyle = System.Windows.FontStyles.Italic;
}

private void radioWeightOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontWeight = initFontWeight;
}

private void radioWeightBold_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontWeight = FontWeights.Bold;
}

Voir aussi

Tâches

Procédure pas à pas : hébergement d'un contrôle composite Windows Presentation Foundation dans les Windows Forms

Concepts

Procédure pas à pas : hébergement d'un contrôle composite Windows Forms dans Windows Presentation Foundation

Référence

ElementHost

WindowsFormsHost

Autres ressources

Concepteur WPF