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

需要说明的是：
本项目是基于B站中的戳这视频讲解而做的哦，有问题各位大神勿喷。

1、项目的基本配置

创建Qt项目，选择基类为MianWindow并勾选创建界面，点击完成，项目创建成功。接着添加资源文件，主要包括：开始、返回、背景等的图片以及相应的音效等，添加资源的具体步骤较为简单，这里就不赘述。

2、游戏的主场景的配置

2.1创建菜单栏
打开.ui文件，创建*“开始”菜单栏，以及它的子项“退出”*，并删除自带的工具栏与状态栏，因为后序步骤用不到的。创建的结果如下：
在这里插入图片描述
2.2主场景的基本配置
接着，回到主场景的.cpp文件，创建主场景的大小、图标以及窗口的标题。代码及结果如下：

    this->setFixedSize(320,588);

    this->setWindowIcon( QPixmap(":/res/Coin0001.png"));

    this->setWindowTitle("玩一玩，爽得很");

在这里插入图片描述
2.3绘制主场景的背景
将先前定义的退出按钮，进行实现并将背景图像加入。不然看着很难受。加入paintEvent画背景，代码为：

 connect(ui->quitaction,&QAction::triggered,[=](){
    
    
        this->close();
});
///这是分开的/
void MainWindow::paintEvent(QPaintEvent *)
{
    
    
    QPainter painter(this);
    QPixmap pix;
    pix.load(":/res/OtherSceneBg.png");
    painter.drawPixmap(0,0,this->width(),this->height(),pix);

    pix.load(":/res/Title.png");
    painter.drawPixmap(10,30,pix.width(),pix.height(),pix);

}

加入以后的确实好看了很多。
在这里插入图片描述
2.4创建开始按钮
接着就是建立“”开始游戏”按钮，并给其配置音效。这里就又需要增加一个MyPushButton.cpp文件了,专门用作按下按钮的实现。在该.cpp文件中，注释掉以前的构造函数，自己新建一个构造函数，实现对不同图片按下效果的显示。在添加音效的时候需要注意的是：在.pro文件中增加multimedia，不然音效头文件是显示不出来的…
音效的结果我太懒了，不拍视频展示了，“”开始游戏”按钮的代码以及结果如下：

MyPushButton::MyPushButton(QString normalImg, QString pressImg)
{
    
          
        normalImgPath = normalImg;
        pressedImgPath = pressImg;
        //创建QPixmap对象
        QPixmap pixmap;
        bool ret = pixmap.load(normalImgPath);
        if(!ret)
        {
    
    
            qDebug() << normalImg << "加载图片失败!";
        }
        this->setFixedSize( pixmap.width(), pixmap.height() );
        //设置不规则图片的样式表
        this->setStyleSheet("QPushButton{border:0px;}");
        this->setIcon(pixmap);
      this->setIconSize(QSize(pixmap.width(),pixmap.height()));
}

在这里插入图片描述
2.5增加开始按钮的特效
开始游戏按钮做好以后，接着给它增加一些特效，使用户点击后会有跳跃特效，增加用户体验。具体的做法是：首先在MyPushButton.h文件中增加Zoom1函数表示向下跳跃，增加zoom2函数表示向上跳跃，在.cpp文件中实现上述2个函数。实现上下跳跃的跳跃，需要用到一个头文件是#include<QPropertyAnimation>,zoom1具体的代码如下，与zoom1不同的是zoom2仅仅是位置上的不同罢了：

void MyPushButton::zoom1()
{
    
    
    QPropertyAnimation* animation = new QPropertyAnimation(this,"geometry");
    animation->setDuration(200);//时间间隔为200ms

    animation->setStartValue(QRect(this->x(),this->y(),this->width(),this->height()));

    animation->setEndValue(QRect(this->x(),this->y()+10,this->width(),this->height()));

    animation->setEasingCurve(QEasingCurve::OutBounce);//特效的跳跃效果

    animation->start();//开始执行特效
}

主场景最终的结果是：
在这里插入图片描述