QCefView怎么用
导读:本文共4934.5字符,通常情况下阅读需要16分钟。同时您也可以点击右侧朗读,来听本文内容。按键盘←(左) →(右) 方向键可以翻页。
摘要: QCefView介绍 官方网址:http://tishion.github.io/QCefView/ QCefView是一个与Chromium Embedded Framework集成的Qt第三方开源库,LGPL许可,可以在项目中免费使用,功能类似CEF、QWebEngineView,提供C++和web交互的能力。QCefView编译准备 我的编译环境wi... ...
目录
(为您整理了一些要点),点击可以直达。QCefView介绍
官方网址:http://tishion.github.io/QCefView/
QCefView是一个与Chromium Embedded Framework集成的Qt第三方开源库,LGPL许可,可以在项目中免费使用,功能类似CEF、QWebEngineView,提供C++和web交互的能力。
QCefView编译准备
我的编译环境win11、vs2019、Qt5.15.2,本次编译采用x64编译方式,最终生成vs2019的解决方案,因此Qt需要使用msvc2019_64。
1 下载代码
clone QCefView
gitclonehttps://github.com/CefView/QCefView.git
clone CefViewCore
gitclonehttps://github.com/CefView/CefViewCore.git
虽然QCefView工程里有CefViewCore目录,但是是空的,需要手动clone CefViewCore的代码,然后放到QCefView工程里。
2 修改CEF配置
在编译前,需要做些配置修改,由于QCefView依赖于CEF,在用CMake配置项目时,会下载CEF工程,如果没有比较好的网络环境,可能无法下载CEF, 不过可以手动下载CEF, 放到指定目录即可。打开QCefView\CefViewCore\CefConfig.cmake我是windows编译, 注释掉CEF的下载链接,也就是第7行,例如我的注释:
注释之后,我们根据CEF链接,用迅雷手动下载CEF, 解压放到QCefView\CefViewCore\dep目录即可,不需要改文件名,根据cmake的提示,解压后文件得以cef_binary_为前缀。
3 修改Qt版本
打开QCefView根目录的QtConfig.cmake, 将第16行指定为你的Qt路径,例如我的Qt路径
然后去环境变量里看看是否有Qt相关的设置,有的话最好先删掉,然后添加如下系统配置
vs2019里的Qt配置
这些完成后,最好重启电脑,不然CMake可能无法识别。导致如下错误:
开始编译QCefView
1 在QCefView根目录建一个目录,例如build_vs2019_x64, 到时候CMake产生的vs sln解决方案放到该目录;
2 打开CMake GUI, 找到QCefViwe目录,指定源码目录和解决方案目录build_vs2019_x64,,例如我的设置:
3 点击Configure开始配置项目,结果如下:
再点击Generate生成vs2019解决方案,如下图:
4 打开项目用vs2019编译,我的编译结果
生成的dll路径
QCefView编译的库路径在源码根目录,例如我的生成结果
lib路径
头文件
QCefView项目说明
(1)QCefView是动态库项目,其它的是静态库,QCefView静态链接其它库;
(2)QCefViewTest是个exe项目,比如打开百度首页,显示结果如下:
如何使用QCefView进行开发
QCefView源码浏览
在写demo前,来看看QCefView的源码
头文件
classQCEFVIEW_EXPORTQCefView:publicQWidget{///<summary>//////</summary>Q_OBJECTpublic:///<summary>//////</summary>QCefView(constQStringurl,QWidget*parent=0);
从头文件可知,QCefView是一个窗口,只是作者把它封装成了dll,使用者则需要把QCefView添加到界面布局里。
来看一下构造函数的实现
QCefView::QCefView(constQStringurl,QWidget*parent/*=0*/):QWidget(parent),pImpl_(nullptr){//initializethelayoutQVBoxLayout*layout=newQVBoxLayout(this);layout->setContentsMargins(0,0,0,0);setLayout(layout);//createthewindowQCefWindow*pCefWindow=newQCefWindow(windowHandle(),this);pCefWindow->create();//createwindowcontainerQWidget*windowContainer=createWindowContainer(pCefWindow,this);layout->addWidget(windowContainer);//createtheimplementation//url传到这里打开pImpl_=std::unique_ptr<Implementation>(newImplementation(url,this,pCefWindow));//Ifwe'realreadypartofawindow,we'llinstalloureventhandler//Ifourparentchangeslater,thiswillbehandledinQCefView::changeEvent()if(this->window())this->window()->installEventFilter(this);}
web的操作,最终还是调用CEF来完成
/////Createanewbrowserwindowusingthewindowparametersspecifiedby//|windowInfo|.Allvalueswillbecopiedinternallyandtheactualwindowwill//becreatedontheUIthread.If|request_context|isNULLtheglobalrequest//contextwillbeused.Thisfunctioncanbecalledonanybrowserprocess//threadandwillnotblock.Theoptional|extra_info|parameterprovidesan//opportunitytospecifyextrainformationspecifictothecreatedbrowserthat//willbepassedtocef_render_process_handler_t::on_browser_created()inthe//renderprocess.///CEF_EXPORTintcef_browser_host_create_browser(constcef_window_info_t*windowInfo,struct_cef_client_t*client,constcef_string_t*url,conststruct_cef_browser_settings_t*settings,struct_cef_dictionary_value_t*extra_info,struct_cef_request_context_t*request_context);
QCefView的窗口
在QCefView构造函数可以看到QCefWindow,该类构造函数如下:
QCefWindow::QCefWindow(QWindow*parent,QCefView*hostView/*=0*/):QWindow(parent),hwndCefBrowser_(nullptr){setFlags(Qt::FramelessWindowHint);CCefManager::getInstance().initializeCef();}
去掉了窗口边框,初始化CEF管理类,在析构函数里deinit.
窗口大小变化时的处理
voidQCefWindow::resizeEvent(QResizeEvent*e){syncCefBrowserWindow();QWindow::resizeEvent(e);}
参考QCefViewTest打开网页的用法,该项目新创建了一个CustomCefView类,派生于QCefView,代码如下:
#ifndefCUSTOMCEFVIEW_H#defineCUSTOMCEFVIEW_H#include<QCefView.h>classCustomCefView:publicQCefView{Q_OBJECTpublic:usingQCefView::QCefView;~CustomCefView();voidchangeColor();protected:virtualvoidonDraggableRegionChanged(constQRegion®ion)override;virtualvoidonQCefUrlRequest(constQString&url)override;virtualvoidonQCefQueryRequest(constQCefQuery&query)override;virtualvoidonInvokeMethodNotify(intbrowserId,intframeId,constQString&method,constQVariantList&arguments)override;private:};#endif//CUSTOMCEFVIEW_H
该类重写了QCefView的一些方法,用于进行相关的通知回调。显示网页,只需要传入url即可,代码如下:
cefview=newCustomCefView("https://www.baidu.com/",this);ui.cefContainer->layout()->addWidget(cefview);
demo实现
首先需要把编译后的.lib .dll和include正一块儿,方便vs2019链接,创建Qt GUI项目,把QCefViewTest项目里的customcefview.h和customcefview.cpp添加到项目中,让后把CefView添加到界面布局中,我的界面代码如下:
MyTest.h
#pragmaonce#include<QtWidgets/QWidget>#include"ui_MyTest.h"#include"customcefview.h"classMyTest:publicQWidget{Q_OBJECTpublic:MyTest(QWidget*parent=Q_NULLPTR);private:Ui::MyTestClassui;CustomCefView*m_pCefView=nullptr;};
MyTest.cpp
#include"MyTest.h"#include<QVBoxLayout>#include<QLabel>MyTest::MyTest(QWidget*parent):QWidget(parent){ui.setupUi(this);QVBoxLayout*pVlay=newQVBoxLayout(this);QLabel*label=newQLabel(u8"QtCEFDemo");label->setFixedHeight(30);m_pCefView=newCustomCefView("https://www.baidu.com/",this);pVlay->addWidget(label);pVlay->addWidget(m_pCefView);setLayout(pVlay);}
上述代码是显示百度首页,按F5运行时,会提示没有dll, 把bin目录里编译好的文件全部放到exe所在的目录接口,MyTest运行结果如下:
</div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">
QCefView怎么用的详细内容,希望对您有所帮助,信息来源于网络。