目录

背景渐变

方案一 Qss

方案二 paintEvent函数

方案三 QGraphicsDropShadowEffect投影效果

---

背景渐变

QT里面背景是可以渐变，其中qlineargradient里面参数意思

spread：渐变方式（具体可以查看qt帮助文档搜索PadSpread）

坐标x1、y1、x2、y2：分别代表渐变方向，可以认为是向量方式

stop：可以理解每段从某个颜色到结束渐变

background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(0, 0, 0, 255), stop:0.5 rgba(255, 255, 255, 255));

详细 可以参考官方文档或者博客。这里主要给出渐变线的方案

方案一 Qss

用渐变背景方式渐变线

QPushButton* button = new QPushButton("Button", this);
button->setStyleSheet("border: 1px solid qlineargradient(x1: 0, y1: 0, x2: 1, y2: 1, stop: 0 #FF0000, stop: 1 #00FF00); border-radius: 5px;");

可以看出效果并不好，（如果四周都有倒角不建议这样处理，个别情况不太好处理）

针对各个边设置

QPushButton* button = new QPushButton("Button", this);
button->->setStyleSheet("background:#1E1E1E;border-style:transparent;\
			border-top: 1px solid qlineargradient(x1: 0, y1: 0, x2: 1, y2: 1, stop: 0 #007FFA, stop: 0.3 #007FFA,stop: 0.6 #007FFA,stop: 0.9 #007FFA,stop: 1 #007FFA);\
			border-left: 1px solid qlineargradient(x1: 0, y1: 0, x2: 1, y2: 1, stop: 0 #007FFA, stop: 0.7 #1E1E1E);\
			border-right: 1px solid qlineargradient(x1: 0, y1: 0, x2: 1, y2: 1, stop: 0 #007FFA, stop: 0.7 #1E1E1E);border-top-left-radius:5px;border-top-right-radius:5px;");

 

效果像这个样式，但是如果下面加角度好像效果并不太好

方案二 paintEvent函数

使用QPainter绘制：你可以通过重写按钮的paintEvent函数，使用QPainter来绘制按钮的边框。在绘制过程中，你可以使用QLinearGradient来创建渐变效果，并使用QPen来设置边框的样式。 

void MyButton::paintEvent(QPaintEvent* event)
{
    QPushButton::paintEvent(event);

    QPainter painter(this);
    QLinearGradient gradient(rect().topLeft(), rect().bottomRight());
    gradient.setColorAt(0, QColor("#FF0000"));
    gradient.setColorAt(1, QColor("#00FF00"));

    QPen pen(gradient, 2);
    painter.setPen(pen);
    painter.setBrush(Qt::NoBrush);
    painter.drawRect(rect().adjusted(1, 1, -1, -1));
}

方案三 QGraphicsDropShadowEffect投影效果

使用QGraphicsEffect：你可以使用Qt的图形效果框架来实现按钮的渐变边框效果。首先，你可以创建一个QGraphicsEffect对象，并将其设置为按钮的图形效果。然后，你可以使用QLinearGradient来创建渐变效果，并将其设置为QGraphicsEffect的属性。

QGraphicsDropShadowEffect* effect = new QGraphicsDropShadowEffect(this);
QLinearGradient gradient(rect().topLeft(), rect().bottomRight());
gradient.setColorAt(0, QColor("#FF0000"));
gradient.setColorAt(1, QColor("#00FF00"));
effect->setColor(gradient);
button->setGraphicsEffect(effect);