使用QLinearGradient绘制QPushButton

时间:2019-01-22 09:13:43

标签: c++ qt

我正在尝试使用QLinearGradient来绘制QPushButton,但没有成功。我找到了有关如何用纯色绘画的示例。但是我一直没有找到颜色渐变的例子。而且,我的方法行不通。

这是我完整的示例,其中纯色按钮有效而线性渐变不起作用:

#include <QApplication>
#include <QGridLayout>
#include <QLinearGradient>
#include <QPalette>
#include <QPushButton>

int main(int argc, char** argv)
{
  QApplication app(argc, argv);

  // Create layout
  QGridLayout* layout = new QGridLayout;

  // Create first button
  QPushButton* button_1 = new QPushButton();
  layout->addWidget(button_1, 0, 0);
  QPalette palette_1 = button_1->palette();
  palette_1.setColor(QPalette::Button, Qt::red);
  button_1->setPalette(palette_1);
  button_1->update();

  // Create second button
  QPushButton* button_2 = new QPushButton();
  layout->addWidget(button_2, 0, 1);
  QLinearGradient gradient_button(0, 0, button_2->width(), 0);
  gradient_button.setColorAt(0, Qt::white);
  gradient_button.setColorAt(1, Qt::black);
  QPalette palette_2 = button_2->palette();
  QBrush brush(gradient_button);
  palette_2.setBrush(QPalette::Button, brush);
  button_2->setPalette(palette_2);
  button_2->update();

  // Create widget
  QWidget* widget = new QWidget;
  widget->setLayout(layout);
  widget->resize(300, 50);

  /// Show
  widget->show();

  // Run
  return app.exec();
}

关于我在做什么错的任何想法?

2 个答案:

答案 0 :(得分:1)

没有成功,我已经使用QPalette进行了尝试,并使用setStyleSheet成功地完成了该任务:

QPushButton* button = new QPushButton();
QString linearGradient = QString("qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(0, 0, 0, 255), stop:1 rgba(255, 255, 255, 255));");

button->setStyleSheet(QString("background-color: %1").arg(linearGradient));

此外,我们可以使用QString::arg(...)为渐变设置不同的颜色和点。

希望这对您有帮助,请原谅我之前的愚蠢评论

答案 1 :(得分:1)

您的渐变配置为从<0, 0><button_2->width(), 0>,但是目前您创建的渐变button_2未包含在任何版式中:其宽度将在父级时计算窗口小部件(因此按钮所在的布局)的大小已调整。如果您尝试固定宽度,则会看到渐变按预期工作。

QPushButton* button_2 = new QPushButton();
button_2->setFixedWidth(100);

您可以使用事件过滤器来监视调整大小并相应地调整渐变:

class ButtonResizeWatcher : public QObject {
protected:
  virtual bool eventFilter(QObject* o, QEvent* e) override {
    if (e->type() == QEvent::Resize) {
      auto button = qobject_cast<QPushButton*>(o);

      QLinearGradient gradient_button(0, 0, button->width(), 0);
      gradient_button.setColorAt(0, Qt::white);
      gradient_button.setColorAt(1, Qt::red);

      auto palette = button->palette();
      palette.setBrush(QPalette::Button, QBrush(gradient_button));
      button->setPalette(palette);
    }

    return QObject::eventFilter(o, e);
  }
};

使用:

ButtonResizeWatcher resize_watcher;
button_2->installEventFilter(&resize_watcher);

完整代码可在GitHub中找到。

另一个答案中有一个其他选择,就是使用样式表(qlineargradient)。这取决于您是否需要进一步控制画笔,例如“显示渐变但仅在达到特定宽度之前”。另外,请注意,样式表通常会与其他QStyle(如果使用)冲突。