Qt_阴影效果

简介:

一、控件阴影效果

为子部件添加阴影比较简单,使用如下方式:

1
2
3
4
5
6
7
8
9
QGraphicsDropShadowEffect *shadow_effect =  new  QGraphicsDropShadowEffect( this );
 
shadow_effect->setOffset(-5, 5);
 
shadow_effect->setColor(Qt::gray);
 
shadow_effect->setBlurRadius(8);
 
network_group_box->setGraphicsEffect(shadow_effect);

    效果如下:

Qt之再谈阴影边框

二、 窗口阴影效果(代码实现)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
void  DropShadowWidget::paintEvent(QPaintEvent * event )
{
 
     QPainterPath path;
     path.setFillRule(Qt::WindingFill);
     path.addRect(10, 10,  this ->width()-20,  this ->height()-20);
     QPainter painter( this );
     painter.setRenderHint(QPainter::Antialiasing,  true );
     painter.fillPath(path, QBrush(Qt::white));
 
     QColor color(0, 0, 0, 50);
     for ( int  i=0; i<10; i++)
     {
         QPainterPath path;
         path.setFillRule(Qt::WindingFill);
         path.addRect(10-i, 10-i,  this ->width()-(10-i)*2,  this ->height()-(10-i)*2);
         color.setAlpha(150 - qSqrt(i)*50);
         painter.setPen(color);
         painter.drawPath(path);
     }
}

  三、窗口阴影效果(图片绘制)

 阴影边框很常见,诸如360以及其他很多软件都有类似效果,了解CSS3的同学们应该都知道box-shadow,它就是来设定阴影效果的,那么Qt呢?看过一些资料,说是QSS是基于CSS2的,既然如此,box-shadow是基于CSS3的!那么Qt定然就用不了!

  搜了一些资料,每张图片都做成阴影效果的固然不可能,直接舍弃(即使可以,也不采纳)。如果实时的去画图,效率太低,最后选择了拼图的方式!
Qt之阴影边框
  效果如下:
   Qt之阴影边框
Qt之阴影边框
  左上角、左下角、右上角、右下角、上、下、左、右,这几个方向都绘制对应的图即可!
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
#include "shadow_widget.h"
 
ShadowWidget::ShadowWidget(QWidget *parent)
    : QDialog(parent)
{
    setWindowFlags(Qt::FramelessWindowHint | Qt::Dialog);
    setAttribute(Qt::WA_TranslucentBackground);
}
ShadowWidget::~ShadowWidget()
{
}
void  ShadowWidget::paintEvent(QPaintEvent * event )
{
    QPainter painter( this );
    this ->drawShadow(painter);
    painter.setPen(Qt::NoPen);
    painter.setBrush(Qt::white);
    painter.drawRect(QRect(SHADOW_WIDTH, SHADOW_WIDTH,  this ->width()-2*SHADOW_WIDTH,  this ->height()-2*SHADOW_WIDTH));
}
void  ShadowWidget::drawShadow(QPainter &painter)
{
    //绘制左上角、左下角、右上角、右下角、上、下、左、右边框
    QList pixmaps;
    pixmaps.append(QPixmap( ":/shadow/shadow_left" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_right" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_top" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_bottom" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_left_top" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_right_top" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_left_bottom" ));
    pixmaps.append(QPixmap( ":/shadow/shadow_right_bottom" ));
    painter.drawPixmap(0, 0, SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[4]);
    painter.drawPixmap( this ->width()-SHADOW_WIDTH, 0, SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[5]);
    painter.drawPixmap(0, this ->height()-SHADOW_WIDTH, SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[6]);
    painter.drawPixmap( this ->width()-SHADOW_WIDTH,  this ->height()-SHADOW_WIDTH, SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[7]);
    painter.drawPixmap(0, SHADOW_WIDTH, SHADOW_WIDTH,  this ->height()-2*SHADOW_WIDTH, pixmaps[0].scaled(SHADOW_WIDTH,  this ->height()-2*SHADOW_WIDTH));
    painter.drawPixmap( this ->width()-SHADOW_WIDTH, SHADOW_WIDTH, SHADOW_WIDTH,  this ->height()-2*SHADOW_WIDTH, pixmaps[1].scaled(SHADOW_WIDTH,  this ->height()- 2*SHADOW_WIDTH));
    painter.drawPixmap(SHADOW_WIDTH, 0,  this ->width()-2*SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[2].scaled( this ->width()-2*SHADOW_WIDTH, SHADOW_WIDTH));
    painter.drawPixmap(SHADOW_WIDTH,  this ->height()-SHADOW_WIDTH,  this ->width()-2*SHADOW_WIDTH, SHADOW_WIDTH, pixmaps[3].scaled( this ->width()-2*SHADOW_WIDTH, SHADOW_WIDTH));
 
}

  


本文转自夜&枫博客园博客,原文链接:http://www.cnblogs.com/newstart/p/3365455.html,如需转载请自行联系原作者

相关文章
|
1月前
QT笔刷画笔渲染的使用
QT笔刷画笔渲染的使用
|
2月前
|
算法 开发者
【Qt UI相关】Qt5和Qt6中关于高DPI缩放属性
【Qt UI相关】Qt5和Qt6中关于高DPI缩放属性
52 1
|
6月前
|
存储 Cloud Native Linux
Qt QSlider样式
Qt QSlider样式
Qt之滑动条和进度条(QSlider、QProgressBar)
Qt之滑动条和进度条(QSlider、QProgressBar)
676 1
|
C++
Qt界面优化:Qt去边框与窗体圆角化
Qt界面优化:Qt去边框与窗体圆角化
376 0
Qt界面优化:Qt去边框与窗体圆角化
【QT】QT不规则窗体效果——遮罩
【QT】QT不规则窗体效果——遮罩
Qt无边框窗口拖拽和阴影
无边框窗口的实现
371 0
Qt无边框窗口拖拽和阴影
QT软件开发: QGraphicsView设置无边框背景透明
QT软件开发: QGraphicsView设置无边框背景透明
590 0
QT软件开发: QGraphicsView设置无边框背景透明