C++ 手工编码 GUI 与 Qt 设计器 GUI

Hand Coded GUI Versus Qt Designer GUI

提问by Ankur Sethi

I'm spending these holidays learning to write Qt applications. I was reading about Qt Designer just a few hours ago, which made me wonder : what do people writing real world applications in Qt use to design their GUIs? In fact, how do people design GUIs in general?

我利用这些假期学习编写 Qt 应用程序。几个小时前，我正在阅读有关 Qt Designer 的文章，这让我想知道：在 Qt 中编写真实世界应用程序的人使用什么来设计他们的 GUI？事实上，人们一般是如何设计 GUI 的？

I, for one, found that writing the code by hand was conceptually simpler than using Qt Designer, although for complex GUIs Designer might make sense. Large GUIs might be possible using Designer, but with time they might become very difficult to manage as complexity increases (this is just my opinion). I also downloaded the AmaroK source code to take a peek at what those guys were doing, and found many calls to addWidget() and friends, but none of those XML files created by Designer (aside: AmaroK has to be my favorite application ever on any platform).

一方面，我发现手工编写代码在概念上比使用 Qt Designer 更简单，尽管对于复杂的 GUI，Designer 可能更有意义。使用 Designer 可能可以实现大型 GUI，但随着时间的推移，随着复杂性的增加，它们可能变得非常难以管理（这只是我的意见）。我还下载了 AmaroK 源代码来看看那些人在做什么，并发现了许多对 addWidget() 和朋友的调用，但没有一个由 Designer 创建的 XML 文件（除此之外：AmaroK 必须是我最喜欢的应用程序）任何平台）。

What, then, is the "right" way to create a GUI? Designer or code? Let us, for this discussion, consider the following types of GUIs :

那么，创建 GUI 的“正确”方法是什么？设计师还是代码？让我们在本次讨论中考虑以下类型的 GUI：

1. Simple dialogs that just need to take input, show some result and exit. Let's assume an application that takes a YouTube URL and downloads the video to the user's hard disk. The sort of applications a newbie is likely to start out with.
2. Intermediate level GUIs like, say, a sticky notes editor with a few toolbar/menu items. Let's take xPad for example (http://getxpad.com/). I'd say most applications falling in the category of "utilities".
3. Very complex GUIs, like AmaroK or OpenOffice. You know 'em when you see 'em because they make your eyes bleed.

1. 只需要输入、显示一些结果并退出的简单对话框。让我们假设一个应用程序使用 YouTube URL 并将视频下载到用户的硬盘上。新手可能开始使用的应用程序类型。
2. 中级 GUI，例如带有一些工具栏/菜单项的便签编辑器。让我们以 xPad 为例（http://getxpad.com/）。我会说大多数应用程序都属于“实用程序”类别。
3. 非常复杂的 GUI，如 AmaroK 或 OpenOffice。当您看到它们时，您就知道它们，因为它们使您的眼睛流血。

采纳答案by Michael Bishop

Our experience with Designer started in Qt3.

我们使用 Designer 的经验始于 Qt3。

Qt3

Qt3

At that point, Designer was useful mainly to generate code that you would then compile into your application. We started using for that purpose but with all generated code, once you edit it, you can no longer go back and regenerate it without losing your edits. We ended up just taking the generated code and doing everything by hand henceforth.

那时，Designer 主要用于生成代码，然后将其编译到您的应用程序中。我们开始为此目的使用，但是对于所有生成的代码，一旦您编辑它，您就无法再返回并重新生成它而不会丢失您的编辑。我们最终只使用生成的代码并从此手工完成所有工作。

Qt4

Qt4

Qt4 has improved on Designer significantly. No longer does it only generate code, but you can dynamically load in your Designer files (in xml) and dynamically connect them to the running objects in your program-- no generated code however, you do have to name the items in Designer and stick with the names to not break your code.

Qt4 在 Designer 上有了显着的改进。它不再只生成代码，但您可以动态加载您的 Designer 文件（在 xml 中）并将它们动态连接到程序中运行的对象——但是没有生成代码，您必须在 Designer 中命名项目并粘贴名称不会破坏您的代码。

My assessment is that it's nowhere near as useful as Interface Builder on Mac OS X, but at this point, I could see using the Designer files directly in a program.

我的评估是它远不如 Mac OS X 上的 Interface Builder 有用，但在这一点上，我可以看到直接在程序中使用 Designer 文件。

We haven't moved back to Designer since Qt3, but still use it to prototype, and debug layouts.

从 Qt3 开始，我们就没有再使用 Designer，但仍然使用它来进行原型设计和调试布局。

For your problems:

对于您的问题：

1. You could probably get away with using the standard dialogs that Qt offers. QInputDialogor if you subclass QDialog, make sure to use QButtonDialogBoxto make sure your buttons have the proper platform-layout.

