QT翻金币小游戏实现（二）

3、选择关卡场景的配置

3.1选择关卡的创建
前面的步骤做好以后，就需要来到选择关卡界面。添加C++文件，新建一个类名为ChooseLevelScene，基类为QMainWindow的文件，这里建立QMainWindow文件是需要与前面主场景界面相同。在chooselevelScene.h文件中新建一个选择关卡场景的对象。然后就是设置延时0.5s进入选择关卡页面。具体的做法是：

connect(startBtn,&MyPushButton::clicked,[=](){
    
    
        startSound->play();
        startBtn->zoom1();
        startBtn->zoom2();

        QTimer::singleShot(500,this,[=](){
    
    
            this->hide();//主场景隐藏
            chooseScene->show();//选择关卡界面显示
        });

    });

结果是这样的：
在这里插入图片描述
3.2选择关卡的基本配置
很丑，没关系！！！继续重复之前的步骤，就是设置该窗口的大小、图标、名称等，然后就是绘制背景。代码很简单，结果如下：
3.3增加退出按钮
目前遇到一个问题就是，在选择关卡界面出来点击“X”才可以退出没不然就没有办法退出，所以增加一个退出界面，利用代码实现如下：

QMenuBar* bar = menuBar();
QMenu* statrMenu = menuBar()->addMenu("开始");
QAction* quitMenu = statrMenu->addAction("退出"); connect(quitMenu,&QAction::triggered,[=](){
    
    
        this->close();
    });

在这里插入图片描述
3.4增加返回按钮
退出按钮实现以后要实现，返回主场景界面，因此增加一个返回按钮。返回按钮有正常显示与点击后显示两种不同的效果，因此需要重写MyPushButton中的鼠标按下与鼠标释放事件。

void MyPushButton::mousePressEvent(QMouseEvent *e)
{
    
    
    if(pressImgPath!="")
    {
    
    
        QPixmap pix;
        bool ret = pix.load(pressImgPath);
        if(!ret)
        {
    
    
            qDebug()<<"图片加载失败了";
        }
        this->setFixedSize(pix.width(),pix.height());
        this->setStyleSheet("QPushButton{border:0px;}");
        this->setIcon(pix);
        this->setIconSize(QSize(pix.width(),pix.height()));
    }
    return QPushButton::mousePressEvent(e);
}

void MyPushButton::mouseReleaseEvent(QMouseEvent *e)
{
    
    
    if(normalImgPath!="")
    {
    
    
        QPixmap pix;
        bool ret = pix.load(normalImgPath);
        if(!ret)
        {
    
    
            qDebug()<<"图片加载失败了";
        }
        this->setFixedSize(pix.width(),pix.height());
        this->setStyleSheet("QPushButton{border:0px;}");
        this->setIcon(pix);
        this->setIconSize(QSize(pix.width(),pix.height()));
    }
    return QPushButton::mouseReleaseEvent(e);

}

3.5利用返回按钮进行场景的切换
接着在chooselevelscene.cpp中创建返回按钮，并利用connect函数连接，主场景与选择关卡界面的切换，这里选择延时500ms进行切换，具体代码与结果如下：

 MyPushButton * backBtn = new MyPushButton(":/res/BackButton.png",":/res/BackButtonSelected.png");
    backBtn->setParent(this);
    backBtn->move(this->width()-backBtn->width(),this->height()-backBtn->height());
    
connect(backBtn,&MyPushButton::clicked,[=](){
    
    
        QTimer::singleShot(500,this,[=](){
    
    
            this->hide();//选择关卡界面隐藏
            emit this->chooseSceneback();//这里定义了一个选择返回主场景的信号，触发以后就返回主界面，并且在主界面的界面需要显示出来。
      /*mianscene.cpp中的代码是这*/ 
      connect(chooseScene,&ChooseLevelScene::chooseSceneback,[=](){
    
    
        this->show();//主场景的页面显示
    });
        });

在这里插入图片描述
3.6增加关卡的背景图片
基本的界面以及按钮实现以后，就要在此界面中实现最重要的一个功能了，那就是选择关卡按钮。用一个for循环写一个矩阵出来，用到了取余与取整的关系，总共是20个关卡。比如X的位置就是i%4，当i=0，1，2，3，对4取余就是0，i=4,5,6,7,那么取余的结果就是1，其他类似。那么在Y的位置就是i/4,当i=0，1，2，3，对4取整就是他本身，i=4,5,6,7,那么取余的结果也是它本身，这样就实现了用一个for写一个矩阵。具体的代码以及结果如下：

for(int i=0;i<20;i++)
    {
    
    
        MyPushButton *levelMenu = new MyPushButton(":/res/LevelIcon.png");
        levelMenu->setParent(this);
        levelMenu->move(25+(i%4)*70,130+(i/4)*70);
    }

在这里插入图片描述
3.7增加关卡数
然后利用QLabel对每一个关卡进行贴标签。需要说明一下鼠标穿透事件：如果不设置的话，点不进去。原因是label覆盖在Levelmenu上，一点击具体的关卡数的时候，所有的点击事件都让label给吸收了，所以要增加鼠标穿透事件。代码与结果如下：

  QLabel *label = new QLabel;
        label->setParent(this);
        label->setFixedSize(levelMenu->width(),levelMenu->height());//让label的大小与levelMenu一样
        label->setText(QString::number(i+1));//关卡数字+1
        label->setAlignment(Qt::AlignHCenter|Qt::AlignVCenter);//设置居中 水平方向与垂直方向
        label->move(25+(i%4)*70,130+(i/4)*70);//与levelMenu的位置相同
        label->setAttribute(Qt::WA_TransparentForMouseEvents);//设置鼠标穿透事件

在这里插入图片描述

QT翻金币小游戏实现（二）

3、选择关卡场景的配置

猜你喜欢