如何避免带有边框图像的 QPushButton 的文本剪辑答案

【问题标题】：How to avoid text clipping for QPushButton with borderimage如何避免带有边框图像的 QPushButton 的文本剪辑
【发布时间】：2014-08-26 18:04:44
【问题描述】：

我正在设计一个带有 28px 边框的边框图像的 QPushButton（对于真正的圆角）像这样：

#MyApp QPushButton
{
    margin:0;
    padding: 0;
    border:0;
    border-image: url(:/graphics/button_brand_up.png) 28 28 28 28 stretch stretch;
    border-top: 28px transparent;
    border-bottom: 28px transparent;
    border-right: 28px transparent;
    border-left: 28px transparent;
}

但是，似乎在呈现按钮时，按钮上的文本标签被剪裁到边框图像的内部补丁。就我而言，这结果是灾难性的：

如何解决此问题，以便在按钮的整个表面上呈现文本，包括边框边缘？

【问题讨论】：

标签： qt5 styling qpushbutton qtwidgets

【解决方案1】：

事实证明，这比最初预期的更简单、更直观。

解决方案是将按钮上的负填充设置为与边框图像半径相同，如下所示：

#MyApp QPushButton
{
    margin:0;
    padding: -28px; /* THIS SOLVED IT */
    border:0;
    border-image: url(:/graphics/button_brand_up.png) 28 28 28 28 stretch stretch;
    border-top: 28px transparent;
    border-bottom: 28px transparent;
    border-right: 28px transparent;
    border-left: 28px transparent;
}

现在按钮看起来正确了：

【讨论】：