Qt不规则窗体组合的使用
博客专区 > BB计划 的博客 > 博客详情
Qt不规则窗体组合的使用
BB计划 发表于4年前
Qt不规则窗体组合的使用
  • 发表于 4年前
  • 阅读 31
  • 收藏 0
  • 点赞 0
  • 评论 0

新睿云服务器60天免费使用,快来体验!>>>   

摘要: 题目来源自安防产品,需要把一系列不规则的窗口整个成一个特定的形状,这里需要组合成圆形

这个题目来源自安防产品,需要把一系列不规则的窗口整个成一个特定的形状,这里需要组合成圆形。

在这里使用的是QtCreator作为编辑工具。

首先,拖一些控件到主窗体,

第2步,创建一个扩展过的类

头文件:

#ifndef QEXPUSHBUTTON_H
#define QEXPUSHBUTTON_H

#include <QWidget>
#include <QPushButton>
#include <QPixmap>

class QExPushButton : public QPushButton
{
    Q_OBJECT
public:
    explicit QExPushButton(QWidget *parent = NULL);
    void setPixmap(const QString strPath, float wScaled = 1, float hScaled = 1);
    void setPixmapPressed(const QString strPath, float wScaled = 1, float hScaled = 1);

    void setPixmap(const QPixmap & strPath, float wScaled = 1, float hScaled = 1);
    void setPixmapPressed(const QPixmap & strPath, float wScaled = 1, float hScaled = 1);
signals:
    void pressed();

    void released();
public slots:
protected:
    void paintEvent(QPaintEvent *);
    void mousePressEvent(QMouseEvent *);
    void mouseReleaseEvent(QMouseEvent *);
protected:
    QPixmap m_pixReleased;
    QPixmap m_pixMask;
    QPixmap m_pixPressed;
    bool m_binit;
};

#endif // QEXPUSHBUTTON_H

源文件:

#include "QExPushButton.h"
#include <QPainter>
#include <QMessageBox>
#include <QBitmap>
#include <QMouseEvent>
#include <Qdebug>
QExPushButton::QExPushButton(QWidget *parent) :
    QPushButton(parent)
{
    m_binit = false;

}

void QExPushButton::setPixmap(const QPixmap & pixmap, float wScaled, float hScaled)
{
    m_pixReleased = pixmap;
    m_pixReleased = m_pixReleased.scaled(m_pixReleased.width() * wScaled, m_pixReleased.height() * hScaled);
    if (!m_binit)
    {
        m_pixMask = m_pixReleased;
        setMask(QBitmap(m_pixMask.mask()));
        m_binit = true;
    }
}

void QExPushButton::setPixmap(const QString strPath, float wScaled, float hScaled)
{
    m_pixReleased = QPixmap(strPath);
    m_pixReleased = m_pixReleased.scaled(m_pixReleased.width() * wScaled, m_pixReleased.height() * hScaled);
    if (!m_binit)
    {
        m_pixMask = m_pixReleased;
        setMask(QBitmap(m_pixMask.mask()));
        m_binit = true;
    }
}

void QExPushButton::setPixmapPressed(const QPixmap & strPath, float wScaled, float hScaled)
{
    m_pixPressed = strPath;
    m_pixPressed = m_pixPressed.scaled(m_pixPressed.width() * wScaled, m_pixPressed.height() * hScaled);
}
void QExPushButton::setPixmapPressed(const QString strPath, float wScaled, float hScaled)
{
    m_pixPressed = QPixmap(strPath);
    m_pixPressed = m_pixPressed.scaled(m_pixPressed.width() * wScaled, m_pixPressed.height() * hScaled);
}
void QExPushButton::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.drawPixmap(0, 0, m_pixMask);
}

void QExPushButton::mouseReleaseEvent(QMouseEvent *e)
{
    if (e->button() != Qt::LeftButton)
    {
        e->ignore();
    }
    if (e->type() == QEvent::MouseButtonRelease)
    {
        m_pixMask = m_pixReleased;
        qDebug() <<"MouseButtonRelease";
        repaint();
        emit released();
    }
}

void QExPushButton::mousePressEvent(QMouseEvent *e)
{
    if (e->button() != Qt::LeftButton)
    {
        e->ignore();
    }
    if (e->type() == QEvent::MouseButtonPress)
    {
        m_pixMask = m_pixPressed;
        qDebug() <<"MouseButtonPress";
        repaint();
        emit pressed();
    }
}

