Qt中绘制不规则控件

发布于:2025-04-01 ⋅ 阅读:(15) ⋅ 点赞:(0)

在Qt中绘制不规则控件可通过设置遮罩(Mask)实现。以下是详细步骤:

  1. 继承目标控件‌:如QPushButton或QWidget。
  2. 重写resizeEvent‌:当控件大小变化时,更新遮罩形状。
  3. 创建遮罩区域‌:使用QRegion或QPainterPath定义形状(如圆形、多边形)。
  4. 应用遮罩‌:使用setMask方法设置控件的可见区域。
  5. 重写paintEvent‌:绘制控件外观,确保与遮罩一致。
  6. 处理事件区域‌:如重写hitButton检查点击事件是否在遮罩内。

一、示例代码:圆形按钮

#include <QPushButton>
#include <QPainter>
#include <QResizeEvent>
#include <QRegion>

class CircleButton : public QPushButton {
public:
    CircleButton(QWidget *parent = nullptr) : QPushButton(parent) {
        setFixedSize(100, 100); // 建议设置为正方形以确保正圆
    }

protected:
    void resizeEvent(QResizeEvent *event) override {
        // 创建圆形遮罩
        QRegion region(rect(), QRegion::Ellipse);
        setMask(region);
        QPushButton::resizeEvent(event);
    }

    void paintEvent(QPaintEvent *event) override {
        QPainter painter(this);
        painter.setRenderHint(QPainter::Antialiasing); // 抗锯齿
        painter.setBrush(Qt::blue); // 填充颜色
        painter.drawEllipse(rect()); // 绘制圆形
        painter.setPen(Qt::white);
        painter.drawText(rect(), Qt::AlignCenter, "Click Me"); // 文字
    }

    bool hitButton(const QPoint &pos) const override {
        // 判断点击位置是否在圆内
        QPoint center = rect().center();
        int radius = width() / 2;
        int dx = pos.x() - center.x();
        int dy = pos.y() - center.y();
        return (dx*dx + dy*dy) <= (radius * radius);
    }
};

二、示例代码:不规则窗口

#include <QMainWindow>
#include <QPainter>
#include <QRegion>

class MainWindow : public QMainWindow {
public:
    MainWindow(QWidget *parent = nullptr) : QMainWindow(parent) {
        setWindowFlags(Qt::FramelessWindowHint); // 无边框
        setAttribute(Qt::WA_TranslucentBackground); // 透明背景
        resize(300, 300);
    }

protected:
    void paintEvent(QPaintEvent *event) override {
        QPainter painter(this);
        painter.setRenderHint(QPainter::Antialiasing);
        painter.setBrush(Qt::blue);
        painter.drawEllipse(rect()); // 绘制窗口内容
    }

    void resizeEvent(QResizeEvent *event) override {
        QRegion region(rect(), QRegion::Ellipse);
        setMask(region); // 设置窗口遮罩
    }
};

三、图像遮罩创建不规则形状的窗口

文件 mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QPixmap>
#include <QMouseEvent>

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

protected:
    void paintEvent(QPaintEvent *event) override;   // 绘制窗口
    void mousePressEvent(QMouseEvent *event) override; // 点击事件
    void mouseMoveEvent(QMouseEvent *event) override;  // 拖动窗口

private:
    QPixmap m_pixmap;      // 存储形状图片
    QPoint m_dragPos;      // 记录拖动位置
    bool isPointValid(const QPoint &pos); // 检查点击位置是否有效
};

#endif // MAINWINDOW_H

文件 mainwindow.cpp

#include "mainwindow.h"
#include <QPainter>
#include <QBitmap>
#include <QDebug>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    // 加载图片(确保资源路径正确)
    m_pixmap.load(":/images/shape.png");
    if (m_pixmap.isNull()) {
        qWarning("Failed to load image!");
        return;
    }

    // 设置窗口属性
    setWindowFlags(Qt::FramelessWindowHint | Qt::WindowStaysOnTopHint);
    setAttribute(Qt::WA_TranslucentBackground);
    setFixedSize(m_pixmap.size()); // 窗口大小与图片一致

    // 设置遮罩(仅显示非透明区域)
    setMask(m_pixmap.mask());
}

MainWindow::~MainWindow() {}

// 绘制窗口
void MainWindow::paintEvent(QPaintEvent *event)
{
    Q_UNUSED(event);
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing); // 抗锯齿
    painter.drawPixmap(0, 0, m_pixmap);
}

// 检查点击位置是否在非透明区域
bool MainWindow::isPointValid(const QPoint &pos)
{
    if (m_pixmap.isNull()) return true;
    return m_pixmap.toImage().pixelColor(pos).alpha() > 0;
}

// 鼠标按下事件
void MainWindow::mousePressEvent(QMouseEvent *event)
{
    if (event->button() == Qt::LeftButton && isPointValid(event->pos())) {
        m_dragPos = event->globalPos() - frameGeometry().topLeft();
        event->accept();
    } else {
        event->ignore(); // 透明区域不响应点击
    }
}

// 鼠标拖动事件
void MainWindow::mouseMoveEvent(QMouseEvent *event)
{
    if (event->buttons() & Qt::LeftButton) {
        move(event->globalPos() - m_dragPos);
        event->accept();
    }
}

文件 main.cpp

#include "mainwindow.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();
    return a.exec();
}

关键代码解释

  1. 设置遮罩

    setMask(m_pixmap.mask()); // 使用图片的 alpha 通道生成遮罩

    这一步使得窗口仅显示图片的非透明区域。

  2. 透明背景

    setAttribute(Qt::WA_TranslucentBackground); 
    setWindowFlags(Qt::FramelessWindowHint);

    确保窗口背景透明,避免残留默认边框。

  3. 点击有效性检查

    bool MainWindow::isPointValid(const QPoint &pos) {
        return m_pixmap.toImage().pixelColor(pos).alpha() > 0;
    }
    

    通过检查像素的透明度,决定是否响应点击事件。


网站公告

今日签到

点亮在社区的每一天
去签到