6

我必须实现一个图形用户界面设计。选择的框架是 Qt。

在实施了一些工作之后,出现了一些困难和问题。重点是有一些花哨的设计元素,带有渐变、3D 效果、阴影等。

目前使用的方法——我真的不太喜欢——是使用图形设计中的位图作为各种小部件的背景。根据元素的放置和可伸缩性,这有一些非常讨厌的缺点。这种方法会生成一个相当静态的用户界面,难以维护和适应。

我希望它能够在运行时使用尽可能多的 Qt 默认工具动态生成所有图形元素。但我就是不知道如何实现如此复杂的视觉效果。作为示例,您可以假设以下图像。

问题: 一个合理的方法看起来如何得到如下所示的结果。(我不想要确切的解决方案,只想要一些指针、一般方法和最佳实践。)

4

4 回答 4

5

您最好使用自定义小部件并在绘制事件中构建效果。这里有一个例子:显示一个自定义 LED 小部件。这里还有一些关于自定义绘画和在小部件的绘画命令中使用 SVG 图像的幻灯片:http: //saim.pub.ro/ITNQ/L5_Slides_v01.pdf。在绘制命令中使用 SVG 比使用固定的 BMP 图形文件更容易一些,因为您可以使用布局引擎。

于 2014-08-20T14:03:13.487 回答
1

另一个解决方案是使用 Qt 样式表,它允许您自定义小部件。检查示例:Qt 样式表示例 | QtWidgets 5.3 | 文档 | Qt 项目

这是 QPushButton 的样式,它看起来像图像上的按钮一样“相似”。但它可能足以满足您的要求。

background-color: qradialgradient(spread:pad, cx:0.499807, cy:0.489, radius:0.5, fx:0.499, fy:0.488909, stop:0.0795455 rgba(0, 147, 185, 255), stop:1 rgba(30, 30, 30, 255));
border: 5px solid black;
border-radius: 15px;
于 2014-08-20T14:35:09.460 回答
1

Qt 5 提供样式表来自定义 UI 的外观。

具体来说,如果您想在按钮上添加纹理,请查看此示例。它展示了如何使用边框来指定不应拉伸的区域。

于 2014-08-20T14:32:46.187 回答
0

有关如何在 QML 中执行与此类似的操作的详细演练,请参阅此答案。如果您熟悉 QPainter,您可以使用 C++ 将其移植到小部件。

于 2014-08-23T13:07:53.453 回答