细说 QML
分享
文章平均质量分 90
全新的 QML，基于 Qt6 + CMake，内容涉及语法、常见元素、模型视图、画布与绘图、动画效果、粒子系统、着色器、多媒体、Web 开发、网络编程、JavaScript、C++ 交互等
超级会员免费看
一去丶二三里
聚焦程序人生，践行终身成长。专注分享 IT 技术「Qt/C++/Python/JavaScript/Linux 等」、学习资料、职场经验、热点资讯，有趣、好玩、靠谱！
展开
-
《细说 QML》
全新的 QML，基于 Qt6 + CMake，清晰的思维导图，透彻的示例程序，超全面的章节。原创 2017-02-27 19:07:14 · 47514 阅读 · 27 评论
-
QML 状态
在设计用户界面时，经常会用到状态驱动的方式，使界面根据当前的状态的不同而呈现不同的内容。以交通信号灯为例，它有行驶、警示和停止三种状态。在行驶状态下，绿灯亮起，指示所有车辆可以通行；在警示状态下，黄灯亮起，提示司机注意并准备停车；而在停止状态下，红灯亮起，提示所有车辆停止前行。这种状态驱动的设计使用户能够清晰地了解当前情况，从而更好地作出相应的行动。原创 2024-05-08 23:43:07 · 603 阅读 · 0 评论 -
QML 状态、过渡和动画
当我们使用 QML 创建用户界面时，不仅要关心界面的静态外观，还需要注重一些动态交互效果。在之前的章节中，我们已经学习了图形元素的创建和布局，现在是时候赋予这些元素动态性了。原创 2024-04-29 23:13:40 · 573 阅读 · 0 评论 -
QML PathView 路径视图
PathView 是 QML 中一个功能强大、极其灵活的组件。它允许我们基于路径 Path 创建动态且多样化的视图效果，这条路径可以是直线、曲线，甚至是任意复杂的形状。原创 2024-04-16 15:54:15 · 611 阅读 · 0 评论 -
QML Path 路径
在 QML 中，Path 是一种用于定义和描述路径的元素，通常需要和 Canvas、PathView、Shape 等元素结合一起使用，用于生成复杂的图形或动画效果。原创 2024-04-11 11:37:55 · 458 阅读 · 0 评论 -
QML GridView 网格视图
和 ListView 一样，GridView 也是基于 Flickable 的视图组件，它们的用法非常相似。不同的是，ListView 中的元素被存储在线性链表中，并以单列（或单行）的形式进行展示的，因此适用于垂直（或水平）列表的场景；而 GridView 中的元素则被存储在一个二维数组中，并以网格的形式进行展示的，因此更适用于具有二维结构或以网格方式呈现的场景，如相册图库、视频列表、工具导航等。原创 2024-03-13 18:02:00 · 561 阅读 · 0 评论 -
QML ListView 列表视图
虽然 Repeater 在重复创建多个相似项的时候很方便，但是通常只适用于有限的简单元素，并且它还无法滚动浏览。而基于 Flickable 的视图组件（如 GridView、ListView、TableView、TreeView 等）则弥补了这些缺点，它们不但能够显示大量数据，而且还支持滚动浏览，尤其是针对复杂的布局和交互场景，可以通过分页显示、懒加载、动态更新等手段来提高性能。原创 2024-02-02 16:21:21 · 787 阅读 · 0 评论 -
QML Repeater 重复器
Repeater 是一种用于创建大量相似项的视图组件，通常被包含在定位器类型中（例如：Row、Column 等），以直观地定位它所创建的委托项。原创 2024-01-16 22:10:17 · 612 阅读 · 0 评论 -
QML 模型视图
对于 GUI 应用程序来说，我们通常需要格式化数据并进行显示，而 QML 提供了一种很便利的显示方式 - Model-View-Delegate（简称：MVD）。该模式是 Model-View-Controller（简称：MVC）的一种变体，常被用于分层开发，其优点在于可以很好地将数据模型和用户界面分离，使得数据的改变能够自动反映在界面上。原创 2024-01-09 21:36:08 · 849 阅读 · 0 评论 -
QML WebEngineView 全屏和退出
在使用浏览器时，我们经常会用到全屏模式，最常见的场景有：观看视频、阅读文章、在线演示等。全屏模式的优点在于，它可以让用户充分地利用有限的屏幕空间，更好地专注于内容本身，从而提供丰富的沉浸式视觉体验。原创 2023-12-12 23:04:03 · 1663 阅读 · 0 评论 -
利用 WebChannel 实现 QML 和 Web 双向通信
对于 QML 和 Web 混合应用来说，使用场景非常广泛，特别是像 HTML5 这样的东西，我们经常会用到。虽然 WebEngineView 使得在 QML 中嵌入 Web 页面变得非常简单，但是如何在它们之间架起一座桥梁，让彼此之间能够相互通信呢？这时就需要用到 WebChannel。原创 2023-11-27 22:02:40 · 1809 阅读 · 0 评论 -
QML WebEngineView 调用 JavaScript
在 QML 与 Web 混合开发时，除了使用 WebEngineView 加载网页之外，我们还可以在 QML 层运行 JavaScript 代码，这样就能更灵活地操作浏览器窗口和网页内容，从而实现丰富的交互功能了。例如：获取网页标题、通过点击按钮实现页面数据刷新等。原创 2023-11-02 23:46:33 · 1166 阅读 · 0 评论 -
QML 创建 Web 混合应用
随着互联网的快速发展，Web 应用在各个领域中变得越来越流行。为了满足用户对多样化功能的需求，我们经常需要将 Web 技术和原生应用相结合，来创建混合应用程序。原创 2023-10-31 18:07:11 · 1021 阅读 · 0 评论 -
史上最强的 QML 思维导图
这是一份史上最强、最高清、最好用的 QML 思维导图原创 2023-08-15 21:17:54 · 2937 阅读 · 2 评论 -
最好的 QML 教程，让你的代码飞起来！
想必大家都知道，亮哥一直深耕于 CSDN，坚持了好很多年，目前为止，原创已经 500 多篇了，一路走来相当不易。原创 2023-02-28 21:08:53 · 8928 阅读 · 4 评论 -
Qt Widgets、QML、Qt Quick 的区别
Widgets、QML、Qt Quick 傻傻分不清楚原创 2017-01-06 19:15:51 · 68305 阅读 · 7 评论 -
Qt6 for Android（HarmonyOS）真机调试
Qt6 在 Android（HarmonyOS）中的真机调试，基本步骤以及注意事项原创 2023-09-12 10:49:03 · 1947 阅读 · 0 评论 -
Qt6 for Android 环境搭建
JDK、Android SDK、NDK 安装下载，AVD 的创建，以及环境测试等原创 2023-09-03 22:47:48 · 1914 阅读 · 2 评论 -
Qt6 for Windows 环境搭建（MinGW）
Qt6.5 模块介绍、下载、安装、环境配置、运行原创 2023-08-26 10:31:58 · 2155 阅读 · 0 评论 -
Qt6 for Windows 环境搭建（MSVC）
MinGW 和 MSVC 的区别，以及 MSVC 下的 Qt 环境搭建。原创 2023-08-29 11:55:08 · 2084 阅读 · 0 评论 -
Qt6 for Windows 环境搭建（Visual Studio）
Visual Studio 下载安装、插件配置、环境测试原创 2023-08-29 23:56:06 · 1346 阅读 · 0 评论 -
QML WebSocket 服务器
在《QML WebSocket 客户端》一节中，我们开发了一个 WebSocket Client，但在测试的时候，连接的是 Postman 提供的 Echo Server。现在，是时候编写一个真正属于自己的服务了。原创 2023-08-18 21:15:17 · 846 阅读 · 0 评论 -
QML WebSocket 客户端
WebSocket 是一种网络传输协议，用于在客户端和服务器之间进行双向通信（全双工）。原创 2023-08-17 23:49:46 · 659 阅读 · 0 评论 -
QML HTTP 请求
在 Web 开发中，实现与服务器的通信至关重要，其中 HTTP 便是最常用的方式之一。它是一种客户端 - 服务器协议，客户端向服务器发送请求，服务器则返回响应。常被用于在浏览器/客户端和 Web 服务器之间传输消息、图像、音视频和其他类型的文件。原创 2023-08-14 22:35:59 · 1171 阅读 · 0 评论 -
QML 数据库存储
在开发 QML 应用过程中，经常需要处理和存储用户数据。虽然常见的选择是服务器端数据库，但有时也需要一种简单、轻量级的本地存储。在这方面，我们可以依靠 LocalStorage 来满足各种需求。原创 2023-08-08 00:29:40 · 923 阅读 · 0 评论 -
QML 保存用户配置
对于应用程序来说，数据存储是不可或缺的一部分。例如，我们通常需要将用户的偏好设置、应用程序配置等信息保存起来，这样即使程序关闭或设备重启，数据也会得到保留，很方便后续继续使用。原创 2023-08-03 00:51:09 · 765 阅读 · 0 评论 -
QML 单例组件
虽然普通的自定义组件很好用，但是并不利于数据共享以及全局状态的管理（如全局主题样式、全局配置、全局数据缓存等）。这时，单例组件了就派上用场了，通过它我们可以很方便地共享和管理应用级别的信息。原创 2023-08-01 23:38:16 · 910 阅读 · 4 评论 -
QML Canvas 几何变换（平移/旋转/缩放）
几何变换是 Canvas 提供的一项强大的图形处理能力，主要涉及平移、旋转、缩放。通过运用这些功能，我们有了更大的创作自由度，可以很容易的在 QML 中实现一些出色的游戏效果、动态图表、交互式数据可视化等，从而提升用户体验并营造出令人难忘的视觉效果。原创 2023-07-12 20:21:46 · 856 阅读 · 0 评论 -
QML Canvas 制作动画
终于要介绍动画了，这意味着我们快要把 Canvas 学完了，所以是时候庆祝一下了.....原创 2023-07-06 20:20:10 · 823 阅读 · 0 评论 -
QML Canvas 保存画布内容
不知大家想过没有，我们好不容易在 Canvas 上绘制了各种图形，该如何把它保存起来呢？比如，我们实现了一个画板，当用户制作完成自己的作品之后，是不是要将其保存起来，以分享给他人或者供自己后续再次编辑。原创 2023-07-04 20:51:28 · 812 阅读 · 0 评论 -
QML Canvas 裁剪
在 QML 开发中，Canvas 是一个很强大的绘图元素，可以实现各种复杂的图形效果，其中一个重要的特性就是裁剪。它的原理是使用路径或其他形状定义一个封闭区域，将绘图操作限制在该区域内，并隐藏掉超出该区域的部分。原创 2023-06-30 22:18:20 · 652 阅读 · 0 评论 -
QML Canvas 像素处理
在之前的章节中，我们虽然学习了 Canvas 的基本绘图，但是却不清楚其背后真实的图像像素原理，因此无法深入地操作像素来实现一些高级的功能（例如：灰度处理）。原创 2023-06-28 21:39:32 · 553 阅读 · 0 评论 -
QML Canvas 渐变和阴影
经过前面的 Canvas 学习，我们可以很容易地使用 strokeStyle 和 fillStyle 来设置图形的边框色和填充色，例如：“green”、“black” 等。其实除了使用纯色之外，我们还可以使用一些渐变色，如果你想让图形效果变得更加炫酷，甚至还可以为其添加阴影。原创 2023-06-26 18:22:38 · 746 阅读 · 0 评论 -
QML Canvas 绘制文本
关于 QML Canvas，我们已经学习了如何绘制基本图形、应用样式和颜色、绘制图像等，现在来看一下如何在 Canvas 中绘制文本。原创 2023-06-22 22:55:57 · 1004 阅读 · 0 评论 -
QML Canvas 绘制图像
对于 QML Canvas 而言，除了前面讲解的点线面的基本绘制之外，它还提供了一项很有意思的特性 - 绘制图像。只要是 Qt 支持的图片格式都可以使用，比如 PNG、JPEG 等，甚至可以将其它 Canvas 元素生成的图片作为图片源。原创 2023-06-21 00:14:33 · 929 阅读 · 0 评论 -
QML Canvas 绘制基础形状
Canvas 是一个用于在 QML 中绘制图形的元素，它提供了一个依赖于分辨率的位图画布，可用于动画、游戏、数据可视化、图片编辑以及视频处理等方面。原创 2023-06-16 22:47:28 · 1269 阅读 · 0 评论 -
QML Image 元素
在 QML 中，Image 是用于显示图像的基本元素之一，通过它可以很容易地加载本地或者网络图片。原创 2023-06-13 22:59:13 · 813 阅读 · 0 评论 -
QML Text 元素
在 QML 中，Text 和 Label 是两种常用的元素（Label 继承于 Text），用于显示文本内容。虽然它们看起来很相似，但在使用和功能上有一些不同。原创 2023-05-31 21:40:36 · 1045 阅读 · 0 评论 -
QML Rectangle 元素
在 QML 中，有许多可用的元素，其中最常见的一个是 Rectangle，可以用它来创建矩形形状的图形。原创 2023-03-28 19:27:49 · 821 阅读 · 1 评论 -
QML 国际化
在开发 QML 应用程序时，迟早要满足多语言的需求（例如：中英文），尤其是对动态翻译的支持，能够让我们的程序更加易用。原创 2023-03-22 20:04:20 · 1311 阅读 · 2 评论