Qt Design Studio 2.0发布

约定不等于承诺〃 2022-11-11 03:07 365阅读 0赞

本文翻译自[Qt Design Studio 2.0 released][]（2020年12月18日发表）  
原文作者：Thomas Hartmann  
校审：王富涌

我们很高兴地宣布Qt Design Studio 2.0的发布。

Qt Design Studio是一个UI设计和开发工具，使设计师和开发者能够快速进行原型开发并创造美好的体验。设计师和开发者都使用Qt Design Studio，这使得两者之间的协作更加简单、高效。

您可以观看以下视频新版本有大致了解。有关Qt Design Studio的详细信息，请访问[在线手册][Link 1]。

在Qt Design Studio 2.0中，我们专注于改善用户体验。我们对UI进行了许多改进。最后，可以锁定项目以防止意外更改。我们答复改进了导航器的可用性，增加了旋转工具，并修复了许多小问题。有关更多详细信息，请参阅这篇在[beta版发布时的博文][beta]。

##    Telemetry和Crashpad支持 ##

Qt Design Studio 2.0带有一个基于[Google Crashpad][]的崩溃报告器。

Crashpad是一种用于从应用程序捕获、存储和传输崩溃报告到上游采集服务器的机制。 我们使用[Sentry][]作为后端服务。

默认情况下，[Crashpad][Google Crashpad]不会上传生成的崩溃报告，因为它会从崩溃的Qt Design Studio进程内存中捕获各种内容。因此，转储可能包含机密信息，例如项目名称。因此，我们必须征得同意，并且必须明确启用Crashpad，才能上传生成的崩溃报告。用户还可以与[Qt支持团队][Qt]手动共享本地生成的崩溃报告。

有一个不幸的实际情况，任何大型复杂软件都将包含会导致其偶尔崩溃的bug。这就是背后的逻辑。即使没有bug，驱动程序和不兼容性也会导致Qt Design Studio崩溃。

我们认为自动收集故障转储是解决此问题的最佳方法。它减轻了用户手动报告的负担，同时捕获了崩溃时的硬件和软件状态。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70][]

我们恳请用户启用Crashpad，以帮助我们改善Qt Design Studio的质量和稳定性。

我们还随同Qt Design Studio 2.0发布了Telemetry插件，后者已是Qt Creator安装的可选插件。在默认情况下，Telemetry处于禁用状态，必须由用户显式启用。Telemetry将收集有关您的系统和Qt Design Studio使用情况的匿名信息。不会收集任何个人数据，例如姓名，IP地址，MAC地址或项目和路径名。但用了[QUuid][]标识属于特定用户的数据记录。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 1][]

如果您接受，则所有收集和传输的数据对您都是完全透明的。您可以随时更改用于收集和传输数据的设置。默认情况下，不收集任何数据，您必须选择Telemetry模式才能开始收集数据。详细信息，请[参阅文档][Link 2]。

Telemetry插件使用开源库[KUserFeedback][]。

Telemetry插件的目标是了解更多有关用户如何使用Qt Design Studio的信息。我们跟踪应用程序中特定功能的使用频率和时长。这些数据可以帮助我们改进Qt Design Studio的未来版本。我们能更好了解用户如何使用产品以及特定功能的重要性。

因此，我们恳请用户也启用Telemetry插件，以帮助我们更好地了解用户并提高Qt Design Studio的质量。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 2][]

## 缩略图产生 ##

一个非常有用的功能是为自定义组件生成缩略图。这意味着自定义组件的图标在外观上类似于该组件，并且Qt Design Studio提供了带有完整预览的工具提示。这有助于找到正确的组件，并更方便地获得项目及其结构的概述。这在大型项目中尤其有用。

##    Qt Bridge for Figma技术预览版 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 3][]

Qt Design Studio 2.0附带了Qt Bridge for [Figma][]的技术预览版。Figma是一个界面设计应用程序，着重于团队协作。

