一、QTC和QDS工作流概述
很多初学者对 QDS(Qt Design Studio) 和 QTC(Qt Creator)如何配合经常存有疑问,本文介绍具体的工作流程。
工作流程
1.产品设计:通过PS、Figma、XD等专业工具设计页面视觉和原型。
2.QDS 原型制作:导入设计源文件、制作控件、页面和原型设计,并且定义所须的后端接口。
3.QTC 后端实现:平替QDS声明的后端接口,用代码实现实际的逻辑。
人员职责
- 设计人员:
- 使用QDS导入素材,生成前端QML页面。
- 提交后端接口需求,经确认声明所需的后端属性。
- 页面绑定后端接口,完成原型,并且可演示原型效果。
- 导出 CMakeLists
- 开发人员:
- 打开工程,根据沟通的后端属性进行逻辑实现。
- 发布安装包,测试运行。
如下图蓝色部分是QDS负责完成,绿色部分是QTC负责完成。设计师完成前端UI和后端的接口定义。工程师则只需要集成前端UI并实现真实的逻辑后端即可。两者接口一致。
二、产品设计
使用三方的设计工具设计软件视觉效果。
三、QDS原型制作
通过QDS提供的Bridge插件,导入素材,直接生成QML代码。工程结构如下:
进一步制作页面原型,做好每个页面。并且自定义一个Backend模块,用来模拟后端提供的接口。里面声明好依赖的属性。这个模块为了支持原型演示,因为没有真实的逻辑。
使用后端提供的属性。
四、QTC后端实现
点击 QDS的导出 CMake文件,生成CMake后,使用QTC打开工程。
开发 Backend模块,根据前端指定的接口,进行实现。最终用真实的逻辑代码完成接口实现。最终完成Backend模块平替。这是包含真实逻辑的后端模块,在程序运行的时候会真正的加载此模块。
五、QDS常见问题
QDS点击工程运行,没有任何反应?
通常是qml中引入了不存在的模块或找不到的模块。点击View->Views->Output。打开输出窗口。然后再点击VIew->Output->应用程序输出。观察输出日志,检查运行时的错误。
QDS版本选择?
QDS不同版本内置的Qt版本不同,而且不能随意添加Qt kits版本。所以要根据开发者使用的Qt版本来确定应该使用的QDS版本。否则QDS里Qt的版本过高,导致开发者的环境不支持。比如开发工程师选了Qt 5.15.15开发,而设计师用的QDS带的Qt版本是6.5。