QcefView：一個集成了CEF的Qt Widget

本文轉載自查看原文 2020-01-08 15:01 3873 CEF/ OpenSource

官方網址：http://tishion.github.io/QCefView/
Github地址：https://github.com/tishion/QCefView
QCefView是一個與Chromium Embedded Framework集成的Qt小部件。
您可以使用QCefView而無需編寫任何與CEF代碼相關的代碼。
這個Qt小部件是分布在二進制模塊和LGPL許可的。
現在您可以嘗試使用QCefView來開發您的應用程序，像使用其他QWidgets一樣使用它。 QCefView小部件提供了幾種方法來在本地C ++代碼和Web代碼之間進行通信。
您不需要編寫通信業務邏輯。
首先將cef_binary_3.2704.1414.g185cd6c_windows64（或其他版本）解壓再dep目錄下
使用Cmake-gui工具配置生成sln工程文件
使用對應的VS打開sln進行編譯構建，QCefView.lib以及QCefView.dll最后生成在out對應的目錄下

詳情請參考官方文檔以及之前的文章。
基於QCefView的瀏覽器應用程序例子代碼：Qt Creator工程
在工程目錄下新建文件夾QCefViewSDK，將QCefView-master/out/QCefView下的include文件夾和lib文件夾拷貝在CefViewSDK目錄下。
MSVC2017 64bit構建工程，將QCefView-master/out/QCefView/bin中對應配置的文件全部拷貝到輸出目錄中，在其中新建web文件夾，拷貝QCefViewTestPage.html到其中。

            qtCefView  
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

QT       += core gui

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = qtCefView
TEMPLATE = app

SOURCES += main.cpp\
        mainwindow.cpp \
        qtcefview.cpp

HEADERS  += mainwindow.h \
        qtcefview.h

FORMS    += mainwindow.ui

LIBS += user32.lib

# lib qcefview
win32: LIBS += -L$$PWD/QCefViewSDK/lib/Release/ -lQCefView

INCLUDEPATH += $$PWD
DEPENDPATH += $$PWD

            QtCefView.h 
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

#ifndef MYCEFVIEW_H
#define MYCEFVIEW_H

#include <QtCore>
#include <QtGui>
#include "QCefViewSDK/include/QCefView.h"

class QtCefView : public QCefView
{
public :
    QtCefView( const QString url, QWidget *parent = nullptr);

     // QCefView interface
protected slots:
     void onLoadingStateChanged( bool isLoading, bool canGoBack, bool canGoForward) override;
     void onLoadStart() override;
     void onLoadEnd( int httpStatusCode) override;
     void onLoadError( int errorCode, const QString &errorMsg, const QString &failedUrl) override;
     void onQCefUrlRequest( const QString &url) override;
     void onQCefQueryRequest( const QCefQuery &query) override;
     void onInvokeMethodNotify( int browserId, int frameId, const QString &method, const QVariantList &arguments) override;
};

#endif // MYCEFVIEW_H

            QtCefView.cpp 
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76

#include "QtCefView.h"
#include "Windows.h"

QtCefView::QtCefView( const QString url, QWidget *parent):
    QCefView(url, parent)
{

}

void QtCefView::onLoadingStateChanged( bool isLoading, bool canGoBack, bool canGoForward)
{
    qDebug() << "isLoading:" << isLoading << "canGoBack" << canGoBack << "canGoForward" << canGoForward;
}

void QtCefView::onLoadStart()
{
    qDebug() << "onLoadStart" ;
}

void QtCefView::onLoadEnd( int httpStatusCode)
{
    qDebug() << "onLoadEnd" << httpStatusCode;
}

void QtCefView::onLoadError( int errorCode, const QString &errorMsg, const QString &failedUrl)
{
    qDebug() << "onLoadError" << errorCode << errorMsg << failedUrl;
}

void QtCefView::onQCefUrlRequest( const QString &url)
{
    qDebug() << "onQCefUrlRequest" << url;
}

void QtCefView::onQCefQueryRequest( const QCefQuery &query)
{
    qDebug() << "onQCefQueryRequest" << query.id() << query.reqeust();

    QString text = QString(
                        "Current Msg From: mycefview main thread\r\n"
                        "Query: %1" ).arg(query.reqeust());

    query.setResponseResult( true , text);
    responseQCefQuery(query);
}

void QtCefView::onInvokeMethodNotify( int browserId, int frameId, const QString &method, const QVariantList &arguments)
{
    qDebug() << "onInvokeMethodNotify" << browserId << frameId << method << arguments;

     if ( 0 == method.compare( "onDragAreaMouseDown" ))
    {
        HWND hWnd = ::GetAncestor((HWND)getCefWinId(), GA_ROOT);

         // get current mouse cursor position
        POINT pt;
        ::GetCursorPos(&pt);

         // in case the mouse is being captured, try to release it
        ::ReleaseCapture();

         // simulate that the mouse left button is down on the title area
        ::SendMessage(hWnd, WM_NCLBUTTONDOWN, HTCAPTION, POINTTOPOINTS(pt));
         return ;
    }

    QString title( "QCef InvokeMethod Notify" );
    QString text = QString(
                        "Current Thread: mycefview main thread\r\n"
                        "Method: %1\r\n"
                        "Arguments: ..." )
                   .arg(method);

    QMessageBox::information( this ->window(), title, text);
}

            mainwindow.h 
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QtCore>
#include <QtGui>
#include "QtCefView.h"
#include <QLineEdit>
#include <QPushButton>

