【问题标题】:QPushButton remove space (Jambi)QPushButton 删除空间(占碑)
【发布时间】:2016-04-20 18:55:33
【问题描述】:

如何删除QPushButton 的间隙/空格?

我正在查看 Windows 10 计算器,即:

如您所见,按钮 7 和 8 之间没有空格,我尝试在占碑中做同样的事情,方法是为 QGridLayoutQPushButton 设置空格,如下所示:

QVBoxLayout main_layout = new QVBoxLayout();

QGridLayout sample_layout = new QGridLayout();
sample_layout.setHorizontalSpacing(0);
sample_layout.setVerticalSpacing(0);
sample_layout.setContentsMargins(0,0,0,0);
sample_layout.setSpacing(0);
sample_layout.setWidgetSpacing(0); 

main_layout.addLayout(sample_layout);

QLineEdit edit_input = new QLineEdit();

QPushButton action_0 = new QPushButton("0");
action_0.setMinimumHeight(60);
action_0.setContentsMargins(0, 0, 0, 0);

QPushButton action_1 = new QPushButton("1");
action_1.setMinimumHeight(60);
action_1.setContentsMargins(0, 0, 0, 0);

QPushButton action_2 = new QPushButton("2");
action_2.setMinimumHeight(60);
action_2.setContentsMargins(0, 0, 0, 0);

QPushButton action_3 = new QPushButton("3");
action_3.setMinimumHeight(60);
action_3.setContentsMargins(0, 0, 0, 0);

QPushButton action_4 = new QPushButton("4");
action_4.setMinimumHeight(60);
action_4.setContentsMargins(0, 0, 0, 0);

QPushButton action_5 = new QPushButton("5");
action_5.setMinimumHeight(60);
action_5.setContentsMargins(0, 0, 0, 0);

QPushButton action_6 = new QPushButton("6");
action_6.setMinimumHeight(60);
action_6.setContentsMargins(0, 0, 0, 0);

QPushButton action_7 = new QPushButton("7");
action_7.setMinimumHeight(60);
action_7.setContentsMargins(0, 0, 0, 0);

QPushButton action_8 = new QPushButton("8");
action_8.setMinimumHeight(60);
action_8.setContentsMargins(0, 0, 0, 0);

QPushButton action_9 = new QPushButton("9");
action_9.setMinimumHeight(60);
action_9.setContentsMargins(0, 0, 0, 0);

QPushButton action_plus = new QPushButton("+");
action_plus.setMinimumHeight(120);
action_plus.setContentsMargins(0, 0, 0, 0);

QPushButton action_minus = new QPushButton("-");
action_minus.setMinimumHeight(60);
action_minus.setContentsMargins(0, 0, 0, 0);

QPushButton action_divide = new QPushButton("/");
action_divide.setMinimumHeight(60);
action_divide.setContentsMargins(0, 0, 0, 0);

QPushButton action_times = new QPushButton("X");
action_times.setMinimumHeight(60);
action_times.setContentsMargins(0, 0, 0, 0);

QPushButton action_equal = new QPushButton("=");
action_equal.setMinimumHeight(120);
action_equal.setContentsMargins(0, 0, 0, 0);

QPushButton action_dot = new QPushButton(".");
action_dot.setMinimumHeight(60);
action_dot.setContentsMargins(0, 0, 0, 0);

QPushButton action_del = new QPushButton("< Delete");
action_del.setMinimumHeight(60);
action_del.setContentsMargins(0, 0, 0, 0);

QPushButton action_clear = new QPushButton("Clear");
action_clear.setMinimumHeight(60);
action_clear.setContentsMargins(0, 0, 0, 0);

