none
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?

    Monday, March 12, 2012 1:17 PM

Answers

  • 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...

     

    Wednesday, March 14, 2012 12:48 PM

All replies

  • 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

    Monday, March 12, 2012 2:31 PM
  • 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,

    Wednesday, March 14, 2012 3:31 AM
  • 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

    Wednesday, March 14, 2012 12:00 PM
  • 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...

     

    Wednesday, March 14, 2012 12:48 PM
  • I might have been a little hasty in my reply... I cant seem to fit this in a user control, can anybody help?

    Wednesday, March 14, 2012 1:03 PM
  • 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.

    Wednesday, March 14, 2012 1:46 PM