原始碼分享-Qt利用動畫類實現酷酷的圖片展示
阿新 • • 發佈：2019-02-03
QPropertyAnimation(動畫類)
本原始碼主要用到的類↑,利用其可實現各種關於控制元件的動畫
好的,廢話不多說,上效果圖
大家看到圖片這樣的排列方式也能大概明白他的動畫效果是怎樣的了吧,沒錯,只要按下">"按鈕就可以將第一張圖片放大並移動到第二張的位置而第二張則放大並移動到第三張的位置,第三張,也就是主要展示的圖片了,對於它的操作與前面相反,是縮小並移動到第四張的位置,第四張灰到第五張處,第五張屁顛屁顛的補到第一張的位置.
無碼不歡,來人,上碼!
<pre code_snippet_id="1572338" snippet_file_name="blog_20160201_1_8860195" name="code" class="cpp">mainwindow.cpp:
原始碼下載地址:http://pan.baidu.com/s/1nu3Xyhb#include "mainwindow.h" #include <QPropertyAnimation> #include <QDebug> #include <QApplication> #include <QDesktopWidget> #include <QPixmap> #define num 350 MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) { this->resize(500,600); w=QApplication::desktop()->availableGeometry().width(); h=QApplication::desktop()->availableGeometry().height(); w=500;//放到移動端時刪除此句和下一句 h=600; //按比例計算label大小 位置↓ int x=(w-(2.5/11*h))/2; int y=(3.0/11)*h; double wh=2.5/11*h; r3.setRect(x,y,wh,wh); label3=new QLabel(this); label3->setGeometry(x,y,wh,wh); label3->setPixmap(QPixmap(QString(":/image/007-2.png"))); label3->setScaledContents(true); qDebug()<<x<<y<<wh; //按比例計算label大小 位置↓ y=wh/8.0+y; x=x-(wh-(wh/8.0*2))/2.0; wh=wh-(wh/8.0*2); qDebug()<<x<<y<<wh; r2.setRect(x,y,wh,wh); label2=new QLabel(this); label2->setGeometry(x,y,wh,wh); label2->setPixmap(QPixmap(QString(":/image/007-1.png"))); label2->setScaledContents(true); r4.setRect(x+2.5/11*h,y,wh,wh); label4=new QLabel(this); label4->setGeometry(x+2.5/11*h,y,wh,wh); label4->setPixmap(QPixmap(QString(":/image/007-3.png"))); label4->setScaledContents(true); qDebug()<<x<<y<<wh; //按比例計算label大小 位置↓ y=wh/8.0+y; x=x-(wh-(wh/8.0*2))/2.0; wh=wh-(wh/8.0*2); qDebug()<<x<<y<<wh; r1.setRect(x,y,wh,wh); label1=new QLabel(this); label1->setGeometry(x,y,int(wh),int(wh)); label1->setPixmap(QPixmap(QString(":/image/007-4.png"))); label1->setScaledContents(true); r5.setRect(x+2.5/11*h+2.5/11*h*0.8,y,wh,wh); label5=new QLabel(this); label5->setGeometry(x+2.5/11*h+2.5/11*h*0.8,y,(int)wh,(int)wh); label5->setPixmap(QPixmap(QString(":/image/007-5.png"))); label5->setScaledContents(true); label2->raise(); label4->raise(); label3->raise(); //設定Button的位置 btn_left= new QPushButton("<",this); btn_left->setGeometry(r3.x(),r3.y()+r3.height()*1.3,r3.height()/3.0,r3.height()/3.0); btn_right= new QPushButton(">",this); btn_right->setGeometry(r3.x()+r3.height()*2/3.0,r3.y()+r3.height()*1.3,r3.height()/3.0,r3.height()/3.0); connect(btn_left,SIGNAL(clicked(bool)),this,SLOT(move_left())); connect(btn_right,SIGNAL(clicked(bool)),this,SLOT(move_right())); mainPhoto=3; } MainWindow::~MainWindow() { } void MainWindow::move_right()//動畫開始 { mainPhoto+=1; qDebug()<<"move_left"; moveaction=new QPropertyAnimation(label1,"geometry");//設定移動物件 moveaction->setDuration(num);//完成時間 moveaction->setStartValue(r1);//開始位置 moveaction->setEndValue(r5);//結束位置 moveaction->setEasingCurve(QEasingCurve::Linear);//設定移動方式 moveaction->start();//開始移動 moveaction2=new QPropertyAnimation(label5,"geometry"); moveaction2->setDuration(num); moveaction2->setStartValue(r5); moveaction2->setEndValue(r4); moveaction2->setEasingCurve(QEasingCurve::Linear); moveaction2->start(); moveaction3=new QPropertyAnimation(label4,"geometry"); moveaction3->setDuration(num); moveaction3->setStartValue(r4); moveaction3->setEndValue(r3); moveaction3->setEasingCurve(QEasingCurve::Linear); moveaction3->start(); moveaction4=new QPropertyAnimation(label3,"geometry"); moveaction4->setDuration(num); moveaction4->setStartValue(r3); moveaction4->setEndValue(r2); moveaction4->setEasingCurve(QEasingCurve::Linear); moveaction4->start(); moveaction5=new QPropertyAnimation(label2,"geometry"); moveaction5->setDuration(num); moveaction5->setStartValue(r2); moveaction5->setEndValue(r1); moveaction5->setEasingCurve(QEasingCurve::Linear); moveaction5->start(); QRect rect(r5); r5=r4; r4=r3; r3=r2; r2=r1; r1=rect; //以下用作調整label顯示次序 if(mainPhoto>=6) mainPhoto=1; if(mainPhoto==4) { qDebug()<<"4"; label5->raise(); label3->raise(); label4->raise(); }else if(mainPhoto==5) { qDebug()<<"5"; label1->raise(); label4->raise(); label5->raise(); }else if(mainPhoto==1) { qDebug()<<"1"; label2->raise(); label5->raise(); label1->raise(); }else if(mainPhoto==2) { qDebug()<<"2"; label3->raise(); label1->raise(); label2->raise(); }else if(mainPhoto==3) { qDebug()<<"3"; label4->raise(); label2->raise(); label3->raise(); } } void MainWindow::move_left()//動畫開始 { mainPhoto-=1; qDebug()<<"move_right"; moveaction=new QPropertyAnimation(label1,"geometry"); moveaction->setDuration(num); moveaction->setStartValue(r1); moveaction->setEndValue(r2); moveaction->setEasingCurve(QEasingCurve::Linear); moveaction->start(); moveaction2=new QPropertyAnimation(label5,"geometry"); moveaction2->setDuration(num); moveaction2->setStartValue(r5); moveaction2->setEndValue(r1); moveaction2->setEasingCurve(QEasingCurve::Linear); moveaction2->start(); moveaction3=new QPropertyAnimation(label4,"geometry"); moveaction3->setDuration(num); moveaction3->setStartValue(r4); moveaction3->setEndValue(r5); moveaction3->setEasingCurve(QEasingCurve::Linear); moveaction3->start(); moveaction4=new QPropertyAnimation(label3,"geometry"); moveaction4->setDuration(num); moveaction4->setStartValue(r3); moveaction4->setEndValue(r4); moveaction4->setEasingCurve(QEasingCurve::Linear); moveaction4->start(); moveaction5=new QPropertyAnimation(label2,"geometry"); moveaction5->setDuration(num); moveaction5->setStartValue(r2); moveaction5->setEndValue(r3); moveaction5->setEasingCurve(QEasingCurve::Linear); moveaction5->start(); QRect rect(r1); r1=r2; r2=r3; r3=r4; r4=r5; r5=rect; //以下用作調整label顯示次序 if(mainPhoto<=0) mainPhoto=5; if(mainPhoto==4) { qDebug()<<"4"; label5->raise(); label3->raise(); label4->raise(); }else if(mainPhoto==5) { qDebug()<<"5"; label1->raise(); label4->raise(); label5->raise(); }else if(mainPhoto==1) { qDebug()<<"1"; label2->raise(); label5->raise(); label1->raise(); }else if(mainPhoto==2) { qDebug()<<"2"; label3->raise(); label1->raise(); label2->raise(); }else if(mainPhoto==3) { qDebug()<<"3"; label4->raise(); label2->raise(); label3->raise(); } }