Partager via


Procédure pas à pas : disposition de contrôles Windows Forms dans Windows Presentation Foundation

Mise à jour : novembre 2007

Cette procédure pas à pas indique comment utiliser les fonctionnalités de présentation WPF pour réorganiser des contrôles Windows Forms dans une application hybride.

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

  • Création du projet.

  • Utilisation des paramètres de présentation par défaut.

  • Dimensionnement relatif au contenu.

  • Utilisation de positions absolues.

  • Spécification explicite de la taille.

  • Définition des propriétés de présentation.

  • Présentation des limitations dans l'ordre de plan.

  • Ancrage.

  • Définition de la visibilité.

  • Hébergement d'un contrôle qui ne s'étire pas.

  • Mise à l'échelle.

  • Rotation.

  • Définition de marge intérieure et de marges.

  • Utilisation de conteneurs de présentation dynamiques.

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

Lorsque vous avez terminé, vous disposez de connaissances relatives aux fonctionnalités de présentation Windows Forms dans des applications WPF.

Remarque :

Selon vos paramètres actifs ou votre édition, les boîtes de dialogue et les commandes de menu que vous voyez peuvent différer de celles qui sont décrites dans l'aide. Pour modifier vos paramètres, choisissez Importation et exportation de paramètres dans le menu Outils. Pour plus d'informations, consultez Paramètres Visual Studio.

Composants requis

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

  • Visual Studio 2008.

Création du projet

Pour créer et paramétrer le projet

  1. Créez un projet Application WPF nommé WpfLayoutHostingWf.

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

  3. Dans l'Explorateur de solutions, ajoutez une référence à l'assembly System.Windows.Forms nommé System.Windows.Forms.dll. Ajoutez aussi une référence à l'assembly System.Drawing, nommé System.Drawing.dll.

  4. Double-cliquez sur Window1.xaml pour l'ouvrir dans l'affichage XAML.

  5. Au démarrage du fichier, mappez l'espace de noms Windows Forms avec le code suivant.

    <Window x:Class="Window1"
        xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"  
        Title="Layout Demo for Interoperability"
        >
    
    <Window x:Class="WpfLayoutHostingWfWithXaml.Window1"
        xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"  
        Title="Layout Demo for Interoperability"
        >
    
  6. Définissez l'élément par défaut Grid en créant cinq lignes et trois colonnes.

    <Grid ShowGridLines="True">
      <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
      </Grid.RowDefinitions>
    
      <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
      </Grid.ColumnDefinitions>
    
    <Grid ShowGridLines="true">
      <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
      </Grid.RowDefinitions>
    
      <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
      </Grid.ColumnDefinitions>
    

Utilisation des paramètres de présentation par défaut

Par défaut, l'élément WindowsFormsHost gère la présentation du contrôle Windows Forms hébergé.

Pour utiliser les paramètres de présentation par défaut

  1. Copiez le code suivant dans l'élément Grid.

    <!-- Default layout. -->
    <Canvas Grid.Row="0" Grid.Column="0">
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Default layout. -->
    <Canvas Grid.Row="0" Grid.Column="0">
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. Le contrôle Windows FormsSystem.Windows.Forms.Button apparaît dans le Canvas. Le contrôle hébergé est dimensionné selon son contenu et l'élément WindowsFormsHost est dimensionné selon le contrôle hébergé.

Dimensionnement relatif au contenu

L'élément WindowsFormsHost s'assure que le contrôle hébergé est dimensionné pour afficher correctement son contenu.

Pour dimensionner selon le contenu

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Sizing to content. -->
    <Canvas Grid.Row="1" Grid.Column="0">
      <WindowsFormsHost Background="Orange">
        <wf:Button Text="Windows Forms control with more content" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <Canvas Grid.Row="2" Grid.Column="0">
      <WindowsFormsHost FontSize="24" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Sizing to content. -->
    <Canvas Grid.Row="1" Grid.Column="0">
      <WindowsFormsHost Background="Orange">
        <wf:Button Text="Windows Forms control with more content" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <Canvas Grid.Row="2" Grid.Column="0">
      <WindowsFormsHost FontSize="24" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. Les deux nouveaux contrôles bouton sont dimensionnés pour afficher la chaîne de texte la plus longue et la taille de police la plus grande, et les éléments WindowsFormsHost sont redimensionnés pour contenir les contrôles hébergés.

