Qt实现网页内嵌

文章目录

一、环境准备

二、代码实现

三、测试


一、环境准备

首先,确保你的Qt安装包含了QtWebEngine模块。我的Qt是5.12.9并且使用MSVC来编译项目。在项目文件中需要添加以下配置,其中在Qt中配置MSVC,建议去看看这位大佬的博客:Qt 添加MSVC2017编译器(2022年保姆级教程,不安装完整VS)_qt msvc2017-CSDN博客

确保:

复制代码
QT += core gui webenginewidgets

二、代码实现

mainwindow.cpp,主要实现的简单网页浏览器,其通过QWebEngineView组件实现了网页内嵌功能。如下为测试demo文件代码:

复制代码
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QWebEngineView>
#include <QWebEnginePage>
#include <QWebEngineProfile>
#include <QStyle>
#include <QApplication>

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

    // 设置窗口标题和大小
    setWindowTitle("Web Browser");
    resize(1024, 768);

    // 创建工具栏
    toolBar = new QToolBar(this);
    addToolBar(toolBar);

    // 创建地址栏
    urlLineEdit = new QLineEdit(this);
    urlLineEdit->setPlaceholderText("Enter URL (e.g., https://www.google.com)");
    urlLineEdit->setStyleSheet("QLineEdit { padding: 5px; border-radius: 3px; }");
    toolBar->addWidget(urlLineEdit);

    // 创建前进按钮
    goButton = new QPushButton("Go", this);
    goButton->setStyleSheet("QPushButton { padding: 5px 15px; background-color: #4CAF50; color: white; border: none; border-radius: 3px; }"
                           "QPushButton:hover { background-color: #45a049; }");
    toolBar->addWidget(goButton);

    // 创建网页视图
    webView = new QWebEngineView(this);
    setCentralWidget(webView);

    // 创建进度条
    progressBar = new QProgressBar(this);
    progressBar->setMaximumHeight(2);
    progressBar->setTextVisible(false);
    progressBar->setStyleSheet("QProgressBar { border: none; background-color: #f0f0f0; }"
                              "QProgressBar::chunk { background-color: #4CAF50; }");
    statusBar()->addPermanentWidget(progressBar);

    // 连接信号和槽
    connect(goButton, &QPushButton::clicked, this, &MainWindow::loadPage);
    connect(urlLineEdit, &QLineEdit::returnPressed, this, &MainWindow::loadPage);
    connect(webView, &QWebEngineView::urlChanged, this, &MainWindow::updateUrl);
    connect(webView, &QWebEngineView::loadProgress, this, &MainWindow::updateProgress);
    connect(webView, &QWebEngineView::titleChanged, this, &MainWindow::updateTitle);

    // 设置初始页面
    webView->setUrl(QUrl("https://www.google.com"));
}

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

void MainWindow::loadPage()
{
    QString url = urlLineEdit->text();
    if (!url.startsWith("http://") && !url.startsWith("https://")) {
        url = "https://" + url;
    }
    webView->setUrl(QUrl(url));
}

void MainWindow::updateUrl(const QUrl &url)
{
    urlLineEdit->setText(url.toString());
}

void MainWindow::updateProgress(int progress)
{
    progressBar->setValue(progress);
    if (progress == 100) {
        progressBar->hide();
    } else {
        progressBar->show();
    }
}

void MainWindow::updateTitle(const QString &title)
{
    setWindowTitle(title + " - Web Browser");
}

三、测试

1.打开博客网页:

2.打开B站网页:

合理!!!!!

相关推荐
啊呦.超能力3 小时前
QT开发---多线程编程
开发语言·qt
程序员编程指南5 小时前
Qt 与 SQLite 嵌入式数据库开发
c语言·数据库·c++·qt
fyzy5 小时前
qt编译时一直循环报错打印-spec win32-g++ “CONFIG+=debug“ “CONFIG+=qml_debug“
qt
ん贤10 小时前
GoWeb必备理论
go·web
程序员编程指南10 小时前
Qt 网络编程进阶:WebSocket 通信
c语言·网络·c++·qt·websocket
我的ID配享太庙呀11 小时前
从零开始:在 PyCharm 中搭建 Django 商城的用户注册与登录功能(轮播图+商品页-小白入门版)
数据库·python·django·sqlite·web·教育电商
不断努力的根号七20 小时前
qt框架,使用webEngine如何调试前端
开发语言·前端·qt
范纹杉想快点毕业1 天前
基于C语言的Zynq SOC FPGA嵌入式裸机设计和开发教程
c语言·开发语言·数据库·嵌入式硬件·qt·fpga开发·嵌入式实时数据库
程序员编程指南1 天前
Qt容器类:QList、QMap等的高效使用
c语言·开发语言·c++·qt
程序员编程指南1 天前
Qt 元对象系统(Meta-Object System)解析
c语言·开发语言·c++·qt