Freigeben über

Exemplarische Vorgehensweise: Anordnen von Windows Forms-Steuerelementen in WPF

Aktualisiert: August 2010

In dieser exemplarischen Vorgehensweise wird gezeigt, wie WPF-Layoutfeatures verwendet werden, um Windows Forms-Steuerelemente in einer Hybridanwendung anzuordnen.

In dieser exemplarischen Vorgehensweise werden folgende Aufgaben veranschaulicht:

  • Erstellen des Projekts.

  • Verwenden der Standardlayouteinstellungen

  • Größenanpassung an den Inhalt

  • Verwenden der absoluten Positionierung

  • Explizites Angeben der Größe

  • Festlegen von Layouteigenschaften

  • Grundlagen der Z-Reihenfolge-Einschränkungen

  • Andocken

  • Einstellen der Sichtbarkeit

  • Hosten eines Steuerelements, das nicht gestreckt wird

  • Skalieren

  • Drehen

  • Einstellen von Textabständen und Rändern

  • Verwenden von dynamischen Layoutcontainern

Eine vollständige Codeauflistung der Aufgaben, die in dieser exemplarischen Vorgehensweise veranschaulicht wurden, finden Sie unter Beispiel für das Anordnen von Windows Forms-Steuerelementen in WPF.

Anschließend werden Sie die Windows Forms-Layoutfeatures in WPF-basierten Anwendungen verstehen.

Vorbereitungsmaßnahmen

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

  • Visual Studio 2010.

Erstellen des Projekts

So erstellen Sie das Projekt und richten es ein

  1. Erstellen Sie ein WPF-Anwendungsprojekt mit dem Namen WpfLayoutHostingWf.

  2. Fügen Sie im Projektmappen-Explorer Verweise auf die folgenden Assemblys hinzu.

    • WindowsFormsIntegration

    • System.Windows.Forms

    • System.Drawing

  3. Doppelklicken Sie auf "MainWindow.xaml", um die Datei in der XAML-Ansicht zu öffnen.

  4. Fügen Sie im Window-Element die folgende Windows Forms-Namespacezuordnung hinzu.

    xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"

  5. Legen Sie im Grid-Element die ShowGridLines-Eigenschaft auf true fest, und definieren Sie fünf Zeilen und drei Spalten.

    <Grid ShowGridLines="true">
  <Grid.RowDefinitions>
    <RowDefinition/>
    <RowDefinition/>
    <RowDefinition/>
    <RowDefinition/>
    <RowDefinition/>
  </Grid.RowDefinitions>

  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>

Verwenden der Standardlayouteinstellungen

Standardmäßig behandelt das WindowsFormsHost-Element das Layout für das gehostete Windows Forms-Steuerelement.

So verwenden Sie Standardlayouteinstellungen

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- Default layout. -->
<Canvas Grid.Row="0" Grid.Column="0">
  <WindowsFormsHost Background="Yellow">
    <wf:Button Text="Windows Forms control" FlatStyle="Flat"/>
  </WindowsFormsHost>
</Canvas>

  2. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das Windows Forms-System.Windows.Forms.Button-Steuerelement wird im Canvas angezeigt. Die Größe des gehosteten Steuerelements basiert auf dessen Inhalt, und die Größe des WindowsFormsHost-Elements wird an das gehostete Steuerelement angepasst.

Größenanpassung an den Inhalt

Das WindowsFormsHost-Element stellt sicher, dass die Größe des gehosteten Steuerelements so angepasst wird, dass sein Inhalt ordnungsgemäß angezeigt wird.

So passen Sie die Größe an den Inhalt an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Die Größe der zwei neuen Schaltflächen wird so angepasst, dass die längere Textzeichenfolge und der größere Schriftgrad ordnungsgemäß angezeigt werden, und die Größe der WindowsFormsHost-Elemente wird an die gehosteten Steuerelemente angepasst.

Verwenden der absoluten Positionierung

Mit der absoluten Positionierung können Sie das WindowsFormsHost-Element beliebig in der Benutzeroberfläche einfügen.

So verwenden Sie die absolute Positionierung

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element wird 20 Pixel vom oberen Rand der Rasterzelle und 20 Pixel vom linken Rand platziert.

Explizites Angeben der Größe

Sie können die Größe des WindowsFormsHost-Elements mit der Width-Eigenschaft und der Height-Eigenschaft angeben.

So geben Sie die Größe explizit an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element wird auf eine Größe von 50 x 70 Pixel (Breite x Höhe) festgelegt und liegt damit unter den Standardlayouteinstellungen. Der Inhalt des Windows Forms-Steuerelements wird entsprechend neu angeordnet.