sample_layout.addWidget(edit_input,0,0,1,4);
sample_layout.addWidget(action_minus,1,0);
sample_layout.addWidget(action_divide,1,1);
sample_layout.addWidget(action_times,1,2);
sample_layout.addWidget(action_del,1,3);
sample_layout.addWidget(action_7,2,0);
sample_layout.addWidget(action_8,2,1);
sample_layout.addWidget(action_9,2,2);
sample_layout.addWidget(action_4,3,0);
sample_layout.addWidget(action_5,3,1);
sample_layout.addWidget(action_6,3,2);
sample_layout.addWidget(action_1,4,0);
sample_layout.addWidget(action_2,4,1);
sample_layout.addWidget(action_3,4,2);
sample_layout.addWidget(action_clear,5,0);
sample_layout.addWidget(action_0,5,1);
sample_layout.addWidget(action_dot,5,2);
sample_layout.addWidget(action_plus,2,3,2,1);
sample_layout.addWidget(action_equal,4,3,2,1);

但我之间仍有差距。

注意:如果我设置了main_layout.setContentsMargins(0,0,0,0)main_layout.setWidgetSpacing(0),我会非常适合QLineEdit,如下图所示,但不是QPushButton,所以我相信QPushButton 中有一个选项可以创建这个差距,但是仅适用于 QPushButton setContentsMargins(),您知道吗?

我确实调查过其他提出相同问题的人,他们使用 QSpacerItem,但该解决方案没有意义(感觉不像是正确/专业的方式),因为在 QLineEdit 中它完全没有任何问题差距,但不在QPushButton 中。

编辑:当我申请 action_plus.setFlat(true); 时,按钮看起来像这样:

【问题讨论】:

  • 虽然我将您的代码转换为PyQt(但最终结果是相同的),但我复制粘贴了您的代码,而且按钮之间根本没有间距。 QGridLayout 也没有 setWidgetSpacing()(对于 Qt4 和 Qt5)。我注意到在您的屏幕截图中,尽管您将窗口设置为无框模式,但您也有一个框架。我运行 Linux,但没有框架(如代码所示)。也许间距也是 Windows 上的一些奇怪行为?默认情况下,这些按钮显然具有不同的样式(我的按钮或多或少看起来像 Win98 按钮),因此间距问题可能只是因为 Windows。
  • 顺便说一句,action_8.setMinimumHeight(defaultHeight); 而不是 action_8.setMinimumHeight(60); 就像所有其他数字按钮一样有原因吗?
  • @rbaleksandar 是的,我很惊讶有 setWidgetSpacing() 它出现在 Eclipse 中并且我使用了它(认为可以以某种方式提供帮助,但没有改变任何东西)。 Jambi最新版本是Qt 4.8.6,刚才我在玩stylesheet,如果我改变背景和边框颜色,它就完美了!关于样式表,我们可以选择反转边框吗?也许你说的是因为windows风格。
  • 如果您想要平面按钮,只需使用your_button.setFlat(true),结果将与您在 Windows 计算器的屏幕截图中相同。如果这就是“反转边框”的意思。
  • 哦,defaultHeight 是一个整数,所以如果我改变一个高度,所有按钮也会改变,我忘了改变它,想使代码看起来更小。

标签: java qt qt-jambi jambi


【解决方案1】:

为了避免大量编写,创建一个继承自QPushButton 的自定义类。在构造函数中添加一个调用setFlat(true),它用于处理按钮边框的提升(除非被样式覆盖)。下面的样式表(使用setStyleSheet(...) 设置您的按钮以使用它)提供了一个很好的悬停效果:

QPushButton:hover{
  background-color: rgb(164, 156, 156);
  border: 0px;
}

根据自己的喜好更改颜色以适合 Windows 10 主题。您可以省略 setFlat(true) 而是添加

QPushButton{
  border: 0px
}

到您的样式表(连同悬停处理程序)。效果是一样的。

结果是(在我的情况下是在 Linux 上):

您还可以使用样式表中的border 属性来展平您的QLineEdit

完全没有边框:

1px 实线边框:

【讨论】:

  • @Bear 为您的行编辑添加了一些额外信息,以使其适合 UI 的其余部分。