如何创建自定义小部件并在 Qt Designer 中使用它？

Posted 2023-02-14

【中文标题】如何创建自定义小部件并在 Qt Designer 中使用它？

【英文标题】：How to create custom widget and use it in Qt Designer?

【发布时间】：2019-07-18 21:10:01

【问题描述】：

我非常需要创建我的自定义小部件并在 QtDesigner 中使用它（将 QWidget 推广到我的小部件）。我以前从未这样做过，也无法谷歌任何有用的东西。我需要获取的小部件只是带有少量 QLabel 和 QLineEdit 对象的方形框。此刻我有以下代码：

#include "customwidget01.h"
#include "qlabel.h"
#include "qlineedit.h"
#include "QGridLayout"
customWidget01::customWidget01(QWidget *parent) : QWidget(parent)

    QString textSheets = "QLabel,QLineEdit width:60;height:20;max-width:60;max-height:20;;min-width:60;min-height:20;";
    QString widgetSheet = "customWidget01 width:200;height:200;max-width:200;max-height:200;;min-width:120;min-height:200;";
    this->setStyleSheet(widgetSheet + textSheets);
    QLabel *label1= new QLabel(this);
    label1->setText("1st arg");
    QLabel *label2 = new QLabel(this);
    label2->setText("2nd arg");
    QLabel *label3= new QLabel(this);
    label3->setText("3rd arg");
    QLabel *label4= new QLabel(this);
    label4->setText("4th arg");
    QLineEdit *line1 = new QLineEdit(this);
    line1->setPlaceholderText("enter 1st arg");
    QLineEdit *line2 = new QLineEdit(this);
    line2->setPlaceholderText("enter 2nd arg");
    QLineEdit *line3 = new QLineEdit(this);
    line3->setPlaceholderText("enter 3rd arg");
    QLineEdit *line4 = new QLineEdit(this);
    line4->setPlaceholderText("enter 4th arg");
    QGridLayout *layout = new QGridLayout();
    this->setLayout(layout);
    layout->setVerticalSpacing(10);
    layout->setHorizontalSpacing(10);
    layout->addWidget(label1,0,0);
    layout->addWidget(label2,1,0);
    layout->addWidget(label3,2,0);
    layout->addWidget(label4,3,0);
    layout->addWidget(line1,0,1);
    layout->addWidget(line2,1,1);
    layout->addWidget(line3,2,1);
    layout->addWidget(line4,3,1);
    this->setVisible(true);

我的问题是：

无法在小部件本身周围绘制边框 垂直和水平间距不起作用

一直使用 QtDesigner 做 GUI - 不太熟悉用纯代码创建 gui。

【问题讨论】：

为什么你必须使用设计器？您可以在 C++ 中实例化您的小部件，然后从代码中将其添加到您需要的任何布局（或类似布局）中......

添加小部件对我来说根本不是问题。问题是我无法使代码中的小部件看起来不错（由于某种原因它没有边框，qgridlayout 延伸到很多（setVerticalSpacing（10）和setHorizo​​ntalSpacing（10））根本不起作用。

你的问题有点不清楚：你的小部件有问题，还是 Qt Designer 有问题？

另外，如果您对 Designer 感到满意，为什么不使用 Designer 创建您的自定义小部件？无论如何，最好将您的 UI 拆分为多个 Designer 表单（并使用提升功能或手写父小部件将它们一起使用）。

@faspowa Qt Designer 不会显示您通过代码实现的内容，因为它仅将通用小部件 + .ui 的插件作为成分，您修改的与上述不同的所有内容都只会在您显示编译并执行你的程序。例如，如果您的代码更改了某些元素的颜色，那么 Qt Designer 将不会显示它，因为它不知道，但如果您使用 Qt Designer 更改颜色，它将显示它，因为您将修改 .ui。

【参考方案1】：

让我帮助你获得漂亮的界面，你需要学习 CSS 我会告诉你它是如何工作的 这就是你现在所拥有的

这意味着你没有正确编写 CSS 代码

QString textSheets = "QLabel,QLineEdit width:60;height:20;max-width:60;max-height:20;;min-width:60;min-height:20;";
QString widgetSheet = "customWidget01 width:200;height:200;max-width:200;max-height:200;;min-width:120;min-height:200;";
this->setStyleSheet(widgetSheet + textSheets);  // does not work

我会用这些台词换取它

QString textSheets = "QLineEdit border-width: 2px; border-style: solid; border-color: red green black rgb(127,255,10); "
                      "QLabel   border-width: 2px; border-style: solid; border-color: green black rgb(10,255,180) rgb(180,10,158); " ;

setStyleSheet(textSheets);

结果就是这样

要调整大小，您只需要这样做

//label1->setMinimumSize(150,50);
label1->setFixedSize(150,50);
//label1->setMaximumSize(150,50);
//label1->setMidLineWidth(150);

结果就是这样

【参考方案2】：

在设计模式下添加QWidget。 右键单击它并从上下文菜单中选择Promote to...。 将来自QWidget 派生类的名称(customWidget01) 写入Promoted class name。 确保Header file 中生成的文本正确。 点击添加。 选择它并点击提升。

【讨论】：

谢谢，但我已经知道如何推广小部件了。我的问题是我正在推广的新的手工小部件（它看起来像垃圾，我什至无法使用样式表为其绘制边框）