2. You could probably do something more limited like xPad with limited Designer functionality.

3. I wouldn't think you could write something like OpenOffice solely with Designer but maybe that's not the point.

1. 您可能可以使用 Qt 提供的标准对话框。 QInputDialog或者如果您继承QDialog，请确保使用QButtonDialogBox来确保您的按钮具有正确的平台布局。

2. 您可能可以使用有限的 Designer 功能来做一些更有限的事情，例如 xPad。

3. 我不认为你可以单独用 Designer 编写像 OpenOffice 这样的东西，但也许这不是重点。

I'd use Designer as another tool, just like your text editor. Once you find the limitations, try a different tool for that new problem. I totally agree with Steve S that one advantage of Designer is that someone else who's not a programmer can do the layout.

我会使用 Designer 作为另一种工具，就像您的文本编辑器一样。找到限制后，请尝试使用不同的工具来解决新问题。我完全同意 Steve S 的观点，Designer 的一个优点是其他不是程序员的人也可以进行布局。

回答by Steve S

In my experience with Qt Designer and other toolkits/UI-tools:

根据我使用 Qt Designer 和其他工具包/UI 工具的经验：

• UI tools speed up the work.
• UI tools make it easier to tweak the layout later.
• UI tools make it easier/possible for non-programmers to work on the UI design.

• UI 工具可加快工作速度。
• UI 工具使以后调整布局变得更容易。
• UI 工具使非程序员更容易/可能从事 UI 设计。

Complexity can often be dealt with in a UI tool by breaking the design into multiple UI files. Include small logical groups of components in each file and treat each group as a single widget that is used to build the complete UI. Qt Designer's concept of promoted widgets can help with this.

通过将设计分解为多个 UI 文件，通常可以在 UI 工具中处理复杂性。在每个文件中包含小的逻辑组件组，并将每个组视为用于构建完整 UI 的单个小部件。Qt Designer 的升级小部件概念可以帮助解决这个问题。

I haven't found that the scale of the project makes any difference. Your experience may vary.

我没有发现项目的规模有什么不同。您的体验可能会有所不同。

The files created with UI tools (I guess you could write them by hand if you really wanted to) can often be dynamically loaded at run-time (Qt and GTK+ both provide this feature). This means that you can make layout changes and test them without recompiling.

使用 UI 工具创建的文件（我想如果您真的愿意，可以手动编写它们）通常可以在运行时动态加载（Qt 和 GTK+ 都提供此功能）。这意味着您无需重新编译即可更改布局并对其进行测试。

Ultimately, I think both raw code and UI tools can be effective. It probably depends a lot on the environment, the toolkit/UI-tool, and of course personal preference. I like UI tools because they get me up and running fast and allow easy changes later.

最终，我认为原始代码和 UI 工具都是有效的。这可能在很大程度上取决于环境、工具包/UI 工具，当然还有个人喜好。我喜欢 UI 工具，因为它们能让我快速启动和运行，并允许以后轻松更改。

回答by andreas buykx

The organisation I work for has ported its GUI application to Qt several years ago. I think there are several aspects that are worth mentioning:

几年前，我工作的组织已将其 GUI 应用程序移植到 Qt。我认为有几个方面值得一提：

• Working with Qt Designer, at least at that point, was not a realistic option: there were too many features that couldn't be done with Qt Designer;
• Conventions and structure that had to be preserved prevented the use of Qt Designer;
• Once you've started without Designer, it is probably difficult to return to it;
• the most important aspect, though, was that the programmers were very much used to programming using vi or emacs, rather than using a GUI IDE.

• 至少在那个时候，使用 Qt Designer 并不是一个现实的选择：有太多的功能是 Qt Designer 无法完成的；
• 必须保留的约定和结构阻止了 Qt Designer 的使用；
• 一旦开始没有 Designer，可能很难再回到它；
• 然而，最重要的方面是程序员非常习惯使用 vi 或 emacs 进行编程，而不是使用 GUI IDE。

My own experience, which goes back approx. 4 years, using Qt3.3, is that dynamic behavior in dialogs was not possible to realise in Designer.

我自己的经验，可以追溯到大约。4 年来，使用 Qt3.3，对话框中的动态行为在 Designer 中无法实现。

回答by Sam Dutton

Just to say I've written and maintained complex GUIs in Qt without using Qt Designer -- not because I don't like Qt Designer, but because I never got around to working that way.

只是说我在没有使用 Qt Designer 的情况下在 Qt 中编写和维护了复杂的 GUI —— 不是因为我不喜欢 Qt Designer，而是因为我从来没有时间以这种方式工作。

It's partly a matter of style and where you're coming from: when I started on Qt, I'd had horrible experiences of Dreamweaver and Frontpage and other visual HTML tools,and far preferred writing code with HomeSite and resorting to Photoshop for tricky layout problems.

