Share via


XBAP Hosting Silverlight Sample

This sample demonstrates the following:

  • How to host a Silverlight-based application in a XAML browser application (XBAP).

  • How to communicate between the host XBAP and the hosted Silverlight-based application.

Download sample

Hosting a Silverlight-Based Application in an XBAP

Silverlight-based applications can be hosted in XBAPs by using the WebBrowser control. The content of a XBAP Page contains the WebBrowser control whose source URI identifies the HTML page that hosts the Silverlight-based application. The HTML page uses the Silverlight plug-in control to host the Silverlight-based application.

The following image illustrates the high-level architecture for hosting a Silverlight-based application in an XBAP.

WPF Application Hosting a Silverlight Application

Communicating from the XBAP to the Silverlight-Based Application

A host XBAP can communicate with a hosted Silverlight-based application via script methods implemented by the HTML page that hosts the Silverlight-based application. An XBAP calls the script methods using the InvokeScript method. The script methods then call methods implemented by a scriptable object that is exposed from the Silverlight-based application and available to script from the Content property of the Silverlight plug-in control.

The following figure shows both the high-level architecture for hosting a Silverlight-based application in an XBAP and the key technology used to propagate method calls from a host XBAP to a hosted Silverlight-based application.

WPF Interoperating with Silverlight

To call script methods using the WebBrowser control, see WebBrowser Control Sample. For more information on implementing Silverlight-based applications that expose scriptable objects, see Walkthrough: Calling Managed Code from JavaScript. For an introduction to Silverlight-based application development, see Getting Started with Silverlight.

Communicating from the Silverlight-Based Application to the XBAP

A hosted Silverlight-based application can communicate with a host XBAP via script methods implemented by the HTML page that hosts the Silverlight-based application. A Silverlight-based application calls the script methods using the Invoke method of the HtmlWindow class (from the Silverlight System.Windows.Browser namespace). A Silverlight-based application gets a reference to the window (represented by the HtmlWindow class) from the Window property of the HtmlPage class (also in the System.Windows.Browser namespace). The script methods then call methods implemented by a scriptable object that is exposed by from the XBAP, using the ObjectForScripting property, and available to script from the external property of the window object that is exposed by the host browser.

The following figure shows both the high-level architecture for hosting a Silverlight-based application in an XBAP and the key technology used to propagate method calls from a hosted Silverlight-based application to a host XBAP.

Silverlight Interoperating with WPF

To call script methods from a Silverlight-based application, see Walkthrough: Calling JavaScript from Managed Code. For more information on exposing scriptable objects from XBAPs, see WebBrowser Control Sample and ObjectForScripting.

Configuring the Sample

The sample consists of one solution (XBAPHostingSilverlightSample) with two projects:

  1. The XBAP project (WPFBrowserApplication) that hosts the Silverlight-based application.

  2. The Silverlight-based application project (SilverlightApplication).

SilverlightApplication builds afterWPFBrowserApplication and includes a post-build step that copies the generated Silverlight-based application, silverlightspplication.xap to the WPFBrowserApplication project output folder: \bin\debug.

The sample must be configured to run on the localhost from a virtual directory that points to the WPFBrowserApplication project output folder (\bin\debug) using the following steps:

  1. From Start | Administrative Tools, choose Internet Information Services (IIS) Manager.

  2. Select Web Sites | Default Web Site.

  3. Right-click Default Web Site and choose Add Virtual Directory, then

    1. Set the Alias to "WPFBrowserApplication".

    2. Set the Physical path to the WPFBrowserApplication project output folder.

  4. Press OK to create the virtual directory.

Running the Sample

To run the sample, navigate to the following URL:

https://localhost/WPFBrowserApplication/WPFBrowserApplication.xbap

Best Practices

This sample demonstrates a specific feature of the Windows Presentation Foundation and, consequently, does not follow application development best practices. For comprehensive coverage of Windows Presentation Foundation (WPF) and Microsoft .NET Framework application development best practices, refer to the following as appropriate:

Accessibility - Accessibility Best Practices

Localization - WPF Globalization and Localization Overview

Performance - Optimizing WPF Application Performance

Security - Windows Presentation Foundation Security

Building the Sample

  • Install the Windows Software Development Kit (SDK) and open its build environment command window. On the Start menu, point to All Programs, Microsoft Windows SDK, and then click CMD Shell.

  • Download the sample, usually from the software development kit (SDK) documentation, to your hard disk drive.

  • To build the sample from the build environment command window, go to the source directory of the sample. At the command prompt, type MSBUILD.

  • To build the sample in Microsoft Visual Studio, load the sample solution or project file and then press CTRL+SHIFT+B.

Running the Sample

  • To run the compiled sample from the build environment command window, execute the .exe file in the Bin\Debug or Bin\Release folder contained under the sample source code folder.

  • To run the compiled sample with debugging in Visual Studio, press F5.

See Also

Tasks

WebBrowser Control Sample

Concepts

Navigation Overview

Structured Navigation Overview

Reference

WebBrowser

Other Resources

Getting Started with Silverlight

Walkthrough: Calling Managed Code from JavaScript

Change History

Date

History

Reason

July 2008

Added sample.

SP1 feature change.