| qt Qss 边框渐变 | 您所在的位置：网站首页 › qss渐变色 › qt Qss 边框渐变 |
qt Qss 边框渐变
|
目录 背景渐变 方案一 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); |
【本文地址】
公司简介
联系我们