Qt Design Studio 2.3有什么新功能(翻译)

What's new with Qt Design Studio 2.3

Qt Design Studio 2.3有什么新功能

Wednesday December 08, 2021 by Thomas Hartmann | Comments

2021年12月8日星期三 Thomas Hartmann|评论

Qt Design Studio 2.3 will be released this year.

Qt Design Studio 2.3将于今年发布。

Qt Design Studio is a UI design and development tool that enables designers and developers to rapidly prototype and develop complex UIs. The next version Qt Design Studio 2.3 will be released this year and you can already check out the beta version of Qt Design Studio 2.3 using the online installer. In this blog post, we want to show some of the new features introduced in Qt Design Studio 2.3.

Qt Design Studio是一个UI设计和开发工具，它使设计人员和开发人员能够快制作发原型和开发复杂的UI。下一个版本Qt Design Studio 2.3将在今年发布，你已经可以通过在线安装程序查看Qt Design Studio 2.3的测试版。在这篇博文中，将展示Qt Design Studio 2.3中引入的一些新特性。

For detailed information about Qt Design Studio, visit the online documentation page.

有关Qt Design Studio的详细信息，请访问在线文档页面。

Particle Editor

粒子编辑器

The 3d Editor got new features for particle editing. Particle Systems can now be visualized in the 3D Editor and they can also be animated. This way you do not have to rely only on the Live Preview with a fixed camera, but you can use the 3D Editor to inspect the animated Particle System. This makes it easier to create complex Particel Systems and align them with the rest of the 3D scene.

3d编辑器添加了粒子编辑的新功能。粒子系统现在可以在3D编辑器中可视化显示，也可以动起来。这样就不需要，只依靠特定摄像机的实时预览，你可以使用3D编辑器来查看粒子系统动画效果。这使得创建复杂的粒子系统更容易，也方便将它们与3D场景的其他部分对齐。

Adobe XD Qt Bridge

With Qt Design Studio 2.3 comes a new Qt Bridge with support for Adobe XD. Adobe XD is the answer to Figma from Adobe and it is now also supported.  As expected the Qt Bridge for Adobe XD  allows users to seamlessly import their designs to Qt Design Studio and the feature set is similar to other Qt Bridges.

Qt Design Studio 2.3带来了一个新的Qt Bridge，它支持Adobe XD。Adobe XD是来自Adobe的Figma的解决方案，它现在也得到了支持。正如预期的那样，Adobe XD的Qt Bridge允许用户无缝地将他们的设计导入Qt Design Studio，其功能集与其他Qt Bridge类似。

The latest documentation for the Qt Bridge for Adobe XD can be found here. As you can see in the screenshots designs from Adobe XD can be imported to Qt Design Studio. To install the Qt Bridge for Adobe XD plugin to Adobe XD, double-click qtbridge.xdx in the xd_bridge folder in the installation directory of Qt Design Studio. Adobe XD will then automatically install Qt Bridge for Adobe XD.

在这里可以找到用于adobexd的Qt Bridge的最新文档。正如你在截图中看到的那样，Adobe XD的设计可以导入到Qt Design Studio中。要将adobexd插件的Qt Bridge安装到adobexd，请双击qtbridge。xdx在Qt Design Studio安装目录下的“xd_bridge”文件夹中。adobexd会自动为Adobe XD安装Qt Bridge。
Please refer to the Qt Design Studio documentation for details on how to import 2D designs into Qt Design Studio.

有关如何将2D设计导入Qt Design Studio的详细信息，请参阅Qt Design Studio文档。

Translations View

翻译视图

Qt Design Studio 2.3 has a new Translation View to manage translations. This view allows you to edit/import and export translations for a project. For now, we support JSON for import and export, but we consider other file formats in the future.  The Translation View can generate the .qm and .ts files for your project and you can check for missing translations and eliding strings. The QML translation test will run each screen for each defined language and test if all strings are translated and not eliding. The test will create a report, but you can also check the results using the form editor.

Qt Design Studio 2.3有一个新的翻译视图来管理翻译。这个视图允许你编辑/导入或导出一个项目的翻译。目前，我们支持JSON格式导入和导出，但我们考虑在将来增加其他文件格式支持。翻译视图可以为你的项目生成.qm和.ts文件，并检查缺少的翻译或省略字符串。QML翻译测试将为每个定义的语言进行检查，并测试是否所有字符串都被翻译而没有省略。测试将产生一个报告，但是也可以使用表单编辑器检查结果。

As you can see in the screenshot elided strings are highlighted in purple and missing translations in red. You can check out this example project to try this feature out.  Before the translations show up in Qt Design Studio you have to import the translations from a JSON file that is part of the project. Note that for now, the translation view requires the user to use qsTrId().

正如你在截图中看到的，被省略的字符串用紫色高亮显示，而缺失的翻译用红色显示。可以使用这个示例项目来测试这个特性。在Qt Design Studio中显示翻译前，必须在项目中导入JSON翻译文件。注意，目前翻译视图要求用户在代码中使用qsTrId()。

Animations in Timeline

时间轴动画

The Timeline View now also has the capability to playback the current timeline. This feature allows playing back the animation at lower or higher speed and also looping.  

时间轴视图现在具有回放当前时间轴的功能。这个功能允许以较低或较高的速度回放动画，也允许循环播放。

