梦起丶的博客

DelAvatar 是 DelegateUI 框架中用于展示用户身份标识的核心组件，支持图标、文本、图片三种表现形式，遵循 Ant Design 交互规范，提供灵活的可定制化能力。本文档将详细介绍其使用方法及最佳实践。

「 DelegateUI 」 基于 Qml 的 Ant-d UI 套件。

在使用 Qml 的函数时，开发者可能会遇到在 Linux 和 Windows 平台之间行为不一致的问题，尤其是在处理文件 URL 时。本文将深入探讨这一问题的成因及解决方案。很多时候，我们在开发跨平台应用时，需要理解平台之间的差异。总的来说，优先考虑使用这样的函数，来处理本地文件的 URL 转换，避免手动拼接带来的麻烦。

时间轴组件是现代用户界面中常见的元素，用于按时间顺序展示事件。本文将介绍如何使用 Qml 实现一个灵活且可定制的时间轴组件,并探讨其设计思路和实现细节。支持自定义节点样式：可以设置节点的图标、背景颜色、边框颜色等。支持自定义线条样式：可以设置线条的颜色和宽度。支持自定义时间显示格式：可以设置时间的显示格式和字体样式。支持自定义内容样式：可以设置内容的背景颜色、边框颜色、字体样式等。支持正序和倒序排列：可以根据时间戳对事件进行正序或倒序排列。节点样式。线条样式。时间样式。内容样式。

在 Qml 中，矩形（Rectangle）是最常用的元素之一。然而，标准的矩形元素仅允许设置统一的圆角半径。在实际开发中，我们经常需要更灵活的圆角设置，例如只对某些角进行圆角处理，或者设置不同角的圆角半径。本文将介绍如何通过自定义 Qml 元素实现一个任意角可为圆角的矩形。我们将创建一个名为的自定义 Qml 元素，它继承自，并重写其paint()方法来自定义绘制逻辑。通过自定义 Qml 元素，我们实现了对矩形圆角的更灵活控制，使其能够满足更多实际开发需求。

毛玻璃效果（Acrylic Effect）是一种常见的 UI 设计风格，它通过模糊背景并添加透明度和噪声效果，使界面元素看起来像是半透明的磨砂玻璃。本文将介绍如何使用 Qml 实现这种效果，并提供一个完整的示例代码。

