在WPF应用程序中嵌入HTML浏览器

WPF应用程序中嵌入HTML浏览器,而无需混合使用COM或其他插件技术,是一个相对少见的需求。开源项目和自由使用的项目更是少之又少。CefSharp Version 3是一个有趣且稳定的项目。在开始之前,请务必阅读Wiki和FAQ部分。

本系列文章旨在为WPF和MVVM的复杂世界提供一个从简单场景到复杂世界的指南。

先决条件

本系列文章所需的不多,只需要Visual Studio Express和一个互联网连接。让开始创建第一个WPF解决方案,名为Sample1。请确保将项目的最小.Net版本设置为至少.Net 4.5.2。

转到:Visual Studio > File > New Project...并输入创建项目所需的参数。

创建带有CefSharp Version 3的WPF解决方案

将使用CefSharp 3的发布版本。这个版本可以在NuGet上找到:

https://github.com/cefsharp/CefSharp#nuget-packages

但是它只支持x64和x86应用程序。这意味着CefSharp 3不支持Any CPU设置或其他处理器架构。因此,在引用CefSharp 3之前,将Any CPU的默认解决方案设置复制到x86和x64配置中,并删除Any CPU配置是一个好主意:

解决方案(上下文菜单)> 配置管理器

点击Active solution platform > New...以创建x86和x64设置:

点击Active solution platform > Edit...以删除Any CPU配置(在CefSharp 3中不受支持):

确保还要将项目设置与解决方案对齐。

现在让通过NuGet添加对解决方案的引用:

点击解决方案(上下文菜单)> 启用NuGet包还原

点击解决方案(上下文菜单)> 管理解决方案的NuGet包

将CefSharp.WPF库添加到解决方案中

保存所有编辑并关闭Visual Studio。必须完全关闭它,否则CefSharp引用将无法正确显示。

重新打开CefSharp 3解决方案并点击构建。预期:项目应该没有错误构建,并且示例项目的引用部分应该显示CefSharp.WPF引用。

让打开MainWindow.xaml并添加一个CefSharp浏览器控件:

<Window x:Class="Sample1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:cefSharp="clr-namespace:CefSharp.Wpf;assembly=CefSharp.Wpf" Title="MainWindow" Height="550" Width="625"> <Grid> <cefSharp:ChromiumWebBrowser Grid.Row="0" Address="https://github.com/cefsharp/CefSharp/wiki/Frequently-asked-questions" /> </Grid> </Window>

那就是,必须添加CefSharp名称空间引用:

xmlns:cefSharp="clr-namespace:CefSharp.Wpf;assembly=CefSharp.Wpf"

...和控件本身:

<cefSharp:ChromiumWebBrowser Grid.Row="0"> <Address>https://github.com/cefsharp/CefSharp/wiki/Frequently-asked-questions</Address> </cefSharp:ChromiumWebBrowser>

这段代码实例化了ChromiomBrowser并将其指向由可绑定的Address属性指示的Internet地址。

现在构建并执行并享受。应该看到以下窗口,并能够在其中浏览。启动时请耐心等待 - 这取决于互联网速度以及是否使用调试版本:

恭喜:刚刚完成了本系列文章的第一步,朝着构建符合MVVM的复杂浏览器迈进。

对于使用当前发布版本遇到问题的人,MyGet.org上还有一个预览版本。可以使用这个预览版本来检查问题是否已经被报告过,并且可能已经在此期间被修复。为此,请打开:

工具 > NuGet包管理器 > 包管理器设置

设置一个新的NuGet源:

https://www.myget.org/F/cefsharp/

进入NuGet包管理器并从MyGet.org安装包:

现在回到解决方案并添加对MyGet包的引用:

无论问题是否仍然存在,或者是否已经解决,在这里或在Google Groups论坛上的反馈可能总是受欢迎的:

https://groups.google.com/forum/#!forum/cefsharp

Web浏览器控件自然可以用来显示从Web服务器检索的内容。但是,这个控件的优势不仅限于显示来自Web服务器的内容。它实际上是设计用来检索和显示来自几乎任何本地或远程源的内容。实现这一点的一种方式将在本系列的下一篇文章中展示:

http://www.codeproject.com/Articles/887148/Display-HTML-in-WPF-and-CefSharp-Tutorial-Part

[1] 在WPF VB.NET应用程序中使用CEFSharp嵌入Chrome http://www.codeproject.com/Tips/648678/Embedding-Chrome-in-a-WPF-VB-NET-Application-using

[2] CefSharp在GitHub上的仓库 https://github.com/cefsharp/CefSharp

沪ICP备2024098111号-1
上海秋旦网络科技中心:上海市奉贤区金大公路8218号1幢 联系电话:17898875485