While previewing animation is already possible in the Live Preview, the play button in the timeline can be more flexible because you can control the speed and only a single timeline is animated. When using the play button from the timeline the indicator for the current keyframe is also animated, this can be used to easily spot keyframes that influence the timeline in an unexpected way.

虽然在Live Preview中已经可以预览动画，但时间轴中的播放按钮更灵活，因为可以控制速度，或只有一个时间轴的动画。当从时间轴上使用播放按钮时，当前关键帧的指示器也会动画化，这可以用来轻松地发现意料之外的关键帧错误。

Repeater and Components

重复器和组件

In Qt Design Studio 2.3 it is now possible to use Components, Loaders, and Repeaters directly from the UI. This makes it possible to populate Loaders and Repeaters with Components, without having to write QML code.

在Qt Design Studio 2.3中，现在可以直接从UI中使用组件、加载器和重复器。这使得无需编写QML代码,直接使用加载器和重复器，就可以实现加载组件。

You can create new Components by dragging a Component from the Library View onto the Navigator View. In the same way, you can also create Loaders and Repeaters. The Loader or Repeater can then be assigned a component.

可以通过将组件从库视图拖动到导航器视图来创建新的组件。同样的方法，也可以创建加载器和重复器。然后可以给加载器或重复器分配一个组件。

Repeaters are extremely useful to prototype or define lists or grids of dynamic data provided by models.

重复器是很有用的，如原型制作或定义列表或网格布局。

For 3D scenes, the user can use Repeater3D and Loader3D.

对于3D场景，用户可以使用Repeater3D和Loader3D。

Android Preview

安卓界面预览

With Qt Design Studio 2.3 it will also be possible to install a QML viewer app on Android. You can find the source code for the Qt Design Viewer here. This viewer allows previewing your Qt Design Studio project directly on Android, if the viewer application is installed.

在Qt Design Studio 2.3中，也可以在Android上安装QML应用程序查看器。你可以在这里找到Qt设计查看器的源代码。如果查看器应用程序已经安装,查看器允许直接预览Android加载的Qt Design Studio项目。

New Project structure

新项目结构

New projects in Qt Design Studio 2.3 now have a different structure and come with the boilerplate code for a working 6 application that uses CMake. Therefore the projects can be opened and built with Qt Creator.

Qt Design Studio 2.3中的新项目现在有了不同的结构，并为使用CMake的工作应用程序提供了样板代码。因此，项目可以使用Qt Creator打开和构建。

If you add or remove QML files you have to regenerate the CMakeLists.txt that define the QML part of the application. This can be done automatically in Qt Design Studio. Please note that Qt Design Studio continues to use Qml Project, while Qt Creator uses a  Cmake Project.

如果添加或删除QML文件，必须重新生成CMakeLists.txt中定义应用程序QML的部分。这可以在Qt Design Studio中自动完成。请注意，Qt Design Studio继续使用Qml项目，即便使用Qt Creator创建了Cmake项目。

This new feature makes it easy to share your Qt Design Studio project as a fully working C++ application with the developer.

这个新特性使可以轻松共享个人的Qt Design Studio项目，到开发者的c++项目。

Please refer to this example if you want to check out a larger project that already uses this structure.

如果想查看已经使用此结构的大型项目，请参考此示例。

These changes make it easier to use Qt Design Studio together with Qt Creator on the same project structure.

这些变化使得在相同的项目结构中使用Qt Design Studio和Qt Creator更加容易。

New MCU Thermostat example

新的单片机恒温器实例

To help users to get started with Qt for MCU, we ported one of the existing Qt for MCU examples and made it compatible with Qt Design Studio. You can find this example here. The example works with Qt Design Studio but is also a fully working Qt for MCU example.

为了帮助用户开始使用Qt for MCU，我们移植了一个现有的Qt for MCU示例，并使其与Qt Design Studio兼容。可以在这里找到这个示例。该示例与Qt Design Studio一起工作，也是一个完全工作的Qt for MCU的示例。

UX Improvements

用户体验改进

As with the last releases we also did many improvements to the user experience.
We re-implemented and improved the UI for the projects wizards. The new UI is now also implemented in QML and is generally more user-friendly. For example, you do not have to explicitly start a wizard anymore to see the settings a wizard provides. The wizards will also get new features in subsequent versions.

和上一个版本一样，我们也对用户体验做了很多改进。我们重新实现并改进了项目向导UI。新的UI现在也使用QML实现，并且更加通用友好。例如，您不必再显式地启动向导，来查看向导提供的设置。向导还将在后续版本中获得新特性。

Getting Started

入门指南

The  Qt Design Studio 2.3 RC1 is available under Preview > Qt Design Studio 2.3-rc1 in the online installer. 

Qt Design Studio 2.3 RC1可以在在线安装程序Preview > Qt Design Studio 2.3-rc1中找到。

You can find the latest online documentation for Qt Design Studio 2.3 here. The documentation is also available from inside Qt Design Studio.

你可以在这里找到Qt Design Studio 2.3的最新在线文档。也可以从Qt Design Studio内找到该文档。

For Qt Design Studio we created tutorials as part of the documentation.

对于Qt Design Studio，我们创建了教程作为文档的一部分。

The welcome page of Qt Design Studio contains examples and links to video tutorials to help you get started.

Qt Design Studio的欢迎页面包含示例和视频教程的链接，以帮助您入门。

Please post issues you find or suggestions you have in our bug tracker.

Qt Design Studio的欢迎页面包含示例和视频教程的链接，以帮助您入门。