通过使用，我们可以在 Qml 中实现了一个功能丰富的水印工具。这个工具允许我们自定义水印的外观和行为，并且可以很方便地在 Qml 中使用。最后：项目链接(多多star呀…

如果我们的 Qml 中使用了【Qt Shapes】模块，那么在打包的时候，会缺少Qt5QuickShapes.dll。然后，还需要复制【Qt/Version/Kit/qml/QtQuick/Shapes】整个文件夹(注意根据自己使用的编译套件来选择目录)。

最近在写信息提交的窗口时发现一个奇怪的 BUG：可以看到，当 ComboBox 嵌入 Popup 时，点开 ComboBox，然后滚动内容超过其可见区域并不会关闭 ComboBox 弹窗，并且会超出其父 Popup 范围。

在现代应用程序中，星级评分是一个常见的用户界面元素，它允许用户对产品、服务或内容进行评价。想必大家在用各种带有评分的软件中看到过这个组件：本文将指导你如何使用Qml创建一个简单而美观的星级评分组件，并且支持高度自定义。

水波效果最重点的就是水波，其实这个水波就是个障眼法罢了，画张图你们就明白了。其实它就是一个圆角正方形，一直在旋转和上升下降，让用户有一种水波的视觉感~当然，我们还需要将多余的部分裁剪掉，因此这里需要借助。至于进度条和文字就非常简单，直接看源码即可。学习了一下实现思路，觉得很有意思。，有一些小技巧，分享给大家~

在一般编程中，实现私有属性是一种常见的封装实践，它有几个重要目的和好处。 然而，在 QML 中，由于它是一种面向组件编程，并不能像传统的面向对象编程语言那样直接支持私有属性。因此，本篇通过使用一些特殊技巧，也能在 Qml 中实现私有属性。

在前端中这一般称为 Notification 或 Message，但本质是一种东西，即：悬浮弹出式的消息提醒框。这种组件一般具有以下特点：1、全局/局部显示：它不依赖于具体的页面元素，可以在整个页面的任意位置显示。2、自动消失：默认情况下，消息会在一定时间后自动消失，也可以设置为不自动消失。3、多种类型：支持多种类型的消息，如成功（Success）、警告（Warning）、错误（Error）和 消息（Message）等。4、可配置：可以自定义消息的显示位置、持续时间、内容等。然鹅 Qml 中并未

虽然QCryptographicHash 很优秀，但它最大的问题在于其散列值的计算是同步的( 即阻塞)，对小数据来说并没什么影响，但对大数据来说则意味明显卡顿。因此，我将QCryptographicHash 进行简单封装，扩展了实用性的同时并将计算改为异步，还增加了进度通知和结束通知。

最近在刷掘金的时候看到一篇关于瀑布流布局的文章，然鹅他们的实现都是前端的那套，就想着 Qml 有没有类似实现。结果百度了一圈也没有( T_T Qml 凉了凉了 )，于是，我按照自己理解，简单实现了一个 Qml 版的瀑布流布局。瀑布流布局（Waterfall Layout），也被称为瀑布式布局或多栏自适应布局，是一种网页布局技术，它允许内容以多列的形式显示，类似于瀑布一样从上到下流动。这种布局方式特别适合于展示图片或卡片式内容，如图片库、新闻摘要、商品列表等。

优化QML Canvas绘图性能是确保应用程序流畅运行的关键一环。通过采用上述技巧和策略，你可以提升绘图性能，改善用户体验，并确保应用程序在各种设备上都能够高效运行。只有不断地优化和调整绘图代码，结合性能分析工具的使用，才能使你的应用在绘图方面达到最佳状态。

尽管QML模块已经存在很长时间了，它们的使用在 Qt6 之前相当稀少。在 Qt6 中，它们变得更加普遍。并且有充分的理由：只有将所有相关的 QML 放在一个模块中，才能使qmllint或Qt Quick 编译器等工具正常工作。但是，到目前为止，Qt 自己的 API 的某些部分还不知道 module。与 QML 类型相互作用时，例如通过，您需要使用明确的文件路径。从 Qt 6.5 开始，现在有一个替代解决方案来利用模块，我们将在此博客文章中介绍。

在 Qml 中，很多时候我们需要动态创建一些​​​​​​​ Qml 对象，通常是：createComponent + createObject 或createQmlObject。然而，最近工作中却出现了一个相当难以察觉的问题，花了很多时间才定位到关键位置。其根本原因在于：未给动态创建的对象分配 parent ( 即：没有任何对象持有其引用 )，结果就是，当 Qml 引擎运行垃圾回收时，这些对象会被错误清除掉。

在 QML6 开发中，每个 QML 文档都默认具有隐式导入。这意味着我们可以在同一目录下使用其他 QML 文档，而无需显式导入。这大大减少了编写冗余代码的工作量。通常，我们不需要为QML文件所属的模块进行导入。然而，如果隐式导入不能识别文件所属的模块，这一功能的价值就会大打折扣。虽然理论上这种情况不应该发生，但由于 Cmake API 的限制，我们不能完全排除这种可能性。

很多时候，我们在对视频的解码和渲染的处理都要经过以下步骤： ◦ 软解码，视频帧位于内存。 ▪ 软渲染，需要拷贝到图像然后渲染；硬渲染则需要上传纹理，然后渲染。 ◦ 硬解码，视频帧位于显存。 ▪ 软渲染，需要下载到内存，然后拷贝到图像再渲染；硬渲染则直接拷贝到纹理，然后渲染。 然而，对于超高分辨率( 4K 8K )而言，上传下载带来的的性能损失太大了( CPU瓶颈 )，为了实现更流畅的体验和更低的资源占用，应当考虑更好的方案。

Qt 6 以后，对于 Qt Quick 不再直接使用各个图形 API 的着色器语言，而是使用一种 .qsb 的文件，这个文件由 qsb.exe 工具生成，它包含了各个图形 API 使用的字节码。通过使用 qsb，我们便可以自由切换硬件渲染后端而无需写多个平台的着色器代码。另一方面，.qsb 文件主要由 Qt Scene Graph 和 Qt3D 使用，当然，Qml 中相关的组件也同样使用，例如：ShaderEffect。因此，本篇使用前一篇的圣诞树作

2022年圣诞节到来啦，很高兴这次我们又能一起度过~这次给大家带来一个简单漂亮圣诞树灯。当然了，本篇文章主要是讲解一下如何在 Qml 中使用GLSL来实现自己的特效。至于代码嘛，我比较喜欢在Shaderjoy上寻找，那里有很多超级炫酷的着色器实现的特效，并且可以很轻松的集成到 Qml 中。

最近想把项目升级到 Qt6，因为代码的改动不算很大，所有想着打包也应该差不多。结果因为我使用了 Qt Charts，怎么也运行不起来，后来通过动态库依赖才发现 Qt6 新增加了一个 Qt6OpenGLWidgets.dll，并且打包时并不会自动复制，只能手动拷过来了。

最近在 Qml 中使用 MouseArea 时发现了一个奇怪的现象：位于 MouseArea 上的 ListView 在处理了滚轮事件的情况下进行滚轮，下面的 MouseArea 却在某些情况下接收到了这个事件。按照直觉，ListView 明明有内部的滚轮事件处理，应该阻止事件向下传递才对，然而此时的情况却出乎意料，因此在此记录并附上解决方案。

很多时候，我们为了方便调试，常常需要加入一些打印。例如 Qt 中的 QDebug，C 和 C++ 中的 printf / cout 等等，又或者是三方库提供的标准打印接口。然而大部分时候，这些打印相当不统一(格式和位置)，并且因为 Qt 作为 GUI 框架，调试信息实在不应该直接置于 UI 之上。因此，需要一种能统一和标准化所有标准打印的方法( 所谓标准打印即标准输出 stdout)，并且能够动态配置。

在做编辑相关的应用经常会用到颜色选择器。实际上, Qt Widgets 时代使用 QColorDialog 或者 Qml 中 ColorDialog即可完成一般的颜色选择的需求。 然鹅现在都 Windows 11了！！还在用那么拉跨的东西，实在是看不下去了。 然后自己一直很喜欢用 Windows 画图3D的那个颜色选择器，因此我决定仿照实现一个，并且还为它增加了一个透明度。

在 Qml 中，任何可视化的项的显示 ( 渲染 ) 都依赖一个根 QQuickWindow，它们包含了底层的场景图渲染器。 因此，如果我们想要在 Qml 中获取 FPS，则只需在窗口渲染场景图时记录帧数并计算帧率即可。 不过，需要注意的是：GUI 程序一般不会频繁刷新，并不建议使用循环 update() 来计算 ( 可行但并非最佳 )。 .........

【写在前面】有时候，当我们接手一个老项目( 也可能不老-.-)时，会碰上这些情况：1、老项目实用 QWidgets，想要部分或全部迁移到 Qml。2、老项目实用 Qml，想要部分或全部迁移到 QWidgets。然而，很多时候全部迁移几乎不现实，此时，折中的方案应运而生：QWdigets 和 Qml 相互嵌套使用。本篇主要内容：1、Qml 嵌入 QWiidgets中的方法及一些坑;2、QWiidgets嵌入Qml中的方法及一些坑;【正文开始】Qml 嵌入...

【写在前面】我们在 Qml 中经常会遇到这样的情况：有某个 Item ( 这里称为 Parent )，需要它在鼠标 Enter 时显示，鼠标 Exit 时隐藏。这时候我们会用一个 MouseArea，然后处理 onEntered / onExited。但是，有一个巨大的坑：如果这个 Item 里嵌入了其他Item ( 这里称为 Child )并且处理自己的 MouseArea，则会导致 Parent Item 的 MouseArea 失效( 即不能接收到相应的事件 )。本篇主要内..

【写在前面】之前一直在学着视频相关的知识，然后工作也正好是监控相关的。并且界面部分用Qml 开发的。一开始，我觉得相当容易，只是显示解码好的图像而已，没什么难度。因为之前写过一篇在 Qml 中实现：https://blog.youkuaiyun.com/u011283226/article/details/104051033?spm=1001.2014.3001.5501这个方法优点是简单，但是缺点是只支持 QImage/QPixmap/QQuickTextureFactory。...

【写在前面】因为之前写了几篇文章，是Qt 翻译的相关的，然后自己就去了解了下 TS 文件( Translate Source 翻译资源文件 )。发现只是比较简单的 XML 文件，又因为自己对 Qt 读写 XML 用的并不是很多，就想着学习一下在 Qt 中读写XML。结果。。顺便做了个 Qml 版的 Qt 语言家 ─.─|||。。【正文开始】在Qt 中，有三种读写 XML 文档的方法：1、QXmlStreamReader / QXmlStreamWriter ：QXmlStr..

【缘起】最近找到一个看起来比较好用的开源工具( 然鹅不太会用 )，但整个界面都是英文的。不过由于是 Qt 写的，所以就尝试自己做些汉化。然后了解到不少实现多国语言相关的技术( 以及一些坑 (‾◡◝) )。这里写一篇完整且具体的，「 如何在 Qt / Qml 中支持多国语言 & 动态翻译」。【正文开始】按例先上效果图。QtWidgets 的：实际上，这里包含两部分： 静态部分： - MainWindow Title「 MainWindow =>...

【写在前面】打包方法见Qt / Qt Quick程序打包的方法。这里是再次记录一个坑(爹)。【正文开始】直接进入正题：如果我们的 Qml 中使用了【Qt Labs】模块，那么在打包的时候，目录下多出一个 Qt\labs文件夹。但是，在 labs 下面会缺少一个文件夹，导致应用无法运行。只能使用 Process Explorer 找到每一个 dll，然后复制进去尝试。...

【写在前面】在很多软件中，程序通常需要这样一个状态：只有一个实例运行中。而另一些特殊的应用程序，它们又需要长期运行。实际上，对于这些情况，Qt 早已提供了解决方法：QtSingleApplication 和 QtService。不过要注意的是，它们并没有被包含在官方库中。【写在前面】...

【写在前面】这几天突然想起来，之前公司有个需求，是类似于搜索引擎的那种关键字排序。当然了，并不是做搜索，而且对历史输入记录的一个匹配 + 排序。然鹅因为疫情，工作已经辞了，但想着这个东西挺有意思的，还是决定实现一下。【正文开始】老样子，先展示一下效果图：...

【写在前面】在 Qml 中，实现多视图很容易，无非是多个 Image 而已。但是，如果需要动态刷新，则变得困难。再或者，来自多个不同的图像源，将更加复杂。实际上，这在 Qt( Widgets ) 中实现却很容易，究其原因，是 Qml 中缺少对 QImage ( 或者说 原始图像) 的支持 。即便如此，Qt 仍提供了一种解决方法。本篇主要内容：1、QML 中支持 QI...

【写在前面】在 Qt 中，对于一个键盘事件 QKeyEvent ，通常包含三种键值：1、key：Qt 键值，例如Qt::Key_Escape。2、nativeVirtualKey：本机虚拟键值，例如 VK_ESCAPE ( windows )。3、nativeScanCode：本机扫描码。【正文开始】在 Qml 中，也存在着键盘事件：KeyEvent。看起来它...

【写在前面】在很多应用中，很可能会需要这样的功能：我们点击窗口上的 × ，并不是要真的退出应用，而是要它们以小托盘的形式继续运行。情况 1：如果 × 是自定义的按钮，我们可以轻易控制它的行为，hide ->system tray。情况 2：如果 × 是窗口自带的按钮，那么对于QWidgets 来说，我们只需要重写其 closeEvent 方法，然后实现想要的动作。然鹅，对...

【写在前面】在 Widgets 中，不管是绘图( 使用QPainter )，还是不规则窗口( 使用setMask )都很容易。但是，Qt5 以后( Qt Quick / QWindow中)，事情就不那么简单了。即使是绘制一张图片( Image )都非常麻烦，能用的方法是：1、使用 OpenGL API。2、使用 Scene Graph API。3、使用 Image(QM...

【写在前面】首先，要提一个版本bug。因为一个类似的bug是在Qt 5.13.0 中 ( 5.12 则没有)，由QQuickPaintedItem引起的。详见：https://bugreports.qt.io/browse/QTBUG-78063同样的，使用Image后，也会无限增长内存。但是先忽略这个bug，因为这里要讲的是Image的内存。【正文开始】在qml中，I...