QWebEngineView_简单例子_01

工程名 : WebEngine01

1、WebEngine01.pro

#-------------------------------------------------
#
# Project created by QtCreator 2016-11-08T08:40:05
#
#-------------------------------------------------

QT       += core gui    \
            webenginewidgets

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = WebEngine01
TEMPLATE = app

SOURCES += main.cpp\
        mainwindow.cpp \
    TformWebEngine01.cpp \
    TzcWebEngine.cpp

HEADERS  += mainwindow.h \
    TformWebEngine01.h \
    TzcWebEngine.h

FORMS    += mainwindow.ui \
    TformWebEngine01.ui

2、main.cpp

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

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();

    return a.exec();
}

3、TzcWebEngine.h / TzcWebEngine.cpp 自定义的 继承QWebEngineView的子类

　　3.1、TzcWebEngine.h

#ifndef TZCWEBENGINE_H
#define TZCWEBENGINE_H

#include <QtWebEngineWidgets/QtWebEngineWidgets>

class TzcWebEngine : public QWebEngineView
{
    Q_OBJECT

public:
    explicit TzcWebEngine(QWidget* parent = Q_NULLPTR);

public:
    void FenXi();
};

#endif // TZCWEBENGINE_H

　　3.2、TzcWebEngine.cpp

#include "TzcWebEngine.h"

#include <QDebug>

TzcWebEngine::TzcWebEngine(QWidget* parent):
    QWebEngineView(parent)
{
}

void TzcWebEngine::FenXi()
{
    qDebug() << this->url().url();
    //this->page()->url()
    //this->page()->runJavaScript();

// http://blog.csdn.net/li235456789/article/details/50959384
//    const QString script = QLatin1String(
//        "var evObj = document.createEvent('MouseEvents');"
//        "evObj.initEvent('click', true, true);"
//        "this.dispatchEvent(evObj);");
    //element.evaluateJavaScript(script);

    const QString script = QLatin1String(
                "var evObj = document.getElementById('loginButton');"
                "evObj.initEvent('click', true, true);"
                "this.dispatchEvent(evObj);");
    this->page()->runJavaScript(script);

    // http://bbs.csdn.net/topics/370070779
}

4、TformWebEngine01.h / TformWebEngine01.cpp 承载(显示) WebEngineView的 窗口(QWidget)。

　　暂时 好像没有没有使用这个窗口(QWidget)，要用的话 用起来也很简单

　　4.1、TformWebEngine01.h

#ifndef TFORMWEBENGINE01_H
#define TFORMWEBENGINE01_H

#include <QWidget>

namespace Ui {
class TformWebEngine01;
}

class TformWebEngine01 : public QWidget
{
    Q_OBJECT

public:
    explicit TformWebEngine01(QWidget *parent = );
    ~TformWebEngine01();

private:
    Ui::TformWebEngine01 *ui;
};

#endif // TFORMWEBENGINE01_H

　　4.2、TformWebEngine01.cpp

#include "TformWebEngine01.h"
#include "ui_TformWebEngine01.h"

TformWebEngine01::TformWebEngine01(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::TformWebEngine01)
{
    ui->setupUi(this);
}

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

5、MainWindow.h / MainWindow.cpp 主界面

　　5.1、MainWindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QCloseEvent>
#include "TzcWebEngine.h"

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

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

private:
    Ui::MainWindow *ui;

public:
    TzcWebEngine *Fpwe;

private slots:
    void on_pbtnShowFrmWE_clicked();
    void on_pbtnFenXi_clicked();

protected:
    void closeEvent(QCloseEvent *_event);
};

#endif // MAINWINDOW_H

　　5.2、MainWindow.cpp

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

#include <QDebug>

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    Fpwe = NULL;
    //this->setAttribute(Qt::WA_DeleteOnClose);
}

MainWindow::~MainWindow()
{
    //qDebug() << "~MainWindow()";
    Fpwe = NULL;
    delete ui;
}

//函数主体部分
void MainWindow::closeEvent(QCloseEvent *_event)//此函数在QWidget关闭时执行
{
    //event->ignore();
    //qDebug() << "closeEvent";
    if (Fpwe != NULL)
    {
        Fpwe->close();
        delete Fpwe;
        Fpwe = NULL;
    }
    _event->accept();
}

void MainWindow::on_pbtnShowFrmWE_clicked()
{
    if (Fpwe == NULL)
    {
        Fpwe = new TzcWebEngine();
        //Fpwe->load(QUrl::fromUserInput("http://www.baidu.com"));
        Fpwe->load(QUrl::fromUserInput("http://www.caiak998.com/"));
        int iTitleBarHeight = style()->pixelMetric(QStyle::PM_TitleBarHeight);
        int iDefaultFrameWidth = style()->pixelMetric(QStyle::PM_DefaultFrameWidth);

        Fpwe->setGeometry(iDefaultFrameWidth, iTitleBarHeight + iDefaultFrameWidth, , );

    //    Fpwe->showFullScreen();
    //    QRect rt = Fpwe->geometry();
    //    qDebug() << rt.left() << " , " << rt.top() << " , " << rt.width() << " , " << rt.height();
    //    Fpwe->setAttribute(Qt::WA_DeleteOnClose);
    }
    Fpwe->show();
}

void MainWindow::on_pbtnFenXi_clicked()
{
    if (Fpwe == NULL)
        return;
    Fpwe->FenXi();
}

6、界面

　　6.1、主界面  mainwindow.ui

　　　　6.1.1、图片

　　　　6.1.2、XML代码

<?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>564</width>
    <height>325</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralWidget">
   <widget class="QPushButton" name="pbtnShowFrmWE">
    <property name="geometry">
     <rect>
      <x>20</x>
      <y>10</y>
      <width>131</width>
      <height>23</height>
     </rect>
    </property>
    <property name="text">
     <string>Show FrmWebEngine01</string>
    </property>
   </widget>
   <widget class="QPushButton" name="pbtnFenXi">
    <property name="geometry">
     <rect>
      <x>20</x>
      <y>40</y>
      <width>131</width>
      <height>23</height>
     </rect>
    </property>
    <property name="text">
     <string>Fen Xi</string>
    </property>
   </widget>
  </widget>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <resources/>
 <connections/>
</ui>

　　6.2、承载(显示) WebEngineView的 窗口

　　　　TformWebEngine01.ui

　　　　6.2.1、图片

　　　　6.2.2、XML代码

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>TformWebEngine01</class>
 <widget class="QWidget" name="TformWebEngine01">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>553</width>
    <height>361</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Form</string>
  </property>
 </widget>
 <resources/>
 <connections/>
</ui>

7、

8、