Vorgehensweise: Implementieren der bidirektionalen Kommunikation zwischen DHTML-Code und Clientanwendungscode

Das WebBrowser-Steuerelement können Sie verwenden, um Ihren Windows Forms-Clientanwendungen vorhandenen DHTML-Webanwendungscode (dynamisches HTML) hinzuzufügen. Dies ist hilfreich, wenn Sie viel Zeit in die Erstellung DHTML-basierter Steuerelemente investiert haben und von den Möglichkeiten der Windows Forms-Benutzeroberfläche profitieren möchten, ohne vorhandenen Code umschreiben zu müssen.

Das WebBrowser-Steuerelement ermöglicht es Ihnen, mithilfe der ObjectForScripting- und der Document-Eigenschaft bidirektionale Kommunikation zwischen Ihrem Clientanwendungscode und Ihrem Webseitenskriptcode zu implementieren. Darüber hinaus können Sie das WebBrowser-Steuerelement so konfigurieren, dass die Websteuerelemente sich nahtlos mit anderen Steuerelementen auf Ihrem Anwendungsformular einfügen, wodurch deren DHTML-Implementierung ausgeblendet wird. Damit sich die Steuerelemente nahtlos einfügen, formatieren Sie die angezeigte Seite so, dass die Hintergrundfarbe und der visuelle Stil mit dem restlichen Formular übereinstimmen, und verwenden Sie die AllowWebBrowserDrop-, die IsWebBrowserContextMenuEnabled- und die WebBrowserShortcutsEnabled-Eigenschaft, um die Standardbrowserfeatures zu deaktivieren.

So betten Sie DHTML in Ihre Windows Forms-Anwendung ein

  1. Legen Sie die AllowWebBrowserDrop-Eigenschaft des WebBrowser-Steuerelements auf false fest, um zu verhindern, dass das WebBrowser-Steuerelement Dateien öffnet, die auf ihm abgelegt werden.

    webBrowser1.AllowWebBrowserDrop = false;
    
    webBrowser1.AllowWebBrowserDrop = False
    
  2. Legen Sie die IsWebBrowserContextMenuEnabled-Eigenschaft auf false fest, um zu verhindern, dass das WebBrowser-Steuerelement sein Kontextmenü anzeigt, wenn der Benutzer mit der rechten Maustaste auf das Steuerelement klickt.

    webBrowser1.IsWebBrowserContextMenuEnabled = false;
    
    webBrowser1.IsWebBrowserContextMenuEnabled = False
    
  3. Legen Sie die WebBrowserShortcutsEnabled-Eigenschaft des Steuerelements auf false fest, um zu verhindern, dass das WebBrowser-Steuerelement auf Tastenkombinationen reagiert.

    webBrowser1.WebBrowserShortcutsEnabled = false;
    
    webBrowser1.WebBrowserShortcutsEnabled = False
    
  4. Legen Sie die ObjectForScripting-Eigenschaft im Konstruktor des Formulars fest, oder überschreiben Sie die OnLoad-Methode.

    Im folgenden Code wird die Formularklasse selbst für das Skriptobjekt verwendet.

    webBrowser1.ObjectForScripting = new MyScriptObject(this);
    
    webBrowser1.ObjectForScripting = New MyScriptObject(Me)
    
  5. Implementieren Sie das Skriptobjekt.

    public class MyScriptObject
    {
        private Form1 _form;
    
        public MyScriptObject(Form1 form)
        {
            _form = form;
        }
    
        public void Test(string message)
        {
            MessageBox.Show(message, "client code");
        }
    }
    
    Public Class MyScriptObject
        Private _form As Form1
    
        Public Sub New(ByVal form As Form1)
            _form = form
        End Sub
    
        Public Sub Test(ByVal message As String)
            MessageBox.Show(message, "client code")
        End Sub
    
    End Class
    
  6. Verwenden Sie das window.external-Objekt in Ihrem Skriptcode, um auf öffentliche Eigenschaften und Methoden des angegebenen Objekts zuzugreifen.

    Der folgende HTML-Code veranschaulicht, wie eine Methode des Skriptobjekts über Klicken auf eine Schaltfläche aufgerufen wird. Kopieren Sie diesen Code in das BODY-Element eines HTML-Dokuments, das Sie mithilfe der Navigate-Methode des Steuerelements laden oder das Sie der DocumentText-Eigenschaft des Steuerelements zuweisen .

    <button onclick="window.external.Test('called from script code')">
        call client code from script code
    </button>
    
  7. Implementieren Sie Funktionen in Ihrem Skriptcode, den Ihr Anwendungscode verwendet.

    Das folgende HTML-SCRIPT-Element stellt eine Beispielfunktion bereit. Kopieren Sie diesen Code in das HEAD-Element eines HTML-Dokuments, das Sie mithilfe der Navigate-Methode des Steuerelements laden oder das Sie der DocumentText-Eigenschaft des Steuerelements zuweisen .

    <script>
    function test(message) {
        alert(message);
    }
    </script>
    
  8. Verwenden Sie die Document-Eigenschaft, um aus Ihrem Clientanwendungscode auf den Skriptcode zuzugreifen.

    Fügen Sie beispielsweise den folgenden Code dem Click-Ereignishandler einer Schaltfläche hinzu.

    webBrowser1.Document.InvokeScript("test",
        new String[] { "called from client code" });
    
    webBrowser1.Document.InvokeScript("test", _
        New String() {"called from client code"})
    
  9. Nachdem Sie das Debuggen des DHTML-Codes abgeschlossen haben, legen Sie die ScriptErrorsSuppressed-Eigenschaft des Steuerelements auf true fest, um zu verhindern, dass das WebBrowser-Steuerelement Fehlermeldungen für Skriptcodeprobleme angezeigt.

    // Uncomment the following line when you are finished debugging.
    //webBrowser1.ScriptErrorsSuppressed = true;
    
    ' Uncomment the following line when you are finished debugging.
    'webBrowser1.ScriptErrorsSuppressed = True
    