Qt Design Studio随附了Qt Bridge for Figma，您可以将这个开发者插件安装到桌面版Figma。必须打开Figma的插件管理器安装该插件，按加号按钮以“创建新插件”。然后，您必须选择Qt Design Studio附带的Manifest.json文件。安装插件后，可以在Figma的Plugin / Development / QtBridge下找到它。Qt Bridge for Figma允许用户将其设计从Figma无缝导入Qt Design Studio。Figma的Qt Bridge的功能集与[Qt Bridge for Sketch][]的功能集非常相似，而且已支持组件。Qt Design Studio还支持[从其他2D和3D图形设计工具导入/导出素材][2D_3D]。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 4][]

正如您在屏幕截图中看到的，已可以将相当复杂文的件从Figma导入到Qt Design Studio。可[点击此处][Link 3]找到有关Qt Bridge for Figma的最新文档。

请注意，Qt Bridge for Figma将所有内容导出到单个存档文件。在将项目导入Qt Design Studio之前，您必须手动解压缩文件。然后，可以导入.metainfo文件。有关如何将2D设计导入Qt Design Studio的详细信息，请参考[这篇文档][Link 4]。

##    重新设计2D效果 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 5][]

我们还在Qt Design Studio 2.0中更改了Qt Design Studio中2D 效果的工作方式。新工作方式与Qt Quick框架更一致，也更加直观。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 6][]

效果不再是Qt Quick Items，也不再继承自项目。相反，效果是它们所影响的项目的子节点。这使得添加模糊、发光或遮罩等效果变得更容易。现在，只需将效果从项目库（Item Library）中拖放到目标项目上即可。

不支持在单个项目上叠加效果。如果用户要应用多个效果，则需要堆叠多个项目，并且每个项目都应用一个效果。

##    逻辑助手 ##

为了无需编写代码即可更轻松地执行某些操作，我们在Qt Design Studio中添加了一些逻辑助手。添加导入后，您可以在项目库中看到这些元素。这些项目只能拖动到导航器中，因为它们不是可见项目。逻辑助手使设置双向绑定变得容易，以及方便把数字映射到字符串并保持特定精度。

![20210319102746109.png][]

实际上，这意味着Qt Design Studio 2.0现在提供了方便的构造块，可以取代偶尔使用的JavaScript表达式条件或将数字正确地转换为字符串。现在，用户不必在绑定编辑器中编写JavaScript代码，只需使用这些构件即可。

逻辑助手还允许定义条件，而无需编写JavaScript代码，比如可以实现将Timeline的范围映射到表盘的自定义区间的操作。

## MCU支持 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 7][]

Qt for MCUs 1.6已发布，并且Qt Design Studio支持创建仅限于[Qt for MCUs][]功能集的项目。如果用户使用正确向导创建了一个[Qt for MCUs][]项目，则不适用Qt for MCUs的功能也将在UI中被禁用。这包括许多导入，与Qt Quick 3D相关的所有内容，而且属性编辑器中的许多属性都将被禁用。

因此在开发Qt for MCUs项目时，可以充分利用Qt Design Studio。您可以在[这里][Link 5]找到我们为洗衣机开发的UI。这个Demo展示了如何利用Qt Design Studio开发运行Qt for MCUs的应用程序。这个洗衣机Demo也展示了应用程序可以同时在Qt for MCUs上和常规的Qt上运行。该Demo开发中使用了所有平台都支持的QML和Qt Quick子集。

##    实验性Qt 6支持 ##

Qt Design Studio 2.0还提供了对[Qt 6][]的实验性支持。虽然使用Qt Design Studio开发基于Qt Quick的项目也可以使用Qt 6，但是Qt Quick 3D方面还是有一些区别。

由于组件的实际渲染和实例化是在外部进程（qml2puppet）中完成的，因此可以使用Qt 6构建此进程以实现完全兼容性。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 8][]

要使其正常工作，您必须安装Qt 6并在Qt Design Studio中创建一个[Kit][]。现在，您必须启用Use QML 模拟层，它是用选项中选定的Qt构建的。如果选择Qt 6套件，则Qt Design Studio将基于Qt 6构建一个qml2puppet 。然后，基于Qt 6进行渲染和QML仿真。

请记住，这仅适用于高级用户，他们关心Qt 5和Qt 6在Qt Quick 3D中的某些差异。如果开发2D Qt Quick应用程序， Qt 5和Qt 6则是完全兼容的。

##    高端IVI Demo ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 9][]

在Qt Design Studio 2.0的开发过程中，我们还开发了一个高端IVI Demo。

