SuperAPI AI 工具集

qt-qml-component-generator

编程与开发

查看项目

更新于 10-15 10:46

技能介绍

用途

qt-qml-component-generator 用于生成 QML 组件,按照 Qt 最佳实践创建结构良好的组件,支持属性绑定、信号/槽连接以及 Qt Quick Controls 集成。

主要能力

  • 生成带属性绑定的 QML 组件
  • 创建自定义 QML 类型并完成正确注册
  • 设置 QML 与 C++ 之间的信号/槽连接
  • 配置 Qt Quick Controls 样式
  • 生成模型/视图组件(ListView、GridView)
  • 创建可复用组件库
  • 搭建 QML 模块结构
  • 生成类似 TypeScript 的类型注解

使用方式

该技能通过输入 Schema 接收参数,必需项为 projectPath(Qt 项目路径)和 componentName(QML 组件名称)。可选参数包括:componentType(枚举:item、control、popup、view、delegate、singleton,默认 item)、properties(属性数组,每项含 name、type、defaultValue、readonly)、signals(信号数组,每项含 name、parameters)、cppBackend(布尔值,是否生成 C++ 后端类,默认 false)、useControls(枚举:none、basic、material、universal、fusion,默认 basic)。

输出 Schema 包含 success(布尔值)、files(文件数组,每项含 path 和 type,type 枚举为 qml、cpp、cmake)、registrationCode(用于注册组件的 C++ 代码)。

生成示例

资料提供了 CustomButton.qml 示例,展示 Control 类型组件,包含属性(text、backgroundColor、textColor、loading、pressed)、信号(clicked、pressAndHold)、尺寸提示、背景、内容项(RowLayout 含 BusyIndicator 与 Text)以及 MouseArea 交互。

C++ 后端集成示例展示 CustomButtonBackend 类,使用 Q_OBJECT、QML_ELEMENT 宏,定义 Q_PROPERTY 属性、信号与槽。

QML 模块结构示例展示 qml/MyComponents/ 目录下的 qmldir 文件及组件文件,以及 CMake 的 qt_add_qml_module 配置。

模型/视图组件示例展示 UserListView.qml,基于 ListView,包含 delegate(ItemDelegate)、contentItem(Row 含 Image 与 Column)、itemSelected 信号及 ScrollBar。

最佳实践

  • 使用属性绑定,避免命令式更新
  • 定义清晰的接口:明确的属性与信号
  • 使用隐式尺寸,让组件自行确定大小
  • 将逻辑与 UI 分离:复杂逻辑使用 C++
  • 遵循命名约定:组件使用 PascalCase
  • 使用 Qt Quick Controls,保持一致的平台外观

适用场景

适用于 Qt/QML 界面开发,包括生成自定义控件、弹窗、视图、委托、单例组件,搭建 QML 模块,以及 QML 与 C++ 后端集成。

限制

资料未提供该技能的收费、价格、平台支持范围、性能效果等具体信息。