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站网页:

合理!!!!!

相关推荐
C++ 老炮儿的技术栈7 小时前
GCC编译时无法向/tmp 目录写入临时汇编文件,因为设备空间不足,解决
linux·运维·开发语言·汇编·c++·git·qt
米优11 小时前
qt+vlc实现国标客户端测试工具
qt·gb28181·vlc
米优11 小时前
qt+vlc实现解码h264/h265裸码流播放
开发语言·qt·vlc
小小码农Come on12 小时前
QT面试题总结
开发语言·qt
特立独行的猫a13 小时前
HarmonyOS鸿蒙PC的QT应用开发:(二、开发环境搭建及第一个HelloWorld)
qt·华为·harmonyos·鸿蒙·鸿蒙pc
史迪仔011213 小时前
[QML] QT5和QT6 圆角的不同设置方法
前端·javascript·qt
一只小小的土拨鼠13 小时前
【避坑指南】Qt + MSVC + CUDA 项目链接与发布报错全记录
开发语言·qt
曲幽13 小时前
FastAPI自动生成的API文档太丑?我花了一晚上把它改成了客户愿意付费的样子
python·fastapi·web·swagger·openapi·scalar·docs
code_pgf14 小时前
RPC数据集整理与 Scalabel 标注说明
qt·网络协议·rpc
白杆杆红伞伞14 小时前
Qt Lock&Semaphore
qt·线程同步