效果
思路
1、刮奖图层分为两层,一个底层,一个顶层。刮奖的时候,也就是鼠标拖动的时候,将顶层变透明,然后暴露底层。
2、要将顶层图片变透明,那么顶层图片必须有Alpha通道。底层无所谓,普通RGB就行,底层也可以不用图片,直接绘制文本就行了。
3、鼠标拖动的时候变透明,也就是将鼠标路径变透明,所以需要将画刷设置为Clear模式,将指定图层区域绘画成透明区域。
4、刮图层时候,采取画线形式,笔端设置圆点笔帽,看起来比较接近现实。
开工
1、首先准备顶层图片和两个QPoint来表示鼠标按下和拖动的坐标
QImage *mTopImg;
QPoint mStartPos;
QPoint mCurrPos;
mTopImg = new QImage(200, 80, QImage::Format_ARGB32_Premultiplied);
mTopImg->fill(Qt::yellow);
2、接着准备一个画刮奖图层的函数,并重写paintEvent
void MainWindow::drawScratchCards()
{
QPainter p(this);
QFont font;
font.setPointSize(30);
font.setFamily("Microsoft YaHei");
p.setFont(font);
p.drawText(10, 10, 150, 60, Qt::AlignCenter, "中奖啦"); // 先画底层
p.drawImage(10, 10, *mTopImg); // 再画上层
p.end();
}
void MainWindow::paintEvent(QPaintEvent *event)
{
drawScratchCards();
}
3、重写鼠标按下事件和移动事件
void MainWindow::mousePressEvent(QMouseEvent *event)
{
mStartPos = event->pos();
QWidget::mousePressEvent(event);
}
void MainWindow::mouseMoveEvent(QMouseEvent *event)
{
mCurrPos = event->pos();
{
QPainter p;
p.begin(mTopImg);
p.setCompositionMode(QPainter::CompositionMode_Clear);
p.setBrush(Qt::NoBrush);
p.setPen(QPen(Qt::yellow, 4, Qt::SolidLine, Qt::RoundCap));
p.drawLine(mStartPos, mCurrPos);
p.end();
}
update();
QWidget::mouseMoveEvent(event);
}
这样就简单完成一个刮奖图层了 (ノへ ̄、)