QWidget绘制透明背景、绘制不规则窗体解决办法

使用QWidget设计界面时，经常要设置边框、背景、背景透明度等特性。
一般的做法就是，设计设置样式表，在UI设计师界面可以直接右键设置样式表。

#widget_time_ui_1
{
background-color: rgba(0, 0, 0, 80%);
}

设置完之后,在UI设计界面看起来非常完美，效果都实现了，但是编译运行之后却没有效果。

解决办法： 需要重写paintEvent函数，写上绘制样式的代码。

头文件:

#ifndef MY_WIDGET_TIME_UI_H
#define MY_WIDGET_TIME_UI_H

#include <QWidget>
#include <QPainter>
#include <QStyleOption>

class my_widget_time_ui : public QWidget
{
    Q_OBJECT

public:
    explicit my_widget_time_ui(QWidget *parent = nullptr);
    ~my_widget_time_ui();
private:
    void paintEvent(QPaintEvent *pEvent);

};

#endif // MY_WIDGET_TIME_UI_H

源文件

#include "my_widget_time_ui.h"

my_widget_time_ui::my_widget_time_ui(QWidget *parent) :
    QWidget(parent)
{

}

my_widget_time_ui::~my_widget_time_ui()
{

}

void my_widget_time_ui::paintEvent(QPaintEvent *pEvent)
{

    QStyleOption opt;
    opt.initFrom(this);
    QPainter p(this);
    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);//绘制样式
}

如果想要绘制不规则的窗体，也可以在paintEvent这里面自己写代码绘制。
采用QPainterPath才记录不规则的窗体形状，进行绘制。

QPainterPath对象可以构造为具有给定起点的空路径，也可以构造为另一个QPainterPath对象的副本。创建后，可以使用lineTo()、arcTo()、cubicTo()和quadTo()函数将直线和曲线添加到路径中。直线和曲线从currentPosition()延伸到作为参数传递的位置。

QPainterPath对象的currentPosition()始终是添加的最后一个子路径（或初始起点）的结束位置。使用moveTo()函数移动currentPosition()，而不添加组件。函数的作用是：隐式启动一个新的子路径，并关闭前一个子路径。启动新子路径的另一种方法是调用closeSubpath()函数，该函数通过将currentPosition()中的一行添加回路径的起始位置来关闭当前路径。请注意，新路径将（0，0）作为其初始currentPosition()。

QPainterPath类还提供了几个方便的函数来向绘制路径添加闭合子路径：AddAllipse()、addPath()、addRect()、addRegion()和addText()。函数的作用是：添加一个未关闭的子路径。实际上，这些函数都是moveTo()、lineTo()和cubicTo()操作的集合。

此外，可以使用connectPath()函数将路径添加到当前路径。但请注意，此函数将通过添加一行将当前路径的最后一个元素连接到给定路径的第一个元素。
下面是一段代码片段，显示了如何使用QPainterPath对象：

QPainterPath path;
path.addRect(20, 20, 60, 60);

path.moveTo(0, 0);
path.cubicTo(99, 0,  50, 50,  99, 99);
path.cubicTo(0, 99,  50, 50,  0, 0);

QPainter painter(this);
painter.fillRect(0, 0, 100, 100, Qt::white);
painter.setPen(QPen(QColor(79, 106, 25), 1, Qt::SolidLine,
				  Qt::FlatCap, Qt::MiterJoin));
painter.setBrush(QColor(122, 163, 39));

painter.drawPath(path);

下面例子: 绘制一个圆角矩形的窗口

#define RADIUS 17             //窗口边角的弧度
#define ELLIPSE_RADIUS 12     //内部小圆半径
#define RECT 10               //图标长/宽的一半
#define TEXT_LENGTH 100       //文字长度

void my_widget_time_ui::paintEvent(QPaintEvent *pEvent)
{
//    QStyleOption opt;
//    opt.initFrom(this);
//    QPainter p(this);
//    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);//绘制样式

//    QWidget::paintEvent(p);
    QPainter Painter(this);
    Painter.setRenderHint(QPainter::Antialiasing, true);
    Painter.setPen(Qt::NoPen);
    Painter.setBrush(QColor(114, 164, 250, 200));


    //绘制不规则窗体
    QPainterPath PainterPath;
    PainterPath.addRoundedRect(QRect(0, 0, width(), height()), RADIUS, RADIUS);  //Rect
    Painter.drawPath(PainterPath);
}

drawPath功能介绍：

使用当前画笔绘制轮廓，使用当前画笔绘制填充，绘制给定的绘制路径。

QPainterPath path;
path.moveTo(20, 80);
path.lineTo(20, 30);
path.cubicTo(80, 0, 50, 50, 80, 80);

QPainter painter(this);
painter.drawPath(path);

addRoundedRect 功能介绍:

void QPainterPath::addRoundedRect(const QRectF &rect, qreal xRadius, qreal yRadius, Qt::SizeMode mode = Qt::AbsoluteSize)
将具有圆角的给定矩形矩形矩形添加到路径。
xRadius和yRadius参数指定定义圆角矩形角的椭圆的半径。当模式为Qt:：RelativeSize时，xRadius和yRadius分别以矩形宽度和高度的一半的百分比指定，并且应在0.0到100.0之间。
Qt4.4中引入了此函数。