基于MCU平台的HMI开发的性能优化与实战(下)

继上篇《基于MCU平台的HMI开发的性能优化与实战（上）》深入探讨了提升MCU平台HMI开发效率和应用性能的策略后，本文将专注于NXP i.MX RT1170 MCU平台的仪表盘开发实践。我们将重点介绍Qt for MCUs的优化技巧，展示如何通过实际案例应用这些策略，以实现高效且性能卓越的HMI解决方案。

NXP的i.MX RT1170是一款高性能双核MCU，集成1GHz Arm Cortex-M7和400MHz Cortex-M4内核，提供2MB SRAM和高级安全功能。它支持多种媒体功能和实时性能，适用于消费电子、工业和汽车应用。

上图展示的HMI仪表设计图融入了丰富元素，如实时速度、导航、车辆与电池状态，以及伪3D效果、动态车道线和多图层图像叠加等。这些设计在MCU平台上的精确实现，对HMI的高保真呈现构成了挑战。

我们将深入探讨这一设计在实际开发中的应用策略。通过实施9项关键优化，显著降低了资源消耗并增强了程序性能，确保了MCU平台上动画的流畅性，从而提升了用户体验。

• 复用一个Text文本框达到多个Text的显示效果

UI设计中有许多文字部分，比如说像上图所示的能耗部分的文字显示，从常规思维来说 “XXX km”、“XXX wh/km”和“XX.X Kmh”三部分因为数字和单位的文字大小不一样，通常会用6个Text元素实现，但是会增加文本布局的计算开销，因此我们复用一个Text文本框以达到和多个Text相同的显示效果，避免多次针对文本的布局计算。

•  烘焙素材，考虑素材之间的层叠关系

 在HMI开发中，为避免速度表动画因多图叠加导致的性能问题，我们优化了素材的层叠处理。原先通过五张图叠加实现的动效，因频繁像素计算而造成动画卡顿。我们对方案进行了改进，将指针、内外光晕合并为一张图，并仅使用上半部分。通过调整旋转中心，实现指针转动效果，这样既减少了图像处理的计算量，也降低了素材数量，有效节约了资源，提升了动画流畅度。

• 图片素材优化

UI设计给出的图片资源中有些图片规格很大，然而并不是整张图片的内容都会被用到，但是没有用到的图片内容在运行时也进行了像素计算，这部分计算就是多余的资源开销，此时我们就需要对图片进行剪切，将不需要的图片内容剪裁掉，避免资源浪费。

• 降低图片编码渲染格式

在UI设计中，我们根据图片的像素精细度需求，为它们分配了不同的编码渲染格式。例如，对于像素要求较低的纯色图像，我们采用ARGB4444格式；而对于细节丰富、色彩复杂的图像，则使用ARGB8888格式以保证质量。更多细节，请参考上一期的详细解析。

•  使用PathSVG来替代部分图片

 PathSVG 是一个 SVG (Scalable Vector Graphics) 文件中的元素，通常用于定义矢量图形的路径。SVG 是一种基于 XML 的文件格式，用于描述二维矢量图形。Path 元素是其中最重要和最常用的元素之一，可以用来绘制任意形状的路径，如直线、曲线和复杂的多边形。如上图所示为能耗突变的矩形框，我们可以使用PathSVG绘制矩形框，使用Gradient实现矩形框内颜色渐变，减少了图片渲染。

•  数字动画替代Timer

 仪表界面上有许多数值是随着时间变化而不断变化的，通常我们会绑定value，通过调用Timer不断改变value的数值，实现界面数据变化，但当Timer正在运行且其属性之一发生更改时，经过的时间会被重置，发生“脏事件”检查，占用大量CPU，所以我们使用NumberAnimation代替Timer，增加运行性能。

• 优化Text写法

如下表所示，优化前相当于在设置字体相关属性之前先使用了一个Qt.font对象，随后又对其进行数值修改，优化后相当于直接构建一个自定义的Qt.font对象。这样的操作减少了多余的计算开销，在同时存在多个Text而且Text属性需时刻相同时效果尤为明显。

• 编译器优化

编译器优化是一个复杂的领域，它使用了一系列的技术和策略，可以在保持程序语义不变的情况下，提高程序的运行速度并减小可执行文件的大小。同时编译器提供多个优化级别，允许开发人员在性能和可维护性之间进行权衡，例如，GCC和Clang等编译器提供了如下的优化级别：

1. O0：无优化，默认的优化级别，编译器不执行任何优化。
2. O1：基本优化，执行一些基本的优化操作，如删除未使用的变量、内联简单函数等。
3. O2：中级优化，进行了更多的优化操作，包括更大范围的内联、循环展开、函数调用图优化等。
4. O3：高级优化，进行了更深入的优化操作，如更大范围的内联、循环变形、自动向量化等。

在MCU仪表的开发中，我们采用Ofast编译模式以确保程序运行效率最大化。Ofast模式通过结合-O3和-ffast-math的优化特性，提供了一种极端的优化设置。这种设置能够充分利用CPU的多核和向量化指令集等硬件特性，显著提升程序的执行速度。尽管使用这种模式会增加程序的编译时间，但为了性能考虑这种取舍是必要的。

• 启用图片资源压缩

当处理图片显示时，MCU会先将图片数据从外部ROM复制到外部RAM，经过缩放、旋转等处理后复制到图像缓冲区中，其中外部ROM->外部RAM的步骤会消耗大量的运行时间，影响程序运行速度，为解决此问题，我们配置了以下三个参数：

resourceCachePolicy

配置resourceCachePolicy: “OnDemand”启用图像缓存，此时，图像在首次加载并使用后，并不会立刻被释放，而是保存在一个专门的缓存空间内，在下次使用时将直接从缓存中拿取，避免了重复加载图像带来的时间开销。

maxResourceCacheSize

设置maxResourceCacheSize: xxxxxxxx可配置最大缓存空间。

resourceCompression

配置resourceCompression: true则可以启用对图像的资源压缩，尽可能的减小图像体积，节省外部ROM空间。

应用这些优化策略后，我们能够在NXP1170平台上高效地实现并流畅运行UI设计。

若您希望获取完整的Demo源代码或深入了解Qt for MCUs，请随时联系我们或将需求发送至[e-mail]。