当前位置: 代码网 > it编程>编程语言>C/C++ > 01-Qt WebEngine模块开发环境搭建

01-Qt WebEngine模块开发环境搭建

2024年08月02日 C/C++ 我要评论
QT WebEngine开发环境搭建

一、qt webengine

qt webengine_hitzsf的博客-csdn博客

qt webengine模块提供了一个web浏览器引擎,可以轻松地将万维网上的内容嵌入到没有本机web引擎的平台上的qt应用程序中。qt webengine提供了用于渲染html,xhtml和svg文档的c ++类和qml类型,它们使用级联样式表(css)进行样式设置并使用javascript编写脚本。 用户可以通过使用html元素上的contenteditable属性,使html文档完全可编辑。

1、qt webengine架构

qt webengine中的功能分为以下模块:

  1. qt webengine widgets,用于创建基于widget的web应用程序
  2. qt webengine,用于创建基于qt quick的web应用程序
  3. qt webengine core,用于与chromium交互
  4. qt webengine process模块,页面渲染和javascript执行从gui流程分离到qt webengine process中。 如果将qt库捆绑到应用程序中,则该库必须随应用程序一起提供。

2、瑞芯微带qt webengine的sdk编译

详见如下链接

有道云笔记

3、qt webengine 类介绍

qt qwebengine 加载网页及交互,实现c++与js 相互调用_qt5 加载网页-csdn博客

qt webengine(04):qwebengineview 类【官翻】-csdn博客

4、官方demo程序

下面这两个是比较好的学习示例,simplebrowser是使用的qt widget,quicknanobrowser是使用的 qt quick

d:\qt5.12.10\install\examples\qt-5.12.10\webenginewidgets\simplebrowser

d:\qt5.12.10\install\examples\qt-5.12.10\webengine\quicknanobrowser

二、开发环境安装

qtwebengine模块作为qt的子模块同样支持跨平台,可以安装在windows、linux、macos系统上,我这里安装在了windows和ubuntu下。为了在rk3568平台上运行qt web程序,所以还需要安装arm64的交叉编译环境(只支持在ubuntu下编译)

1、windows桌面版本

在windows上,qt5.12.10版本中的qt webengine仅在msvc 2017或msvc2019下可用,所以在按照qt之前,需要先安装vs2017。

注:我这里想选用的5.12.10版本,可以下载安装其他版本的也可以,比如5.12.2,在ubuntu下就是安装的这个版本

1、vs2017环境安装

visual studio 2017下载及安装_vs2017下载_枫蓝驿的博客-csdn博客

2、qt creator安装

qt下载链接:index of /archive/qt/5.12/5.12.10

选择安装组件,需要勾选上msvc2017 和 qt webengine

2、ubuntu桌面版本

2.1、安装前需要先安装下面的库

sudo apt-get install libxcb-xinerama0

sudo apt-get install libxcb-cursor0

2.2、下载安装

1、下载

index of /archive/online_installers/4.6

2、安装

在线安装 qt,加入参数--mirror qt安装包下载_开源镜像站-阿里云 这样指定镜像源。备用镜像源地址,若镜像源不可用时我们还有备用的镜像源地址

https://mirror.nju.edu.cn/qt // 南京大学源
http://mirrors.ustc.edu.cn/qtproject // 中科大源
https://mirrors.cnnic.cn/qt // 开源软件源
https://download.qt.io // qt 官方源

使用 sudo 权限来安装,默认会安装在/opt/qt 这个路径

chmod +x qt-unified-linux-x64-4.6.0-online.run
sudo ./qt-unified-linux-x64-4.6.0-online.run --mirror https://mirrors.aliyun.com/qt

3、组件选择

这里为与瑞芯微sdk保持一致,所以选择的是qt5.15.2,android跟sources不需要可以不选择,不然会占用很多磁盘空间

2.3、遇到的问题

linux下使用qt的一些问题及解决方法_:-1: error: /opt/qt/5.15.2/gcc_64/lib/libqt5webeng-csdn博客

1、在ubuntu下编译qt程序时, 报如下错误

libqt5webenginecore.so: .dynsym local symbol at index 3 (>= sh_info of 3)
libqt5webenginecore.so: .dynsym local symbol at index 4 (>= sh_info of 3)
libqt5webenginecore.so: .dynsym local symbol at index 5 (>= sh_info of 3)
libqt5webenginecore.so: .dynsym local symbol at index 6 (>= sh_info of 3)

解决办法如下:

ubuntu下编译qt程序libqtwebenginecore报错_libqt5webenginecore.so: .dynsym local symbol at in-csdn博客

[qtbug-80964] warnings when linking against webengine on ubuntu 19.10 - qt bug tracker

sudo apt-get install lld
sudo ln -sf /usr/bin/x86_64-linux-gnu-ld.gold /usr/bin/ld

2、qt编译时报错gl/gl.h: no such file or directory

解决办法:

ubuntu16.04下qt5.14报错:/home/zhangfakai/qt5.14.1/5.14.1/gcc_64/include/qtgui/qopengl.h:141: error: gl/ - 码农教程 (manongjc.com)

【qt】错误gl/gl.h: no such file or directory的解决方法(以及cannot find -lgl解决方法)-csdn博客

sudo apt-get install mesa-common-dev
sudo apt-get install libgl1-mesa-dev libglu1-mesa-dev
sudo ln -s /usr/lib/x86_64-linux-gnu/mesa/libgl.so.1.2.0 /usr/lib/libgl.so

3、交叉编译环境

我这里使用的是正点原子通过sdk编译出来的交叉编译工具链 atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run

1、交叉编译器安装

将该工具拷贝到ubuntu下后,执行进行安装,默认安装在的 /opt/atk-dlrk356x-toolchain/ 路径下

chmod 777 atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run
./atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run

2、导出环境变量

在 /etc/profile 文件最后添加如下命令,默认导出编译器环境

add the path of arm-linux compiler to env
if [ -d  /opt/atk-dlrk356x-toolchain/bin ]; then
export path=$path:/opt/atk-dlrk356x-toolchain/bin
fi

3、配置构建套件(kit)

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com