这部分是风格和你来自哪里的问题：当我开始使用 Qt 时，我对 Dreamweaver、Frontpage 和其他可视化 HTML 工具有过糟糕的体验，更喜欢用 HomeSite 编写代码并求助于 Photoshop 进行棘手的布局问题。

There's a danger with visual code IDEs that you try to keep within the visual tools, but end up having to tweak code as well -- in ways that aren't well understood.

您试图将可视化代码 IDE 保留在可视化工具中存在危险，但最终也不得不调整代码 —— 以不太容易理解的方式。

Learning iPhone development, for example, I've found it frustrating to hit 'magic' visual stuff ('drag from the empty circle in the Connections inspector to the object in the Interface Builder window...') that would be simpler (for me) to understand in plain old code.

例如，在学习 iPhone 开发时，我发现遇到“神奇”的视觉内容（“从连接检查器中的空白圆圈拖动到界面生成器窗口中的对象...”）很令人沮丧，因为它会更简单（对于我）用普通的旧代码来理解。

Good luck with Qt -- it's a great toolkit, however you use it, and Qt Creator looks like being a great IDE.

祝 Qt 好运——它是一个很棒的工具包，无论您如何使用它，Qt Creator 看起来都是一个很棒的 IDE。

回答by Blaisorblade

I'd add that one of the reasons for using graphical designer was the lack of layout managers in Win32, for instance. Only absolute positioning was possible, and doing that by hand would have just sucked.

我想补充一点，例如，使用图形设计器的原因之一是 Win32 中缺少布局管理器。只有绝对定位是可能的，而手动这样做会很糟糕。

Since I switched from Delphi to Java for GUI apps (back in 2002), I've never used designers any more. I like layout managers much more. And yeah, you get boilerplate code, but moving objects on a UI designer may take as much time as changing the boilerplate. Plus, I would be stuck with a slow IDE; that's for the Java/C# case, OK, while for Qt (especially Qt4) it doesn't apply. For Qt3, I wonder why one should edit the generated code - wasn't it possible to add code in other files? For which reason?

自从我在 GUI 应用程序中从 Delphi 切换到 Java（早在 2002 年）之后，我就再也没有使用过设计器了。我更喜欢布局管理器。是的，您会获得样板代码，但是在 UI 设计器上移动对象可能需要与更改样板一样多的时间。另外，我会被一个缓慢的 IDE 困住；那是针对 Java/C# 的情况，好的，而对于 Qt（尤其是 Qt4）则不适用。对于 Qt3，我想知道为什么要编辑生成的代码 - 是否可以在其他文件中添加代码？出于什么原因？

About the discussed cases: 1) Hand Coded GUI is likely faster to write, at least if you know your libraries. If you're a newbie and you don't know them, you may save time and learn less with a designer, since you don't need to learn the APIs you use. But "learn less" is the key factor, so in both cases I'd say Hand Coded GUI.

关于所讨论的案例：1) 手工编码的 GUI 可能编写得更快，至少如果您了解您的库。如果您是新手并且不了解他们，您可以节省时间并减少与设计师的学习，因为您不需要学习您使用的 API。但“少学”是关键因素，所以在这两种情况下，我都会说手工编码的 GUI。

2) Menu bars are quite annoying to write code for. Also, think to details like accelerators and so on. Still, it depends on what you're used to. After some time, it may be faster to type that boilerplate than to point-and-click into designer to fix all those properties, but just if you can really type like into a typewriter (like those admins for which typing Unix commands is faster than using any GUI).

2) 为菜单栏编写代码很烦人。另外，考虑加速器等细节。不过，这取决于你习惯了什么。一段时间后，输入样板可能比点击设计器来修复所有这些属性要快，但前提是你真的可以像打字机一样输入（就像那些管理员输入 Unix 命令比使用任何图形用户界面）。

3) I'd extend the answer for case #2 to this one. Note that, for Win32 platforms, it may be possible that using designers which generate Win32 resources might befaster to load (no idea about that).

3）我会将案例＃2的答案扩展到这一点。请注意，对于 Win32 平台，使用生成 Win32 资源的设计器可能加载速度更快（对此一无所知）。

However, I'd like to mention a potential problem with using Qt Designer there. Real world case: it took some seconds (say 10) to load a complex Java dialog (the Preferences dialog box for a programmer's text editor) with a lot of options. The correct fix would have been to load each of the tabs only when the programmer wanted to see them (I realized that after), by adding a separate method to each preference set to build its GUI.

但是，我想提一下在那里使用 Qt Designer 的潜在问题。真实案例：加载一个复杂的 Java 对话框（程序员文本编辑器的首选项对话框）需要几秒钟（比如 10 秒），其中包含很多选项。正确的解决方法是仅在程序员想要查看它们时才加载每个选项卡（我后来意识到这一点），通过向每个首选项集添加一个单独的方法来构建其 GUI。

