QT翻金币配置游戏界面

文章目录

• • 
    
• ​​设置标题,图标,尺寸等等​​
• ​​设置背景窗口图片​​
• ​​设置金币后面的透明背景​​
• ​​设置金币类​​
• ​​点击金币后实现上下左右的翻转​​
  • 
    

首先新建这个窗口类,就叫 p l a y s c e n c e playscence playscence吧!!继承于 Q M a i n W i n d o w QMainWindow QMainWindow

设置标题,图标,尺寸等等

//初始化游戏场景
    this->setFixedSize(520,688);
    this->setWindowIcon(QPixmap(":/res/Coin0001.png"));
    this->setWindowTitle(QString("游戏"));

设置背景窗口图片

重写 p a i n t E v e n t paintEvent paintEvent即可

void playScence::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QPixmap map;
    map.load(":/res/OtherSceneBg.png");
    painter.drawPixmap(0,0,this->width(),this->height(),map);
    map.load(":/res/Title.png");
    painter.drawPixmap( (this->width()-map.width())*0.5,30,map);
}

设置金币后面的透明背景

这个也简单,两个 f o r for for循环搞定,用 L a b e l Label Label装透明图片放到对应位置去

//显示金币背景图案
    Coin *a[5][5];
    for(int i=0;i<4;i++)
    for(int j=0;j<4;j++)
    {
        QLabel *label = new QLabel;
        label->setGeometry(0,0,70,70);
        label->setParent(this);
        label->setPixmap(QPixmap(":/res/BoardNode(1).png"));
        label->move(122+i*70,200+j*70);

    }

设置金币类

显然这个金币要实现点击翻转的效果,我们单独写一个按钮类来满足需求

翻转特效通过不断切换图片来实现，使用 Q T i m e r QTimer QTimer定时器类即可

#ifndef COIN_H
#define COIN_H

#include <QWidget>
#include <QPushButton>
#include <QTimer>
class Coin : public QPushButton
{
    Q_OBJECT
public:
//    explicit Coin(QWidget *parent = nullptr);
    void setimg(QString w);
    Coin(QString);//构造函数
    void reverse();//翻转函数
    QString now;//当前图片路径
    int num,val;//num是当前第几张图片,val是控制切换(上下)图片
    QTimer *time;

signals:

};

#endif // COIN_H

下面去实现功能

#include "coin.h"
#include <QPushButton>
#include <QPainter>
#include <QTimer>
#include <QDebug>
#include <QString>
//Coin::Coin(QWidget *parent) : QPushButton(parent)
//{

//}

void Coin::setimg(QString w)//设置图片
{
    QPixmap map;
    bool YES = map.load(w);
    this->setFixedSize(map.width(),map.height());
    this->setStyleSheet("QPushButton{border:0px;}");
    this->setIcon(map);
    this->setIconSize(QSize(map.width(),map.height()) );
}

Coin::Coin(QString str)//设置固定背景
{
    this->now = str;//设置当前的路径
    if( str==":/res/Coin0001.png" )  this->num = 1,this->val = 1;
    else    this->num = 8, this->val = -1;
    setimg(str);//设置图片

    time = new QTimer();//设置定时器
    connect(time,&QTimer::timeout,[=](){
        this->num+=this->val;
        QString w = QString(":/res/Coin000%1.png").arg(this->num);
        setimg(w);
        if( this->num==8 )//到了最后一张,val=-1,下一次往前翻图片
        {
            this->val = -1; time->stop();
        }
        if( this->num==1 )//到了第一张，下次往后翻转
        {
            this->val = 1; time->stop();
        }
    });
}

void Coin::reverse()
{
    time->start(100);//启动定时器即可
}

点击金币后实现上下左右的翻转

for(int i=0;i<4;i++)
    for(int j=0;j<4;j++)
    {
        connect(a[i][j],&Coin::clicked,[=](){
            a[i][j]->reverse();
            if( i-1>=0 )    a[i-1][j]->reverse();
            if( i+1<4 ) a[i+1][j]->reverse();
            if( j-1>=0 )    a[i][j-1]->reverse();
            if( j+1<4 ) a[i][j+1]->reverse();
        });
    }