Utilisation de positions absolues

Vous pouvez utiliser les positions absolues pour placer l'élément WindowsFormsHost n'importe où dans l'interface utilisateur.

Pour utiliser des positions absolues

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Absolute positioning. -->
    <Canvas Grid.Row="3" Grid.Column="0">
      <WindowsFormsHost Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control with absolute positioning" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Absolute positioning. -->
    <Canvas Grid.Row="3" Grid.Column="0">
      <WindowsFormsHost Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control with absolute positioning" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost est positionné à 20 pixels du haut de la cellule de grille et à 20 pixels en partant de la gauche.

Spécification explicite de la taille

Vous pouvez spécifier la taille de l'élément WindowsFormsHost en utilisant les propriétés Width et Height.

Pour spécifier explicitement la taille

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Explicit sizing. -->
    <Canvas Grid.Row="4" Grid.Column="0">
      <WindowsFormsHost Width="50" Height="70" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Explicit sizing. -->
    <Canvas Grid.Row="4" Grid.Column="0">
      <WindowsFormsHost Width="50" Height="70" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost a une taille de 50 pixels en largeur et de 70 pixels en hauteur, qui est inférieure aux paramètres de présentation par défaut. Le contenu du contrôle Windows Forms est réorganisé en conséquence.

Définition des propriétés de présentation

Définissez toujours les propriétés de présentation sur le contrôle hébergé en utilisant les propriétés de l'élément WindowsFormsHost. Si vous définissez les propriétés de présentation directement sur le contrôle hébergé, vous obtiendrez des résultats inattendus.

La définition des propriétés de présentation sur le contrôle hébergé en XAML est sans effet.

Pour afficher les effets de la définition des propriétés sur le contrôle hébergé

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Setting hosted control properties directly. -->
    <Canvas Grid.Row="0" Grid.Column="1">
      <WindowsFormsHost Width="160" Height="50" Background="Yellow">
        <wf:Button Name="button1" Click="button1Click" Text="Click me" FlatStyle="Flat" BackColor="Green"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Setting hosted control properties directly. -->
    <Canvas Grid.Row="0" Grid.Column="1">
      <WindowsFormsHost Width="160" Height="50" Background="Yellow">
        <wf:Button Name="button1" Click="button1Click" Text="Click me" FlatStyle="Flat" BackColor="Green"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Dans l'Explorateur de solutions, double-cliquez sur Window1.xaml.cs afin de l'ouvrir dans l'éditeur de code.

  3. Copiez le code suivant dans la définition de classe Window1, après le constructeur Window1().

    Private Sub button1Click(ByVal sender As Object, ByVal e As EventArgs)
        Dim b As System.Windows.Forms.Button = sender
    
        b.Top = 20
        b.Left = 20
    
    End Sub
    
    private void button1Click(object sender, EventArgs e )
    {
        System.Windows.Forms.Button b = sender as System.Windows.Forms.Button;
    
        b.Top = 20;
        b.Left = 20;
    }
    
  4. Appuyez sur F5 pour générer et exécuter l'application.

  5. Cliquez sur le bouton Cliquez sur moi. Le gestionnaire d'événements button1Click définit les propriétés Top et Left sur le contrôle hébergé. Le contrôle hébergé est ainsi repositionné dans l'élément WindowsFormsHost. L'hôte conserve la même zone d'écran, mais le contrôle hébergé est découpé. À la place, le contrôle hébergé doit toujours remplir l'élément WindowsFormsHost.

Présentation des limitations dans l'ordre de plan

Les éléments WindowsFormsHost visibles sont toujours dessinés sur d'autres éléments WPF, et ils ne sont pas affectés par l'ordre de plan.

Pour afficher les limitations dans l'ordre de plan

  1. Dans le fichier Window1.xaml, copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Z-order demonstration. -->
    <Canvas Grid.Row="1" Grid.Column="1">
      <Label Content="A WPF label" FontSize="24"/>
      <WindowsFormsHost Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Z-order demonstration. -->
    <Canvas Grid.Row="1" Grid.Column="1">
      <Label Content="A WPF label" FontSize="24"/>
      <WindowsFormsHost Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost est peint sur l'élément label.