Beispiel

Mit dem folgenden Codebeispiel steht Ihnen eine vollständige Beispielanwendung zur Verfügung, die Ihnen dabei hilft, sich mit dieser Funktion vertraut zu machen. Der HTML-Code wird nicht aus einer separaten HTML-Datei, sondern über die DocumentText-Eigenschaft in das WebBrowser-Steuerelement geladen.

using System;
using System.Windows.Forms;

public class Form1 : Form
{
    private WebBrowser webBrowser1 = new WebBrowser();
    private Button button1 = new Button();

    [STAThread]
    public static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new Form1());
    }

    public Form1()
    {
        button1.Text = "call script code from client code";
        button1.Dock = DockStyle.Top;
        button1.Click += new EventHandler(button1_Click);
        webBrowser1.Dock = DockStyle.Fill;
        Controls.Add(webBrowser1);
        Controls.Add(button1);
    }

    protected override void OnLoad(EventArgs e)
    {
        base.OnLoad(e);

        webBrowser1.AllowWebBrowserDrop = false;
        webBrowser1.IsWebBrowserContextMenuEnabled = false;
        webBrowser1.WebBrowserShortcutsEnabled = false;
        webBrowser1.ObjectForScripting = new MyScriptObject(this);
        // Uncomment the following line when you are finished debugging.
        //webBrowser1.ScriptErrorsSuppressed = true;

        webBrowser1.DocumentText =
            "<html><head><script>" +
            "function test(message) { alert(message); }" +
            "</script></head><body><button " +
            "onclick=\"window.external.Test('called from script code')\">" +
            "call client code from script code</button>" +
            "</body></html>";
    }

    private void button1_Click(object sender, EventArgs e)
    {
        webBrowser1.Document.InvokeScript("test",
            new String[] { "called from client code" });
    }
}

public class MyScriptObject
{
    private Form1 _form;

    public MyScriptObject(Form1 form)
    {
        _form = form;
    }

    public void Test(string message)
    {
        MessageBox.Show(message, "client code");
    }
}
Imports System.Windows.Forms

Public Class Form1
    Inherits Form

    Private webBrowser1 As New WebBrowser()
    Private WithEvents button1 As New Button()

    <STAThread()> _
    Public Shared Sub Main()
        Application.EnableVisualStyles()
        Application.Run(New Form1())
    End Sub

    Public Sub New()
        button1.Text = "call script code from client code"
        button1.Dock = DockStyle.Top
        webBrowser1.Dock = DockStyle.Fill
        Controls.Add(webBrowser1)
        Controls.Add(button1)
    End Sub

    Protected Overrides Sub OnLoad(e As EventArgs)
        MyBase.OnLoad(e)

        webBrowser1.AllowWebBrowserDrop = False
        webBrowser1.IsWebBrowserContextMenuEnabled = False
        webBrowser1.WebBrowserShortcutsEnabled = False
        webBrowser1.ObjectForScripting = New MyScriptObject(Me)
        ' Uncomment the following line when you are finished debugging.
        'webBrowser1.ScriptErrorsSuppressed = True

        webBrowser1.DocumentText = _
            "<html><head><script>" & _
            "function test(message) { alert(message); }" & _
            "</script></head><body><button " & _
            "onclick=""window.external.Test('called from script code')"" > " & _
            "call client code from script code</button>" & _
            "</body></html>"
    End Sub

    Private Sub button1_Click(ByVal sender As Object, ByVal e As EventArgs) _
        Handles button1.Click

        webBrowser1.Document.InvokeScript("test", _
            New String() {"called from client code"})

    End Sub

End Class

Public Class MyScriptObject
    Private _form As Form1

    Public Sub New(ByVal form As Form1)
        _form = form
    End Sub

    Public Sub Test(ByVal message As String)
        MessageBox.Show(message, "client code")
    End Sub

End Class

Kompilieren des Codes

Dieser Code erfordert:

  • Verweise auf die Assemblys "System" und "System.Windows.Forms".

Weitere Informationen