该Demo可从我们的[GitLabs服务器][GitLabs]上获得。 该Demo实质上实现了IVI系统，并展示了Qt Quick和Qt Quick 3D的许多功能。

如果下载该Demo代码，您还可以访问原始素材，以清楚地了解该Demo的设计和开发方式。  
该Demo演示如何使用自定义着色器实现高级效果，以及如何将3D内容与2D内容集成在一起。

该Demo的开发仍在进行中，并会持续更新。

##    入门 ##

Qt Design Studio 2.0可以通过商业许可获得，也可以通过[在线安装程序][Link 6]以及您的[Qt帐户][Qt 1]获取免费的社区版本。Photoshop和Sketch Bridge包含在Qt for Design Studio商业版中，但也可以通过[Marketplace][]单独购买，并与GPL / LGPL项目的社区版本一起使用。

在线安装程序中的 *Tools > Qt Design Studio 2.0* 下提供了Qt Design Studio 2.0商业版。

您可以在[此处][Link 1]找到有关Qt Design Studio 2.0的最新在线文档。也可以从Qt Design Studio本地程序获得该文档。

您也可以在[这里][Link 7]找到Qt Design Studio的视频教程。

请在我们的[bug tracker][Link 7]中发布您发现的问题或建议，并在[问卷][Link 8]中留下反馈。

[Qt Design Studio 2.0 released]: https://www.qt.io/blog/qt-design-studio-2.0-released
[Link 1]: https://doc-snapshots.qt.io/qtdesignstudio-4.14/index.html
[beta]: https://www.qt.io/blog/qt-design-studio-2.0-beta-released
[Google Crashpad]: https://chromium.googlesource.com/crashpad/crashpad/+/master/doc/overview_design.md
[Sentry]: https://sentry.io/security/
[Qt]: https://www.qt.io/zh-cn/contact-us/services-quote-request
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70]: /images/20221022/e2ada81790914f5f9d7d4e2244fd59c9.png
[QUuid]: https://doc.qt.io/qt-5/quuid.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 1]: /images/20221022/2948fd40cae64dab8ac12ace246f1321.png
[Link 2]: https://doc.qt.io/qtcreator/creator-telemetry.html
[KUserFeedback]: https://api.kde.org/frameworks/kuserfeedback/html/index.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210319102023382.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20210319102125486.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[Figma]: https://www.figma.com
[Qt Bridge for Sketch]: https://doc.qt.io/qtdesignstudio/qtbridge-sketch-using.html
[2D_3D]: https://doc.qt.io/qtdesignstudio/qtbridge-overview.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 4]: https://img-blog.csdnimg.cn/20210319102340662.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[Link 3]: https://doc-snapshots.qt.io/qtdesignstudio/figmaqtbridge.html
[Link 4]: https://doc.qt.io/qtdesignstudio/studio-importing-2d.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 5]: https://img-blog.csdnimg.cn/20210319102523387.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 6]: https://img-blog.csdnimg.cn/20210319102553929.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[20210319102746109.png]: https://img-blog.csdnimg.cn/20210319102746109.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 7]: https://img-blog.csdnimg.cn/20210319102837174.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[Qt for MCUs]: https://www.qt.io/zh-cn/product/develop-software-microcontrollers-mcu
[Link 5]: https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/playground/washingMachineUI
[Qt 6]: https://qt-china.blog.csdn.net/article/details/111034861
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 8]: https://img-blog.csdnimg.cn/20210319111954321.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[Kit]: https://doc.qt.io/qtcreator/creator-targets.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h_size_16_color_FFFFFF_t_70 9]: https://img-blog.csdnimg.cn/20210319112126598.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F0X0NoaW5h,size_16,color_FFFFFF,t_70
[GitLabs]: https://git.qt.io/public-demos/qtdesign-studio/-/tree/master/playground/highendivisystem
[Link 6]: https://www.qt.io/zh-cn/download
[Qt 1]: https://account.qt.io/licenses
[Marketplace]: https://marketplace.qt.io/products/qt-design-studio-bridge
[Link 7]: https://www.bilibili.com/video/BV1Bt41187dn
[Link 8]: https://www.surveymonkey.com/r/design-studio-feedback