namespace Ui
{
     class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public :
     explicit MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

public slots:
     void slot_btn_go();

private slots:
     void on_actionTest_triggered();

private :
    Ui::MainWindow      *ui;
    QtCefView           *m_pCefView;
    QLineEdit           *m_pEditUrl;
    QPushButton         *m_pBtnGo;

};

#endif // MAINWINDOW_H

            mainwindow.cpp  
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui( new Ui::MainWindow)
{
    ui->setupUi( this );
     // add url
    m_pEditUrl = new QLineEdit( "http://www.baidu.com" , this );
    ui->mainToolBar->addWidget(m_pEditUrl);
     // add go button
    m_pBtnGo = new QPushButton( "Go" , this );
    ui->mainToolBar->addWidget(m_pBtnGo);
    connect(m_pBtnGo, SIGNAL(clicked( bool )), this , SLOT(slot_btn_go()));
     // add cef view
    QDir dir = QCoreApplication::applicationDirPath();
    QString uri = QDir::toNativeSeparators(dir.filePath( "web\\QCefViewTestPage.html" ));
    m_pEditUrl->setText(uri);
    m_pCefView = new QtCefView(uri, this );
    ui->centralLayout->addWidget(m_pCefView);
}

MainWindow::~MainWindow()
{
     delete ui;
}

void MainWindow::slot_btn_go()
{
    QString strUrl = m_pEditUrl->text();
    QUrl urlCheck(strUrl);
     if (urlCheck.isValid())
    {
        m_pCefView->navigateToUrl(strUrl);
    }
     else
    {
        qDebug() << strUrl << "is unvalid!" ;
    }
}

void MainWindow::on_actionTest_triggered()
{
    qsrand(::GetTickCount());
    QColor color(qrand());

    QCefEvent event( "colorChangedEvent" );
    event.setStringProperty( "color" , color.name());
    m_pCefView->broadcastEvent( "colorChange" , event);
}

            mainwindow.ui 
         

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77

<?xml version= "1.0" encoding= "UTF-8" ?>
<ui version= "4.0" >
< class >MainWindow</ class >
<widget class = "QMainWindow" name= "MainWindow" >
  <property name= "geometry" >
   <rect>
    <x> 0 </x>
    <y> 0 </y>
    <width> 800 </width>
    <height> 600 </height>
   </rect>
  </property>
  <property name= "windowTitle" >
   <string>MainWindow</string>
  </property>
  <property name= "styleSheet" >
   <string notr= "true" />
  </property>
  <widget class = "QWidget" name= "centralWidget" >
   <layout class = "QVBoxLayout" name= "centralLayout" >
    <property name= "spacing" >
     <number> 0 </number>
    </property>
    <property name= "leftMargin" >
     <number> 1 </number>
    </property>
    <property name= "topMargin" >
     <number> 1 </number>
    </property>
    <property name= "rightMargin" >
     <number> 1 </number>
    </property>
    <property name= "bottomMargin" >
     <number> 1 </number>
    </property>
   </layout>
  </widget>
  <widget class = "QMenuBar" name= "menuBar" >
   <property name= "geometry" >
    <rect>
     <x> 0 </x>
     <y> 0 </y>
     <width> 800 </width>
     <height> 23 </height>
    </rect>
   </property>
   <widget class = "QMenu" name= "menu" >
    <property name= "title" >
     <string>菜單</string>
    </property>
    <addaction name= "actionTest" />
   </widget>
   <addaction name= "menu" />
  </widget>
  <widget class = "QToolBar" name= "mainToolBar" >
   <attribute name= "toolBarArea" >
    < enum >TopToolBarArea</ enum >
   </attribute>
   <attribute name= "toolBarBreak" >
    < bool > false </ bool >
   </attribute>
  </widget>
  <widget class = "QStatusBar" name= "statusBar" />
  <action name= "actionTest" >
   <property name= "text" >
    <string>改變顏色</string>
   </property>
   <property name= "toolTip" >
    <string>測試的Tip</string>
   </property>
  </action>
</widget>
<layoutdefault spacing= "6" margin= "11" />
<resources/>
<connections/>
</ui>

            main.cpp 
         

1
2
3
4
5
6
7
8
9
10
11
12
13

#include "mainwindow.h"
#include <QApplication>

int main( int argc, char *argv[])
{
    QApplication a(argc, argv);

    MainWindow w;
    w.show();

     return a.exec();
}

運行展示：

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 使用CEF（四）— 在QT中集成CEF（1）：基本集成 Windows下Qt Creator中使用cef的一個學習例子 QT Widget 重繪 Qt Qml嵌入Widget以及Qml與Widget交互 Qt動態布局，多個窗口使用同一個widget如何實現。 QT mainWindow /widget/dialog區分 Qt QTabWidget插入widget（重要的是編程思想）關於Qt選擇qml還是widget的深度思考 Qt 控制Widget窗體大小方法 QT:給Widget設置背景圖片