Ancrage

L'élément WindowsFormsHost prend en charge l'ancrage WPF. Définissez la propriété attachée Dock pour ancrer le contrôle hébergé dans un élément DockPanel.

Pour ancrer un contrôle hébergé

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Docking a WindowsFormsHost element. -->
    <DockPanel LastChildFill="false"  Grid.Row="2" Grid.Column="1">
      <WindowsFormsHost DockPanel.Dock="Right"  Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </DockPanel>
    
    <!-- Docking a WindowsFormsHost element. -->
    <DockPanel LastChildFill="false"  Grid.Row="2" Grid.Column="1">
      <WindowsFormsHost DockPanel.Dock="Right"  Canvas.Top="20" Canvas.Left="20" Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </DockPanel>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost est ancré à droite de l'élément DockPanel.

Définition de la visibilité

Vous pouvez faire en sorte que le contrôle Windows Forms soit invisible ou réduit en définissant la propriété Visibility sur l'élément WindowsFormsHost. Lorsqu'un contrôle est invisible, il n'est pas affiché, mais il occupe l'espace de présentation. Lorsqu'un contrôle est réduit, il n'est pas affiché, et n'occupe pas l'espace de présentation.

Pour définir la visibilité d'un contrôle hébergé

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Setting Visibility to hidden and collapsed. -->
    <StackPanel Grid.Row="3" Grid.Column="1">
      <Button Name="button2" Click="button2Click" Content="Click to make invisible" Background="OrangeRed"/>
      <WindowsFormsHost Name="host1"  Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
      <Button Name="button3" Click="button3Click" Content="Click to collapse" Background="OrangeRed"/>
    </StackPanel>
    
    <!-- Setting Visibility to hidden and collapsed. -->
    <StackPanel Grid.Row="3" Grid.Column="1">
      <Button Name="button2" Click="button2Click" Content="Click to make invisible" Background="OrangeRed"/>
      <WindowsFormsHost Name="host1"  Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
      <Button Name="button3" Click="button3Click" Content="Click to collapse" Background="OrangeRed"/>
    </StackPanel>
    
  2. Dans l'Explorateur de solutions, double-cliquez sur Window1.xaml.cs afin de l'ouvrir dans l'éditeur de code.

  3. Copiez le code suivant dans la définition de classe Window1.

    Private Sub button2Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
        Me.host1.Visibility = Windows.Visibility.Hidden
    End Sub
    
    
    Private Sub button3Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
        Me.host1.Visibility = Windows.Visibility.Collapsed
    End Sub
    
    private void button2Click(object sender, EventArgs e)
    {
        this.host1.Visibility = Visibility.Hidden;
    }
    
    private void button3Click(object sender, EventArgs e)
    {
        this.host1.Visibility = Visibility.Collapsed;
    }
    
  4. Appuyez sur F5 pour générer et exécuter l'application.

  5. Cliquez sur le bouton Cliquer pour rendre invisible pour rendre l'élément WindowsFormsHost invisible.

  6. Cliquez sur le bouton Cliquer pour réduire pour masquer l'élément WindowsFormsHost entièrement dans la présentation. Lorsque le contrôle Windows Forms est réduit, les éléments voisins sont réorganisés pour occuper son espace.

Hébergement d'un contrôle qui ne s'étire pas

Certains contrôles Windows Forms ont une taille fixe et ne s'étirent pas pour remplir l'espace disponible dans la présentation. Par exemple, le contrôle MonthCalendar affiche un mois dans un espace fixe.

Pour héberger un contrôle qui ne s'étire pas

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Hosting a control that does not stretch. -->
    <!-- The MonthCalendar has a discrete size. -->
    <StackPanel Grid.Row="4" Grid.Column="1">
      <Label Content="A WPF element" Background="OrangeRed"/>
      <WindowsFormsHost Background="Yellow">
        <wf:MonthCalendar/>
      </WindowsFormsHost>
      <Label Content="Another WPF element" Background="OrangeRed"/>
    </StackPanel>
    
    <!-- Hosting a control that does not stretch. -->
    <!-- The MonthCalendar has a discrete size. -->
    <StackPanel Grid.Row="4" Grid.Column="1">
      <Label Content="A WPF element" Background="OrangeRed"/>
      <WindowsFormsHost Background="Yellow">
        <wf:MonthCalendar/>
      </WindowsFormsHost>
      <Label Content="Another WPF element" Background="OrangeRed"/>
    </StackPanel>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost sur la ligne de la grille, mais il n'est pas étiré pour remplir l'espace disponible. Si la fenêtre est suffisamment grande, deux mois ou plus peuvent être affichés par le contrôle MonthCalendar hébergés, mais ils sont centrés sur la ligne. Le moteur de présentation WPF centre les éléments qui ne peuvent pas être dimensionnés de façon à remplir l'espace disponible.

