Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

WPF: A True WPF Browser Control That Can Bend It Like Beckham

0.00/5 (No votes)
18 Nov 2009 1  
WPF: A true WPF browser control that can bend it like Beckham

A while ago, I wanted to use the new .NET 3.5 SP1 WebBrowser control in a small demo WPF app that I was using to display streamed YouTube videos. And guess what, I was way disappointed the supposedly new rad control was a con and it was actually no better than using a WPF Frame object or even hosting the WinForms WebBrowser control. The reason being that all of these internally are HWnd (therefore different graphics rendering pipeline) controls.

So no matter what you do, they will always be square and appear on top of WPF content, which sucks really.

Luckily, some clever fellas out there didn’t like this either and came up with some cool C++ DLL called Awesomium which you can get over at http://princeofcode.com/awesomium.php#download.

And then to top that off, Chris Cavanagh (Physics genius) wrapped it to make it WPF like. He calls this:

WPF 3D Chromium Browser

Which you can find over at Chris Cavanaghs site using this URL:

Here is a screen shot of it working. You can get a better sample over at Chris’s site.

43907/image_thumb1.png

The entire XAML looks like this:

<Window x:Class="BrowserApp.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow" Height="500" Width="500"

        xmlns:chr="clr-namespace:Cjc.ChromiumBrowser;assembly=Cjc.ChromiumBrowser">

    <Grid>

    <chr:WebBrowser x:Name="browser" IsEnabled="False"

                Width="300" Height="300"

                EnableAsyncRendering="False"

                RenderTransformOrigin="0.5,0.5">
            <chr:WebBrowser.RenderTransform>
                <TransformGroup>
                    <ScaleTransform CenterX="0.5" CenterY="0.5"

                                    ScaleX="0.75" ScaleY="0.75"/>
                    <SkewTransform AngleX="15" AngleY="15"/>
                </TransformGroup>
            </chr:WebBrowser.RenderTransform>

        </chr:WebBrowser>

    </Grid>
</Window>

As usual, here is a small demo app:

I should point out that it is Visual Studio 2010 and as such, I had to set the following up in my App.Config to get it to work:

<?xml version="1.0"?>
<configuration>
  <startup useLegacyV2RuntimeActivationPolicy="true">
     <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.0"/>
  </startup>
</configuration>

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here