{"id":55000265,"date":"2021-06-01T00:00:00","date_gmt":"2021-11-10T09:32:52","guid":{"rendered":"http:\/\/access-im-unternehmen.aix-dev.de\/aiu\/?p=265"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-30T00:00:00","slug":"Das_WPF_WebbrowserSteuerelement","status":"publish","type":"post","link":"https:\/\/vbentwickler.de\/Das_WPF_WebbrowserSteuerelement\/","title":{"rendered":"Das WPF Webbrowser-Steuerelement"},"content":{"rendered":"

Es gibt verschiedene Gründe, warum Sie ein Webbrowser-Steuerelement in Ihrer Anwendung benötigen könnten. Vielleicht möchten Sie einfach die Möglichkeit bieten, bestimmte Webseiten anzuzeigen. Oder Sie wollen es zur Anzeige von HTML-Inhalten verwenden, die Sie aus Dateien lesen oder per Code zusammenstellen. Schließlich bietet HTML einige Möglichkeiten, die anders oder besser zu realisieren sind als unter WPF. Dann können Sie das Webbrowser-Steuerelement verwenden, um die Benutzeroberfläche der WPF-Anwendung zu erweitern. Dieser Artikel erläutert die Grundlagen für die Programmierung des WPF Webbrowser-Steuerelements.<\/b><\/p>\n

WPF Webbrowser-Steuerelement hinzufügen<\/h2>\n

Das WPF Webbrowser-Steuerelement fügen Sie wie die übrigen Steuerelemente auf verschiedene Arten zu einem WPF-Fenster hinzu. Sie können es beispielsweise aus dem Bereich Alle WPF-Steuerelemente <\/b>aus der Toolbox <\/b>in das WPF-Fenster ziehen oder dieses anklicken und dann im WPF-Fenster einen Rahmen aufziehen, der direkt die Größe des Steuerelements angibt.<\/p>\n

Wer lieber mit Code arbeitet, fügt schlicht das Element Webbrowser <\/b>in das Grid<\/b>-Element des Fensters ein. Wir legen hier mit wb <\/b>direkt den Namen des Steuerelements fest, damit wir es später leichter referenzieren können:<\/p>\n

<Grid>\r\n     <WebBrowser x:Name=\"wb\"><\/WebBrowser>\r\n<\/Grid><\/pre>\n
Damit ist allerdings noch nichts erreicht, denn das WPF Webbrowser-Steuerelement lädt weder von selbst eine Seite noch bietet es Benutzeroberflächen-Elemente wie ein Textfeld zur Eingabe einer URL oder Schaltflächen zum Navigieren. Also legen wir in den nächsten Abschnitten selbst Hand an und fügen die benötigten Elemente hinzu.<\/p>\n
Anzeigen einer Webseite beim Starten der Anwendung<\/h2>\n
Damit das WPF Webbrowser-Steuerelement beim Starten der Anwendung wie in Bild 1 direkt eine Webseite anzeigt, fügen wir eine Ereignismethode hinzu, die durch das Ereignis Loaded <\/b>des Window<\/b>-Elements ausgelöst wird. Das benötigte Attribut sieht wie folgt aus:<\/p>\n
\"Anzeige<\/p>\n
Bild 1: Anzeige einer Webseite im WPF Webbrowser-Steuerelement<\/span><\/b><\/p>\n
<Window x:Class=\"MainWindow\" ...  Loaded=\"Window_Loaded\"><\/pre>\n
Die Ereignismethode Window_Loaded <\/b>implementieren wir wie folgt und fügen als einzige Anweisung einen Aufruf der Navigate<\/b>-Methode des WPF Webbrowser-Steuerelements hinzu, das wir mit wb <\/b>benannt haben. Die Navigate<\/b>-Methode erwartet die URL als Parameter:<\/p>\n
Private Sub <\/span>Window_Loaded(sender As Object<\/span>, e As <\/span>RoutedEventArgs)\r\n     wb.Navigate(\"http:\/\/www.google.de\")\r\nEnd Sub<\/span><\/pre>\n
Navigieren per URL-Textfeld<\/h2>\n
Normalerweise werden Sie nicht nur eine Seite anzeigen wollen, sondern dem Benutzer die Gelegenheit geben wollen, selbst eine URL einzugeben, die das WPF Webbrowser-Steuerelement anzeigen soll. Dazu fügen wir über dem Webbrowser-Steuerelement ein Textfeld plus Bezeichnungsfeld hinzu sowie eine Schaltfläche zum Anzeigen der gewünschten URL.<\/p>\n
Im XAML-Code legen wir dafür ein DockPanel<\/b>-Element an, das oben ein Grid<\/b>-Element mit Label<\/b>, TextBox <\/b>und Button <\/b>enthält sowie unten das Webbrowser<\/b>-Steuerelement:<\/p>\n
<DockPanel>\r\n     <Grid DockPanel.Dock=\"Top\"><\r\n         <Grid.ColumnDefinitions>\r\n             <ColumnDefinition Width=\"Auto\"><\/ColumnDefinition>\r\n             <ColumnDefinition Width=\"*\"><\/ColumnDefinition>\r\n             <ColumnDefinition Width=\"Auto\"><\/ColumnDefinition>\r\n         <\/Grid.ColumnDefinitions>\r\n         <Label Grid.Column=\"0\">URL:<\/Label>\r\n         <TextBox x:Name=\"txtURL\" Grid.Column=\"1\"><\/TextBox>\r\n         <Button x:Name=\"btnNavigate\" Grid.Column=\"2\" Click=\"btnNavigate_Click\">Navigate<\/Button>\r\n     <\/Grid>\r\n     <WebBrowser x:Name=\"wb\"><\/WebBrowser>\r\n<\/DockPanel><\/pre>\n
Navigieren per Klick auslösen<\/h2>\n
Um den Navigationsvorgang auszulösen, reicht eigentlich die folgende Methode:<\/p>\n
Private Sub <\/span>btnNavigate_Click(sender As Object<\/span>, e As <\/span>RoutedEventArgs)\r\n     Dim <\/span>strURL As String<\/span>\r\n     strURL = txtURL.Text\r\n     wb.Navigate(strURL)\r\nEnd Sub<\/span><\/pre>\n
Diese setzt allerdings voraus, dass der Benutzer eine vollständige URL liefert, also beispielsweise inklusive http:\/\/ <\/b>oder https:\/\/<\/b>. Dann können wir beim Anklicken der Schaltfläche den Text des Textfeldes txtURL <\/b>in eine String<\/b>-Variable einlesen und deren Inhalt der Methode Navigate <\/b>als Parameter übergeben. Gibt der Benutzer allerdings beispielsweise nur www.google.de <\/b>an, erhalten wir den Fehler aus Bild 2.<\/p>\n
\"Fehler<\/p>\n
Bild 2: Fehler bei Angabe einer URL ohne http:\/\/<\/span><\/b><\/p>\n
Wenn wir diesen Fehler ausschließen wollen, können wir eine leicht abgewandelte Version der zuvor vorgestellten Methode nutzen. Hier führen wir das Objekt objUri <\/b>mit dem Typ Uri <\/b>ein. Wir schreiben den Inhalt von txtURL <\/b>wieder in strURL<\/b>. Dann erstellen wir ein neues Objekt des Typs UriBuilder <\/b>und übergeben diesem den Inhalt von strURL<\/b>. Die Eigenschaft Uri <\/b>dieses Objekts liefert das erstellte Uri<\/b>-Objekt und wir speichern es in objURI<\/b>. Dieses übergeben wir schließlich als Parameter an die Navigate<\/b>-Methode:<\/p>\n
Private Sub <\/span>btnNavigate_Click(sender As Object<\/span>, e As <\/span>RoutedEventArgs)\r\n     Dim <\/span>strURL As String<\/span>\r\n     Dim <\/span>objURI As <\/span>Uri\r\n     strURL = txtURL.Text\r\n     objURI = New<\/span> UriBuilder(strURL).Uri\r\n     wb.Navigate(objURI)\r\nEnd Sub<\/span><\/pre>\n
Auf diese Weise kann der Benutzer auch Internetadressen ohne Angabe von http:\/\/ <\/b>oder https:\/\/ <\/b>in das Textfeld eingeben.<\/p>\n
Seite direkt beim Betätigen der Eingabetaste öffnen<\/h2>\n
Benutzerfreundlicher wird die Lösung, wenn wir dem Benutzer die Betätigung der Eingabetaste zum Aufrufen der angegebenen Seite anbieten. Dazu fügen wir dem TextBox<\/b>-Element txtURL <\/b>noch das KeyDown<\/b>-Attribut hinzu, für das wir die folgende Ereignismethode hinterlegen:<\/p>\n
Private Sub <\/span>txtURL_KeyDown(sender As Object<\/span>, e As <\/span>KeyEventArgs)\r\n     If <\/span>(e.Key = Key.Enter) Then<\/span>\r\n         btnNavigate_Click(Me, New<\/span> RoutedEventArgs)\r\n     End If<\/span>\r\nEnd Sub<\/span><\/pre>\n
Möchten Sie weiterlesen? Dann lösen Sie Ihr Ticket!<\/span>
\nHier geht es zur Bestellung des Jahresabonnements des Magazins Visual Basic Entwickler<\/strong>:<\/span>
\nZur Bestellung ...<\/a><\/span>
\nDanach greifen Sie sofort auf alle rund 200 Artikel<\/strong> unseres Angebots zu - auch auf diesen hier!<\/span>
\nOder haben Sie bereits Zugangsdaten? Dann loggen Sie sich gleich hier ein:<\/span><\/p>\n<\/div>\n\n\t\n\t
\n\n\t\t\n\t\t