Mise à l'échelle

Contrairement aux éléments WPF, la plupart des contrôles Windows Forms ne sont pas mis à l'échelle en continu. L'élément WindowsFormsHost met à l'échelle son contrôle hébergé lorsque cela est possible.

Pour mettre à l'échelle un contrôle hébergé

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Scaling transformation. -->
    <StackPanel Grid.Row="0" Grid.Column="2">
    
      <StackPanel.RenderTransform>
        <ScaleTransform CenterX="0" CenterY="0" ScaleX="0.5" ScaleY="0.5" />
      </StackPanel.RenderTransform>
    
      <Label Content="A WPF UIElement" Background="OrangeRed"/>
    
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    
      <Label Content="Another WPF UIElement" Background="OrangeRed"/>
    
    </StackPanel>
    
    <!-- Scaling transformation. -->
    <StackPanel Grid.Row="0" Grid.Column="2">
    
      <StackPanel.RenderTransform>
        <ScaleTransform CenterX="0" CenterY="0" ScaleX="0.5" ScaleY="0.5" />
      </StackPanel.RenderTransform>
    
      <Label Content="A WPF UIElement" Background="OrangeRed"/>
    
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    
      <Label Content="Another WPF UIElement" Background="OrangeRed"/>
    
    </StackPanel>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. Le contrôle hébergé et ses éléments voisins sont mis à l'échelle par un facteur de 0,5. Cependant, la police du contrôle hébergé n'est pas mise à l'échelle.

Rotation

Contrairement aux éléments WPF, les contrôles Windows Forms ne prennent pas en charge la rotation. Les éléments WindowsFormsHost ne pivotent pas avec d'autres éléments WPF lorsqu'une transformation de rotation est appliquée. Les valeurs de rotation autres que 180 degrés déclenchent l'événement LayoutError.

Pour afficher les effets de la rotation dans une application hybride

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Rotation transformation. -->
    <StackPanel Grid.Row="1" Grid.Column="2">
    
      <StackPanel.RenderTransform>
        <RotateTransform CenterX="200" CenterY="50" Angle="180" />
      </StackPanel.RenderTransform>
    
      <Label Content="A WPF element" Background="OrangeRed"/>
    
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    
      <Label Content="Another WPF element" Background="OrangeRed"/>
    
    </StackPanel>
    
    <!-- Rotation transformation. -->
    <StackPanel Grid.Row="1" Grid.Column="2">
    
      <StackPanel.RenderTransform>
        <RotateTransform CenterX="200" CenterY="50" Angle="180" />
      </StackPanel.RenderTransform>
    
      <Label Content="A WPF element" Background="OrangeRed"/>
    
      <WindowsFormsHost Background="Yellow">
        <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
      </WindowsFormsHost>
    
      <Label Content="Another WPF element" Background="OrangeRed"/>
    
    </StackPanel>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. Le contrôle hébergé ne pivote pas, mais ses éléments voisins subissent une rotation de 180 degrés.

Définition de marge intérieure et de marges

Les marge intérieure et marges dans WPF sont semblables aux marge intérieure et marges dans Windows Forms. Il suffit de définir les propriétés Padding et Margin sur l'élément WindowsFormsHost.

