Click here to Skip to main content
Click here to Skip to main content

Embedding Chrome in a WPF VB.NET Application using CEFSharp

, 5 Sep 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
Embedding Chrome in a WPF VB.NET application using CEFSharp

Introduction

This tip demonstrates how to embed chrome into a WPF application using VB.NET using CEFSharp.

Background

If you've used the built-in webbrowser in Visual Studio, you've probably noticed a few points of pain:

  • The version of IE doesn't carry over to the system running the application. If you run it on a system with IE10, you'll get IE10. If you run it on a system with IE8, you'll get IE8.
  • Even if you have IE8, your website will most likely render as IE7 unless you have a meta tag to force IE to render as IE8.
  • If you want to use certain HTML or CSS feature that isn't available on IE, then again you'll run into issues.

Fortunately, there are alternatives.

Firefox

  • Geckofx - It works well with Windows Forms; however, there currently isn't a WPF implementation. Hopefully, this will change when version 26 comes out and gets its new Metro look. Make sure to go to the BitBucket website which is the new home and not the outdated googlecode website.

Chrome

  • Awesomium - This supports Chrome in WPF but it looks like it is still using version 18 of Chrome - current version of Chrome is 29
  • CEFSharp - This supports Chrome (version 25) in WPF but is currently only the CEF1 version which is single threaded. However, it looks like there is now an alpha version of a CEF3 (multi-threaded) implementation.
  • Xilium - I haven't tried this one yet but it seems to support many OSs and have a CEF3 version. If I do, I'll be sure to write another article.

It took me a while to get things working, so I wanted to put together something that might help other people get up to speed quicker. The CEFSharp googlegroup was very helpful. Currently, there are no Nuget or PM project files.

Using the Code

  1. Let's open up Visual Studio and start a new .NET 4.5 WPF application:

  2. Once created, save the project so we start to add some files.
  3. Now we need to download and extract the files from https://github.com/cefsharp/CefSharp.

    CEFSharp was recently upgraded to support .NET 4.0, so make sure you download CEFSharp 1.25.4 and NOT version 1.25.0 which only supports .NET 2.0.
  4. In Visual Studio, right click on the project in the Solution Explorer and select "Add Reference."


    Browse to the extracted CEFSharp folder and reference CefSharp.Wpf.dll and CefSharp.dll in the Release folder.

  5. We also need to copy icudt.dll and libcef.dll from the CEFSharp folder to our Debug folder.
  6. In your MainWindow.xaml, give your grid a name:
  7. <Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
        <Grid Name="grid1">
            
        </Grid>
    </Window>   
  8. Right click and select "view code" and add the following in the MainWindow VB:
    Imports CefSharp
    Class MainWindow
     
        Public Sub New()
     
            ' This call is required by the designer.
            InitializeComponent()
     
            ' Add any initialization after the InitializeComponent() call.
            Dim settings As New CefSharp.Settings()
            settings.PackLoadingDisabled = True
            If CEF.Initialize(settings) Then
                Dim web_view As New CefSharp.Wpf.WebView
                grid1.Children.Add(web_view)
                web_view.Address = "http://www.google.com/"
     
            End If
     
        End Sub
    End Class

    After the initializecomponent is called, which builds the XAML controls, we create and initialize the Chrome settings. Once done, we can create our web browser and add it to the grid. Using the Address property, we can have it browse to a website.

If you try and run your application now, you'll probably get the following error:

This is because the application is 32-bit only. We need to right click on the application in the Solution Explorer again and set the Target CPU to x86.

And now it should work!

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Member 3792090

United States United States
I'm a Principal Performance Engineer who uses VB.Net, HTML, CSS, etc. to write automation tools and reports.

Comments and Discussions

 
QuestionHTML5 player / Other video player (Flowplayer,etc) PinmemberDarrel Jade16-Dec-14 21:50 
QuestionI get the exception even if I switch to x86 only PinmemberMaster_T14-May-14 2:07 
AnswerRe: I get the exception even if I switch to x86 only PinmemberJørn Hansen4-Jun-14 9:23 
Questionre PinmemberHisham Foda26-Mar-14 4:30 
AnswerRe: re PinmemberMember 379209029-Mar-14 3:40 
QuestionHaven't had much time to play with CEFSharp yet PinmemberAlaric_6-Mar-14 12:21 
Questionthanks a lot Pinmemberstsalt2-Feb-14 0:55 
QuestionHum, are there something wrong? Pinmemberdreamingusa17-Dec-13 0:09 
AnswerRe: Hum, are there something wrong? PinmemberMember 379209020-Dec-13 6:47 
QuestionHow do I go about disabling the "backspace" as navigate backwards? PinmemberMember 1040885818-Nov-13 2:42 
GeneralGive you 4 Pinmembersavbace8-Oct-13 22:19 
QuestionContent grabber Pinmemberper-i5-Sep-13 4:57 
AnswerRe: Content grabber PinmemberMember 37920906-Sep-13 2:32 
AnswerRe: Content grabber PinmemberPooranPrasad15-Dec-14 23:54 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.141223.1 | Last Updated 5 Sep 2013
Article Copyright 2013 by Member 3792090
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid