Host a webbrowser control with in-browser capabilitities

Question

Hi

I have read several articles about showing html content inside silverlight, and they all seem to say that Silverlight does not support this.

I basically want to create a cutom control that inherits Webbrowser, and in that custom control you could simply paste your html code. Something like this one, where you could paste the xhtml code and you are shown the content in the webbrowser:

http://blogs.msdn.com/b/delay/archive/2007/09/10/bringing-a-bit-of-html-to-silverlight-htmltextblock-makes-rich-text-display-easy.aspx

I also have seen the video withTim Heuer

http://www.silverlight.net/learn/overview/what-is-silverlight/hosting-html-content

But the comments seem to reveil that it is only out of browser support. So I had just about given up.

But the documentation seem to say something different:

http://msdn.microsoft.com/en-us/library/gg192793%28v=vs.95%29.aspx

with an example code here:

http://msdn.microsoft.com/en-us/library/ff382750%28v=vs.95%29.aspx

So it seems to me that you should be able to support in browser control in Silverlight 3, 4 and 5, but I cant figure out how to do this. Could anybody pleas explain this to me, or better yet, give me an example code that works in browser?

Answer 1

I alos found this article:

http://weblogs.asp.net/dwahlin/archive/2010/05/10/integrating-html-into-silverlight-applications.aspx

But it does not seem to be ideal... or simple for that matter

Answer 2

Hi Chardonnay,

The WebBrowser and WebBrowserBrush controls are designed to work together to display rich HTML content in a Silverlight application running outside the browser.

If you want it work in a inside-browser scenario, you may take a look at something mentioned in blow blog post, for your information:

http://blog.gfader.com/2010/05/silverlight-showing-html-content-inside.html

Hope it may help.

Best Regards,

Answer 3

Hi Haixia

 

I know that it was a possibility to do it that way, as this method is described in the link in the second post.

 

What Im wondering about is how tyo use webbrowser without the out of browser fixes, it seems to be possible, but I have followed the documentation and ediedd the regedit with the sepcified values, but alas nothing happend. Tim Heuer seems to have configured it so that it works. My question is how did he do that?

 

Kind regards

 

Kenneth Haugland

Answer 4

Ok. I found a hack that allows me to o that.

 

Original soure code:

http://www.codeproject.com/Tips/74491/Silverlight-Html-Host-Control

 

My implementation in Silverlight with VB.net

Imports System.Net
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Documents
Imports System.Windows.Ink
Imports System.Windows.Input
Imports System.Windows.Media
Imports System.Windows.Media.Animation
Imports System.Windows.Shapes
Imports System.Windows.Browser

Namespace SilverlightHtmlHost
    Public Class HtmlHost
        Inherits ContentControl
        Private _htmlControlLeft As Integer = 0

        Public Property HtmlControlLeft() As Integer
            Get
                Return _htmlControlLeft
            End Get
            Set(value As Integer)
                _htmlControlLeft = value
            End Set
        End Property
        Private _htmlControlTop As Integer = 0

        Public Property HtmlControlTop() As Integer
            Get
                Return _htmlControlTop
            End Get
            Set(value As Integer)
                _htmlControlTop = value
            End Set
        End Property
        ReadOnly _htmlControlId As [String] = System.Guid.NewGuid().ToString()

        Public ReadOnly Property HtmlControlId() As [String]
            Get
                Return _htmlControlId
            End Get
        End Property

        Private _navigationUrl As [String]

        Public Property NavigationUrl() As [String]
            Get
                Return _navigationUrl
            End Get
            Set(value As [String])
                _navigationUrl = value
            End Set
        End Property

        ReadOnly _htmlZIndex As Integer = 0

        Public ReadOnly Property HtmlZIndex() As Integer
            Get
                Return _htmlZIndex
            End Get
        End Property

        Private divIFrameHost As HtmlElement

        Public Sub New()
            AddHandler Loaded, AddressOf HtmlHost_Loaded
        End Sub

        Sub HtmlHost_Loaded(sender As Object, e As RoutedEventArgs)
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            Dim doc As HtmlDocument = HtmlPage.Document
            divIFrameHost = doc.CreateElement("div")
            divIFrameHost.SetStyleAttribute("position", "absolute")
            divIFrameHost.SetAttribute("id", System.Guid.NewGuid().ToString())
            divIFrameHost.SetStyleAttribute("height", "100%")
            divIFrameHost.SetStyleAttribute("width", "100%")
            divIFrameHost.SetStyleAttribute("left", _htmlControlLeft.ToString() & "px")
            divIFrameHost.SetStyleAttribute("top", _htmlControlTop.ToString() & "px")
            divIFrameHost.SetStyleAttribute("z-index", _htmlZIndex.ToString())
            divIFrameHost.AppendChild(CreateIFrameControl(doc))
            doc.Body.AppendChild(divIFrameHost)
        End Sub

        Private Function CreateIFrameControl(doc As HtmlDocument) As HtmlElement
            Dim iFrame As HtmlElement = doc.CreateElement("IFRAME")
            iFrame.SetAttribute("src", _navigationUrl)
            iFrame.SetStyleAttribute("height", "100%")
            iFrame.SetStyleAttribute("width", "100%")
            iFrame.SetStyleAttribute("left", "0px")
            iFrame.SetStyleAttribute("position", "relative")
            iFrame.SetStyleAttribute("top", "0px")
            iFrame.Id = System.Guid.NewGuid().ToString()
            Return iFrame
        End Function
    End Class
End Namespace

 

With the following xaml:

 

<UserControl x:Class="HtmlStuff.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:c1="clr-namespace:HtmlStuff.SilverlightHtmlHost" 
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <c1:HtmlHost x:Name="customHost" HtmlControlTop="0" HtmlControlLeft="0" NavigationUrl="http://www.microsoft.com">
        </c1:HtmlHost>
    </Grid>
</UserControl>

 

Sadly not all sites will support this, as for instance google would not allow you to show the complete site. But it works for me...

 

Answer 5

I might have been a little hasty in my reply... I cant seem to fit this in a user control, can anybody help?

Answer 6

It treats the whole webpage as a canvas so it seems you have to do all the rendering manually and set the heigth and width using the control specs and % of screens, and do it manually.