Pour définir la marge intérieure et les marges d'un contrôle hébergé

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Padding. -->
    <!--<Canvas Grid.Row="2" Grid.Column="2">
      <WindowsFormsHost Padding="0, 20, 0, 0" Background="Yellow">
        <wf:Button Text="Windows Forms control with padding" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>-->
    
    
    ...
    
    
    <!-- Margin. -->
    <Canvas Grid.Row="3" Grid.Column="2">
      <WindowsFormsHost Margin="20, 20, 0, 0" Background="Yellow">
        <wf:Button Text="Windows Forms control with margin" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    <!-- Padding. -->
    <Canvas Grid.Row="2" Grid.Column="2">
      <WindowsFormsHost Padding="0, 20, 0, 0" Background="Yellow">
        <wf:Button Text="Windows Forms control with padding" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
    
    ...
    
    
    <!-- Margin. -->
    <Canvas Grid.Row="3" Grid.Column="2">
      <WindowsFormsHost Margin="20, 20, 0, 0" Background="Yellow">
        <wf:Button Text="Windows Forms control with margin" FlatStyle="Flat"/>
      </WindowsFormsHost>
    </Canvas>
    
  2. Appuyez sur F5 pour générer et exécuter l'application. Les paramètres de marge intérieure et de marges sont appliqués aux contrôles Windows Forms hébergés de la même façon qu'ils seraient appliqués dans Windows Forms.

Utilisation de conteneurs de présentation dynamiques

Windows Forms fournis deux conteneurs de présentation dynamiques, FlowLayoutPanel et TableLayoutPanel. Vous pouvez aussi utiliser ces conteneurs dans des présentations WPF.

Pour utiliser un conteneur de présentation dynamique

  1. Copiez l'exemple de code suivant dans l'élément Grid, après l'exemple de code précédent.

    <!-- Flow layout. -->
    <DockPanel Grid.Row="4" Grid.Column="2">
      <WindowsFormsHost Name="flowLayoutHost" Background="Yellow">
        <wf:FlowLayoutPanel/>
      </WindowsFormsHost>
    </DockPanel>
    
    <!-- Flow layout. -->
    <DockPanel Grid.Row="4" Grid.Column="2">
      <WindowsFormsHost Name="flowLayoutHost" Background="Yellow">
        <wf:FlowLayoutPanel/>
      </WindowsFormsHost>
    </DockPanel>
    
  2. Dans l'Explorateur de solutions, double-cliquez sur Window1.xaml.cs afin de l'ouvrir dans l'éditeur de code.

  3. Copiez le code suivant dans la définition de classe Window1.

    Private Sub InitializeFlowLayoutPanel()
        Dim flp As System.Windows.Forms.FlowLayoutPanel = Me.flowLayoutHost.Child
    
        flp.WrapContents = True
    
        Const numButtons As Integer = 6
    
        Dim i As Integer
        For i = 0 To numButtons
            Dim b As New System.Windows.Forms.Button()
            b.Text = "Button"
            b.BackColor = System.Drawing.Color.AliceBlue
            b.FlatStyle = System.Windows.Forms.FlatStyle.Flat
    
            flp.Controls.Add(b)
        Next i
    
    End Sub
    
    private void InitializeFlowLayoutPanel()
    {
        System.Windows.Forms.FlowLayoutPanel flp =
            this.flowLayoutHost.Child as System.Windows.Forms.FlowLayoutPanel;
    
        flp.WrapContents = true;
    
        const int numButtons = 6;
    
        for (int i = 0; i < numButtons; i++)
        {
            System.Windows.Forms.Button b = new System.Windows.Forms.Button();
            b.Text = "Button";
            b.BackColor = System.Drawing.Color.AliceBlue;
            b.FlatStyle = System.Windows.Forms.FlatStyle.Flat;
    
            flp.Controls.Add(b);
        }
    }
    
  4. Ajoutez un appel à la méthode InitializeFlowLayoutPanel dans le constructeur.

    Public Sub New()
        InitializeComponent()
    
        Me.InitializeFlowLayoutPanel()
    
    End Sub
    
    public Window1()
    {
        InitializeComponent();
    
        this.InitializeFlowLayoutPanel();
    }
    
  5. Appuyez sur F5 pour générer et exécuter l'application. L'élément WindowsFormsHost remplit le DockPanel, et le FlowLayoutPanel réorganise ses contrôles enfants dans le FlowDirection par défaut.

Voir aussi

Tâches

Disposition de contrôles Windows Forms dans Windows Presentation Foundation, exemple

Concepts

Considérations sur la disposition de l'élément WindowsFormsHost

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

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

Référence

ElementHost

WindowsFormsHost

Autres ressources

Concepteur WPF

Rubriques Comment relatives à la migration et à l'interopérabilité