If you design all the tabs and the tab switcher together with a designer, can you do that as easily? I guess there might be a similar example where a hand coded GUI gives you more flexibility, and in such a big app, you're likely to need that, even if just for optimization purposes.

如果您与设计师一起设计所有选项卡和选项卡切换器，您能轻松做到吗？我想可能有一个类似的例子，其中手工编码的 GUI 为您提供了更大的灵活性，并且在如此大的应用程序中，您可能需要它，即使只是出于优化目的。

回答by Nejat

One of the main benefits of using designer to create GUIs is that other programmers can change or maintain forms and widgets easily without the need to delve in to a complex code.

使用设计器创建 GUI 的主要好处之一是其他程序员可以轻松更改或维护表单和小部件，而无需深入研究复杂的代码。

回答by shoosh

Its strange that you're saying the writing code is simpler than manipulating objects in a graphical environment. It's a no-brainer.
The designer is there to make your life easier and in the long term it makes your code more maintainable. It's easier looking in the designer to see what the your UI looks like then reading the code and trying to imagine what it might look like.
With current Qt you can do almost everything from within the designer and the very few things you can't do, you can fix with very few lines of code in the constructor. Take for instance the simplest example - adding a signal-slot connection. Using the designer it's as simple as a double click. Without the designer you need to go lookup the correct signature of the signal, edit the .h file and then edit write your code in the .cpp file. The designer allows you to be above these details and focus on what really matters - the functionality of your application.

奇怪的是，您说编写代码比在图形环境中操作对象更简单。这是一个没有脑子。
设计师的存在是为了让您的生活更轻松，从长远来看，它使您的代码更易于维护。在设计器中查看您的 UI 是什么样子会更容易，然后阅读代码并尝试想象它可能是什么样子。
使用当前的 Qt，您几乎可以在设计器中完成所有事情，而您无法完成的事情很少，您可以在构造函数中使用很少的代码行进行修复。举个最简单的例子——添加一个信号槽连接。使用设计器就像双击一样简单。如果没有设计器，您需要查找信号的正确签名，编辑 .h 文件，然后编辑在 .cpp 文件中编写代码。设计器允许您超越这些细节并专注于真正重要的事情 - 应用程序的功能。

回答by Mark Beckwith

I like to first turn to the designer to develop GUI widgets. As mentioned in the other posts, its faster. You also get immediate feedback to see if it "looks right" and isn't confusing to the user. The designer is a major reason I choose Qt over other toolkits. I mostly use the designer to make the one-off dialogs.

我喜欢先求助于设计师来开发 GUI 小部件。正如其他帖子中提到的，它更快。您还可以立即获得反馈，看看它是否“看起来正确”并且不会让用户感到困惑。设计师是我选择 Qt 而不是其他工具包的一个主要原因。我主要使用设计器来制作一次性对话框。

Having said that, I do the main window and any complex widgets by hand. I think this is the way Trolltech intended. QFormLayoutis a class they provide to easily programatically create an input dialog.

话虽如此，我还是手工制作了主窗口和任何复杂的小部件。我认为这就是奇趣科技的意图。 QFormLayout是他们提供的一个类，用于轻松地以编程方式创建输入对话框。

By the way, the designer in Qt 4 is not an IDE like the one they had in Qt 3. It's just an editor for editing .ui files. I like it that way. The new cross platform IDE is going to be called Qt Creator.

顺便说一句，Qt 4 中的设计器不像 Qt 3 中的那样是一个 IDE。它只是一个用于编辑 .ui 文件的编辑器。我喜欢这样。新的跨平台 IDE 将被称为 Qt Creator。

回答by s5s

It's an old post but I would advise you to look at Clementine - a music player which (I think) derives from Amarok. They use Qt4 and from what I can see there is a uifolder in the srcfolder of the project. In the uifolder as one might expect they have all sorts of .ui files. If you compile and start Clementine you will see that the GUI is fairly complex and quite nice.

这是一个旧帖子，但我建议您查看 Clementine -（我认为）源自 Amarok 的音乐播放器。他们使用 Qt4，从我可以看到的项目的src文件夹中有一个ui文件夹。在ui文件夹中，正如人们所期望的那样，他们有各种 .ui 文件。如果您编译并启动 Clementine，您将看到 GUI 相当复杂且非常漂亮。

回答by Ben

For me, it depends how much logicis encapsulated in the widget/GUI. If it's just about simple forms, I prefer to use QtDesigner.

对我来说，这取决于小部件/GUI 中封装了多少逻辑。如果只是简单的表单，我更喜欢使用 QtDesigner。

If it contains complex checks or interaction, I tend to program it.

如果它包含复杂的检查或交互，我倾向于对其进行编程。