Festlegen von Layouteigenschaften

Legen Sie layoutbezogene Eigenschaften immer für das gehostete Steuerelement fest, und verwenden Sie dabei die Eigenschaften des WindowsFormsHost-Elements. Das Festlegen der Layouteigenschaften direkt für das gehostete Steuerelement führt zu unbeabsichtigten Ergebnissen.

Das Festlegen der layoutbezogenen Eigenschaften für das gehostete Steuerelement in XAML hat keine Auswirkungen.

So zeigen Sie die Auswirkungen des Festlegens der Eigenschaften für das gehostete Steuerelement an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- Setting hosted control properties directly. -->
<Canvas Grid.Row="0" Grid.Column="1">
  <WindowsFormsHost Width="160" Height="50" Background="Yellow">
    <wf:Button Name="button1" Click="button1_Click" Text="Click me" FlatStyle="Flat" BackColor="Green"/>
  </WindowsFormsHost>
</Canvas>

  2. Doppelklicken Sie im Projektmappen-Explorer auf "MainWindow.xaml. vb" oder "MainWindow.xaml.cs", um die Datei im Code-Editor zu öffnen.

  3. Kopieren Sie den folgenden Code in die MainWindow-Klassendefinition.

    Private Sub button1_Click(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 button1_Click(object sender, EventArgs e )
{
    System.Windows.Forms.Button b = sender as System.Windows.Forms.Button;

    b.Top = 20;
    b.Left = 20;
}

  4. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen.

  5. Klicken Sie auf die Schaltfläche Hier klicken. Der button1_Click-Ereignishandler legt die Top-Eigenschaft und die Left-Eigenschaft für das gehostete Steuerelement fest. Dadurch wird das gehostete Steuerelement innerhalb des WindowsFormsHost-Elements neu angeordnet. Der Host behält den gleichen Bildschirmbereich bei, das gehostete Steuerelement wird jedoch abgeschnitten. Das gehostete Steuerelement sollte jedoch immer das WindowsFormsHost-Element ausfüllen.

Grundlagen der Z-Reihenfolge-Einschränkungen

Sichtbare WindowsFormsHost-Elemente werden immer über anderen WPF-Elementen gezeichnet und durch die Z-Reihenfolge nicht beeinträchtigt.

So zeigen Sie Z-Reihenfolge-Einschränkungen an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element wird über das Bezeichnungselement gezeichnet.

Andocken

Das WindowsFormsHost-Element unterstützt das Andocken von WPF. Legen Sie die angefügte Dock-Eigenschaft so fest, dass das gehostete Steuerelement in einem DockPanel-Element angedockt wird.

So docken Sie ein gehostetes Steuerelement an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element wird an der rechten Seite des DockPanel-Elements angedockt.

Einstellen der Sichtbarkeit

Sie können das Windows Forms-Steuerelement ausblenden oder reduzieren, indem Sie die Visibility-Eigenschaft für das WindowsFormsHost-Element festlegen. Wenn ein Steuerelement nicht sichtbar ist, wird es nicht angezeigt, aber es belegt Platz im Layoutbereich. Wenn ein Steuerelement reduziert ist, wird es nicht angezeigt und belegt auch keinen Platz im Layoutbereich.

So legen Sie die Sichtbarkeit eines gehosteten Steuerelements fest

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- Setting Visibility to hidden and collapsed. -->
<StackPanel Grid.Row="3" Grid.Column="1">
  <Button Name="button2" Click="button2_Click" 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="button3_Click" Content="Click to collapse" Background="OrangeRed"/>
</StackPanel>

  2. Kopieren Sie in "MainWindow.xaml.vb" oder "MainWindow.xaml.cs" den folgenden Code in die Klassendefinition.

    Private Sub button2_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Me.host1.Visibility = Windows.Visibility.Hidden
End Sub


Private Sub button3_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Me.host1.Visibility = Windows.Visibility.Collapsed
End Sub

    private void button2_Click(object sender, EventArgs e)
{
    this.host1.Visibility = Visibility.Hidden;
}

private void button3_Click(object sender, EventArgs e)
{
    this.host1.Visibility = Visibility.Collapsed;
}

  3. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen.

  4. Klicken Sie auf die Schaltfläche Zum Ausblenden klicken, um das WindowsFormsHost-Element auszublenden.

  5. Klicken Sie auf die Schaltfläche Zum Reduzieren klicken, um das WindowsFormsHost-Element vollständig im Layout auszublenden. Wenn das Windows Forms-Steuerelement reduziert ist, werden die umgebenden Elemente neu angeordnet, um dessen Bereich einzunehmen.

Hosten eines Steuerelements, das nicht gestreckt wird

Einige Windows Forms-Steuerelemente haben eine feste Größe und können nicht gestreckt werden, um den verfügbaren Bereich im Layout auszufüllen. Das MonthCalendar-Steuerelement zeigt beispielsweise einen Monat in einem festen Bereich an.

So hosten Sie ein Steuerelement, das nicht gestreckt wird

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element wird in der Rasterzeile zentriert. Es wird jedoch nicht gestreckt, um den verfügbaren Bereich auszufüllen. Wenn das Fenster groß genug ist, werden möglicherweise zwei oder mehr Monate vom gehosteten MonthCalendar-Steuerelement angezeigt, die jedoch in der Zeile zentriert sind. Das WPF-Layoutmodul zentriert Elemente, deren Größe nicht angepasst werden kann, um den verfügbaren Bereich auszufüllen.

Skalieren

Im Gegensatz zu WPF-Elementen sind die meisten Windows Forms-Steuerelemente nicht kontinuierlich skalierbar. Wenn möglich, skaliert das WindowsFormsHost-Element sein gehostetes Steuerelement.

So skalieren Sie ein gehostetes Steuerelement

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das gehostete Steuerelement und die umgebenden Elemente werden um den Faktor 0,5 skaliert. Die Schriftart des gehosteten Steuerelements wird jedoch nicht skaliert.

Drehen

Im Gegensatz zu WPF-Elementen unterstützen Windows Forms-Steuerelemente keine Drehung. Das WindowsFormsHost-Element dreht nicht mit anderen WPF-Elementen, wenn eine Drehungstransformation angewendet wird. Jeder andere Drehungswert als 180 Grad löst das LayoutError-Ereignis aus.

So zeigen Sie die Auswirkung der Drehung in einer Hybridanwendung an

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das gehostete Steuerelement wird nicht gedreht. Die umgebenden Elemente werden jedoch um 180 Grad gedreht. Die Größe des Fensters muss möglicherweise geändert werden, damit die Elemente sichtbar sind.

Einstellen von Textabständen und Rändern

Textabstände und Ränder im WPF-Layout sind mit den Textabständen und Rändern in Windows Forms vergleichbar. Legen Sie einfach die Padding-Eigenschaft und die Margin-Eigenschaft für das WindowsFormsHost-Element fest.

So legen Sie Textabstände und Ränder für ein gehostetes Steuerelement fest

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- 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. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Die Einstellungen für Textabstände und Ränder werden wie in Windows Forms auf die gehosteten Windows Forms-Steuerelemente angewendet.

Verwenden von dynamischen Layoutcontainern

Windows Forms stellt zwei dynamische Layoutcontainer, FlowLayoutPanel und TableLayoutPanel, zur Verfügung. Sie können diese Container auch in WPF-Layouts verwenden.

So verwenden Sie einen dynamischen Layoutcontainer

  1. Kopieren Sie den folgenden XAML-Code in das Grid-Element.

    <!-- Flow layout. -->
<DockPanel Grid.Row="4" Grid.Column="2">
  <WindowsFormsHost Name="flowLayoutHost" Background="Yellow">
    <wf:FlowLayoutPanel/>
  </WindowsFormsHost>
</DockPanel>

  2. Kopieren Sie in "MainWindow.xaml.vb" oder "MainWindow.xaml.cs" den folgenden Code in die Klassendefinition.

    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);
    }
}

  3. Fügen Sie dem Konstruktor einen Aufruf der InitializeFlowLayoutPanel-Methode hinzu.

    Public Sub New()
    InitializeComponent()

    Me.InitializeFlowLayoutPanel()

End Sub

    public MainWindow()
{
    InitializeComponent();

    this.InitializeFlowLayoutPanel();
}

  4. Drücken Sie F5, um die Anwendung zu erstellen und auszuführen. Das WindowsFormsHost-Element füllt DockPanel aus, und FlowLayoutPanel ordnet seine untergeordneten Steuerelemente in der Standard-FlowDirection an.

Siehe auch

Referenz

ElementHost

WindowsFormsHost

Konzepte

Überlegungen zum Layout für das WindowsFormsHost-Element

Exemplarische Vorgehensweise: Hosten eines zusammengesetzten Windows Forms-Steuerelements in WPF

Exemplarische Vorgehensweise: Hosten eines zusammengesetzten WPF-Steuerelements in Windows Forms

Weitere Ressourcen

WPF-Designer

Beispiel für das Anordnen von Windows Forms-Steuerelementen in WPF

Änderungsprotokoll

Datum

Versionsgeschichte

Grund

August 2010

Aktualisiert für Visual Studio 2010.

Kundenfeedback.
  • Last updated on