接下来,需要在界面窗体将button控件提升一下:

右键,提升,然后输入类名称即可。

接下来要做的事情则比较机械化,就是在主窗体的对应cpp文件中分别设置空间的鼠标按下时的图片和鼠标松开的图片,在这里,请注意偏移量的使用和缩放比例的使用,有时候会很有用。

#include "mainwindow.h"
#include "QExPushButton.h"
#include <QPixmap>
#include <QIcon>
#include <QBitmap>
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent)
{

    setupUi(this);
    // 1 先计算出屏幕缩放比例
    float fwscaled = 1;
    float fhscaled = 1;

    // 2 所有的按钮同一个偏移量
    int h = 0;
    int w = 0;
    //中心按钮略有不同,这和中心按钮的原始大小有关系
    int hcenter = 1;
    int wcenter = 1;

    // 3 所有的按钮同一个大小

    QSize size(205, 205);
    size.setWidth(size.width() * fwscaled);
    size.setHeight(size.height() * fhscaled);


    QSize sizeCenter(230, 230);
    sizeCenter.setWidth(sizeCenter.width() * fwscaled);
    sizeCenter.setHeight(sizeCenter.height() * fhscaled);



    ptn_up->resize(size);
    ptn_up->move(w, h);
    ptn_leftUp->resize(size);
    ptn_leftUp->move(w, h);
    ptn_left->resize(size);
    ptn_left->move(w, h);
    ptn_leftDown->resize(size);
    ptn_leftDown->move(w, h);
    ptn_down->resize(size);
    ptn_down->move(w, h);
    ptn_rightDown->resize(size);
    ptn_rightDown->move(w, h);
    ptn_right->resize(size);
    ptn_right->move(w, h);
    ptn_rightUp->resize(size);
    ptn_rightUp->move(w, h);


    ptn_up->setPixmapPressed(":/res/11up.png", fwscaled, fhscaled);
    ptn_leftUp->setPixmapPressed(":/res/11leftUp.png", fwscaled, fhscaled);
    ptn_left->setPixmapPressed(":/res/11left.png", fwscaled, fhscaled);
    ptn_leftDown->setPixmapPressed(":/res/11leftDown.png", fwscaled, fhscaled);
    ptn_down->setPixmapPressed(":/res/11down.png", fwscaled, fhscaled);
    ptn_rightDown->setPixmapPressed(":/res/11rightDown.png", fwscaled, fhscaled);
    ptn_right->setPixmapPressed(":/res/11right.png", fwscaled, fhscaled);
    ptn_rightUp->setPixmapPressed(":/res/11rightUp.png", fwscaled, fhscaled);

    ptn_up->setPixmap(":/res/1up.png", fwscaled, fhscaled);
    ptn_leftUp->setPixmap(":/res/1leftUp.png", fwscaled, fhscaled);
    ptn_left->setPixmap(":/res/1left.png", fwscaled, fhscaled);
    ptn_leftDown->setPixmap(":/res/1leftDown.png", fwscaled, fhscaled);
    ptn_down->setPixmap(":/res/1down.png", fwscaled, fhscaled);
    ptn_rightDown->setPixmap(":/res/1rightDown.png", fwscaled, fhscaled);
    ptn_right->setPixmap(":/res/1right.png", fwscaled, fhscaled);
    ptn_rightUp->setPixmap(":/res/1rightUp.png", fwscaled, fhscaled);


    ptn_center->resize(sizeCenter);
    ptn_center->move(wcenter, hcenter);

    //中心按钮再次缩放
    float fcenter = 0.92;
    QPixmap pix(":/res/ptz.png");
    ptn_center->resize(pix.size());
    ptn_center->setPixmap(":/res/ptz.png", fwscaled * fcenter, fhscaled * fcenter);
    ptn_center->setPixmapPressed(":/res/ptz.png", fwscaled * fcenter, fhscaled * fcenter);
}

MainWindow::~MainWindow()
{



}

最后,看一下效果图:

注意,我使用的小图片的尺寸都是一样的,

  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 0
博文 8
码字总数 2859
×
BB计划
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: