Qt用qml实现简单的粒子效果

最终运行效果:

Qt用qml实现简单的粒子效果_第1张图片

涉及到的Qt知识点: 事件:鼠标事件,键盘事件,Paint事件,以及图片遮罩,定时器

新建一个空的qmake工程, loginDlg, 找一个带透明背景的png图片作为背景图

建一个重载于QWidget的类,然后在构造的时候将图形加载并处理好,实现paintEvent函数,进行图形的绘制

需要理解的是Mask。 Mask怎么讲呢?做了一张图片,简单直观地了解下Mask:

Qt用qml实现简单的粒子效果_第2张图片


重载的类:

.h

#ifndef LOGINDLG_H

#define LOGINDLG_H

#include 

#include 

 

class loginDlg : public QWidget

{

    Q_OBJECT

public:

    explicit loginDlg(QWidget *parent = 0);

 

protected:

    // 重载函数 响应鼠标事件 用于界面拖动

    virtual void mousePressEvent(QMouseEvent *event);

    virtual void mouseMoveEvent(QMouseEvent *event);

 

    // 实现键盘事件

    virtual void keyPressEvent(QKeyEvent *event);

 

    // 重绘

    virtual void paintEvent(QPaintEvent *event);

 

private slots:

    void showtime();

 

private:

    QPoint m_ptDrag;

    QLabel *m_pLabel;

    QPixmap m_pixMap;

};

 

#endif // LOGINDLG_H


.cpp

#include "logindlg.h"

#include 

#include 

#include 

#include 

#include 

#include 

#include 

 

loginDlg::loginDlg(QWidget *parent) : QWidget(parent)

{

    setWindowFlags(Qt::FramelessWindowHint);

    QPalette p=palette();

    p.setColor(QPalette::WindowText,Qt::green);

    setPalette(p);

 

    m_pLabel =new QLabel;

    m_pLabel->setStyleSheet("font-size:56px;color:blue");

 

    QGridLayout *mainLayout=new QGridLayout(this);

    mainLayout->addWidget(m_pLabel,0,0,Qt::AlignHCenter);

 

    m_pixMap.load(":/Res/login.png",0,

             Qt::AvoidDither|Qt::ThresholdDither|

             Qt::ThresholdAlphaDither);

 

    resize(m_pixMap.size());

 

    // 以png图片为遮罩,遮罩外面的图就进行删除

    // 最终实现了不规则图形

    setMask(QBitmap(m_pixMap.mask()));

 

    QTimer *timer=new QTimer;   // 定时器

 

    // 到指定时间间隔后 触发timeout信号 响应showtime槽函数

    connect(timer,SIGNAL(timeout()),this,SLOT(showtime()));

 

    timer->start(10);// 启动定时器,timeout=10 即10毫秒触发一次信号

}

 

// 重载父类的虚函数

void loginDlg::mousePressEvent(QMouseEvent *event)

{

    if(event->button()==Qt::LeftButton)

    {

        m_ptDrag=event->globalPos()-frameGeometry().topLeft();

        event->accept();

    }

    else if(event->button()==Qt::RightButton)

    {

        close();    // 右键关闭软件

    }

}

 

 

void loginDlg::mouseMoveEvent(QMouseEvent *event)

{

    move(event->globalPos()- m_ptDrag);

    event->accept();

}

 

void loginDlg::paintEvent(QPaintEvent *event)

{

    QPainter painter(this);

    painter.drawPixmap(0, 0, QPixmap(":/Res/login.png"));

}

 

 

void loginDlg::keyPressEvent(QKeyEvent *event)

{

    if(event->key() == Qt::Key_Return &&

            (event->modifiers() &Qt::ControlModifier)&&

            (event->modifiers()&Qt::ShiftModifier))

    {

        close();

    }

    else if(Qt::Key_Q == event->key())

    {

        close();

    }

}

 

 

void loginDlg::showtime()

{

    QTime time=QTime::currentTime();

    m_pLabel->setText(time.toString("A hh:mm:ss"));

}



然后,我们在main函数中调用并显示它即可

#include 

#include 

#include 

#include 

 

#include "logindlg.h"

 

int main(int argc, char* argv[])

{

    QApplication app(argc, argv);

 

    loginDlg* pW = new loginDlg();

 

    pW->show();

 

    return app.exec();

}

 


若在Qt中,使用资源文件,比如图片等,若无法显示,首先考虑使用的图片路径是否正确。可先采用绝对路径作测试,若绝对路径可以正常显示,则再改为相对路径。

在工程文件中,添加一个Qt Resource的资源库,然后再在库中添加图片,复制此图片的路径,即为相对路径

比如:获取图片Image的路径三种方式:

(相对路径) qrc:/res/other/256-1.png

(网络路径) http://www.qzher.com/onlyfortest-not-exist.png
(绝对路径) file:///D:/qzher/abc.png

源码下载: http://download.csdn.net/detail/sinat_35523212/9603234


Linux下,基于Qt5.7, 若Windows下报错,可将中文注释删除即可。
此为QtCreate之Bug

Qt用qml实现简单的粒子效果_第3张图片

你可能感兴趣的:(qt)