概述

  Qt动画模块可实现许多动画效果。其中,QPropertyAnimation Class 是一个控制动画效果的类,诞生自 Qt 4.6 版本。
  本文使用QPropertyAnimation类小小实验一下子窗口的渐入渐出效果。

代码

MainWindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include 

class QLabel;
class QListWidget;

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow( QWidget *parent = 0 );
    ~MainWindow();

protected slots:
    void slotBtnEnter(); //点击“Enter”按钮,新增一条子窗口
    void slotBtnLeave(); //点击“Leave”按钮,删除当前选中的子窗口
    void slotLeave();

private:
    void InitWidget();

private:
    QLabel* m_pLbTest1; //初始化用
    QLabel* m_pLbTest2;
    QLabel* m_pLbTest3;
    QLabel* m_pLbTest4;

    QListWidget* m_pListWidget;
};

#endif // MAINWINDOW_H

MainWindow.cpp

#include "mainwindow.h"

#include 
#include 
#include 
#include 
#include 
#include 
#include 

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    setWindowTitle( "Test Qt4 Move Animation" );
    setFixedSize( 800, 600 );

    InitWidget();
}

MainWindow::~MainWindow()
{

}

void MainWindow::InitWidget()
{
    //Label
    m_pLbTest1 = new QLabel;
    m_pLbTest2 = new QLabel;
    m_pLbTest3 = new QLabel;
    m_pLbTest4 = new QLabel;
    m_pLbTest1->setScaledContents( true );
    m_pLbTest2->setScaledContents( true );
    m_pLbTest3->setScaledContents( true );
    m_pLbTest4->setScaledContents( true );
    QPixmap pix1( ":/Locomotive.bmp" );
    m_pLbTest1->setPixmap( pix1 );
    m_pLbTest2->setPixmap( pix1 );
    m_pLbTest3->setPixmap( pix1 );
    m_pLbTest4->setPixmap( pix1 );

    //List Widget
    m_pListWidget = new QListWidget;
    m_pListWidget->setStyleSheet("QListWidget::Item{ padding-top:3px; padding-bottom:3px; height:60px;}");

    QListWidgetItem* pItem1 = new QListWidgetItem( m_pListWidget );
    m_pListWidget->addItem( pItem1 );
    m_pListWidget->setItemWidget( pItem1, m_pLbTest1 );

    QListWidgetItem* pItem2 = new QListWidgetItem( m_pListWidget );
    m_pListWidget->addItem( pItem2 );
    m_pListWidget->setItemWidget( pItem2, m_pLbTest2 );

    QListWidgetItem* pItem3 = new QListWidgetItem( m_pListWidget );
    m_pListWidget->addItem( pItem3 );
    m_pListWidget->setItemWidget( pItem3, m_pLbTest3 );

    QListWidgetItem* pItem4= new QListWidgetItem( m_pListWidget );
    m_pListWidget->addItem( pItem4 );
    m_pListWidget->setItemWidget( pItem4, m_pLbTest4 );

    //Buttons
    QPushButton* pBtnEnter = new QPushButton( "Enter" );
    QPushButton* pBtnLeave = new QPushButton( "Leave" );
    pBtnEnter->setFixedHeight( 30 );
    pBtnLeave->setFixedHeight( 30 );
    QHBoxLayout* pBtnLayout = new QHBoxLayout;
    pBtnLayout->addWidget( pBtnEnter );
    pBtnLayout->addWidget( pBtnLeave );

    //Main Layout
    QWidget* pCentralWidget = new QWidget;
    QVBoxLayout* pMainLayout = new QVBoxLayout;
    pMainLayout->addWidget( m_pListWidget );
    pMainLayout->addLayout( pBtnLayout );
    pCentralWidget->setLayout( pMainLayout );
    this->setCentralWidget( pCentralWidget );

    //Connects
    connect( pBtnEnter, SIGNAL( clicked() ), this, SLOT( slotBtnEnter() ) );
    connect( pBtnLeave, SIGNAL( clicked() ), this, SLOT( slotBtnLeave() ) );
}

void MainWindow::slotBtnEnter()
{
    QLabel* pCurWiget = new QLabel;
    pCurWiget->setScaledContents( true );
    QPixmap pix1( ":/Locomotive.bmp" );
    pCurWiget->setPixmap( pix1 );

    QListWidgetItem* pItem = new QListWidgetItem( m_pListWidget );
    m_pListWidget->addItem( pItem );
    m_pListWidget->setItemWidget( pItem, pCurWiget );
    m_pListWidget->setCurrentItem( pItem );

    QPropertyAnimation* pAnimation = new QPropertyAnimation( pCurWiget, "pos" );
    pAnimation->setDuration( 3000 );
    pAnimation->setStartValue( QPointF( -pCurWiget->width(), pCurWiget->pos().y() ) );
    pAnimation->setEndValue( QPointF( 0, pCurWiget->pos().y() ) );
    pAnimation->setEasingCurve( QEasingCurve::Linear );
    pAnimation->start();
}

void MainWindow::slotBtnLeave()
{
    QWidget* pCurWiget = m_pListWidget->itemWidget( m_pListWidget->currentItem() );
    if( !pCurWiget )
        return;

    QPropertyAnimation* pAnimation = new QPropertyAnimation( pCurWiget, "geometry" );
    pAnimation->setDuration( 3000 );
    pAnimation->setEndValue( QRectF( this->width(), pCurWiget->pos().y(), pCurWiget->width(), pCurWiget->height() ) );
    pAnimation->setEasingCurve( QEasingCurve::Linear );
    connect( pAnimation, SIGNAL( finished() ), this, SLOT( slotLeave() ) );
    pAnimation->start();
}

void MainWindow::slotLeave()
{
    m_pListWidget->takeItem( m_pListWidget->currentRow() );
}

效果展示

Qt4 动画之渐入、渐出_第1张图片