所谓动画就是在一个时间段内的不同时间点有不同的状态,只要定义好这样状态,实现动画就是水到渠成的事情.当然做这件事情,最好用的就是状态机,点击这里查看Qt使用状态机实现动画效果实例。 不过,实现动画也有更简单的方法,Qt提供了QStateMachine类,应用该类可以快速的实现动画效果。 Qt动画三字诀:

第一决:QPropertyAnimation

QPropertyAnimation用于和QObject中的属性properties进行通信,比如QWidget的大小,位置坐标等。来看代码

1
2
3
4
5
6
7
8
9
10
QPropertyAnimation *animation = new
          QPropertyAnimation(myWidget,"geometry");
 
animation->setDuration(10000);
 
animation->setStartValue(QRect(0, 0, 100, 30));
 
animation->setEndValue(QRect(250, 250, 100, 30));
 
animation->start();

第一行创建的QPropertyAnimation对象关联了myWidget这个窗体的几何属性。后面的几句分别设置了这个动画的时长,起始坐标和结束坐标。剩下的事情就交改QProperAnimation去做就行了。然后调用start()启动它。没错,五行代码就完成了一个完成了一个自动从一个坐标点移动到另一个坐标点的窗体。下面我给出一个可以运行的代码,是一只小鸟从左下角移到右下角的一个小动画:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
#include <QApplication>
#include <QPushButton>
#include <QPropertyAnimation>
#include <QPixmap>
#include <QLabel>
int main(int argc,char *argv[])
{
  QApplication app(argc,argv);
  QWidget *w=new QWidget();
  w->resize(640,520);
 
  QPixmap birdimg=QPixmap("bird.png").scaled(45,30);
  QLabel *bird=new QLabel(w);
  bird->setPixmap(birdimg);
  /*
      也可以使用setText函数设置标签显示的文字
      bird->setText("Hello");
   */
  QPropertyAnimation *anim=new QPropertyAnimation(bird,"pos");
  anim->setDuration(3000);
  anim->setStartValue(QPoint(0, 520));
  anim->setEndValue(QPoint(580, 10));
  anim->start();
 
  w->show();
  return app.exec();
}

上面的例子使用了label的位置属性pos。当然你可以在自己的类里增加其它property的,比如让颜色在变,可以点击这里下载该代码.

第二决:setEasingCurve

上面那个例子中小鸟的移动是线性的,未免太单调了点。QPropertyAnimation中的void setEasingCurve (const QEasingCurve & easing)函数正是用于实现不同的曲率变化的,QEasingCurve可用的参数列表(包括函数曲线图)可在文档中查到 。将上面动画相关的代码部分改成:

1
2
3
4
5
6
7
8
9
10
11
QPropertyAnimation *anim=new QPropertyAnimation(bird,"pos");
 
anim->setDuration(2000);
 
anim->setStartValue(QPoint(0,360));
 
anim->setEndValue(QPoint(110,180));
 
anim1->setEasingCurve(QEasingCurve::OutBounce);
 
anim1->start();

注意,新增的第四句。是使动画效果变为弹跳效果,如果你对列表里已经有的曲线都不满意,你还可以继承QEasingCurve,实现你需要的效果。

第三决:QAnimationGroup

前面的例子是只有一个动画在运行,如果想多个动画一起运行的话,那就要用到动画组QAnimationGroup了。动画组分为两种分别为串行和并行,对应于QAnimationGroup的两个子类QSequentialAnimationGroup和QParallelAnimationGroup。其用法很简单:

1
2
3
4
5
6
7
8
9
QSequentialAnimationGroup group;
 
//QParallelAnimationGroup group;
 
group.addAnimation(anim1);
 
group.addAnimation(anim2);
 
group.start();

上面的代码,如果是串行的话,那么动画anim1运行之后,才会运行anim2。如果是并行的话,两个动画是同时运行的。如果加了动画组,那么单个anim1->start()就没必要再单独调用了,由动画组来管理。 下面是一个可运行的代码,演示一只小鸟和一头猪依次从客户区飞过:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
#include<QApplication>
#include<QPixmap>
#include<QLabel>
#include<QPropertyAnimation>
#include<QSequentialAnimationGroup>
#include<QParallelAnimationGroup>
 
int main(int argc,char *argv[])
{
  QApplication app(argc,argv);
  QWidget *w=new QWidget();
  w->resize(900,600);
 
  QLabel *bird=new QLabel(w);
  bird->setPixmap(QPixmap("bird.png").scaled(40,40));
 
  QPropertyAnimation *bfly=new QPropertyAnimation(bird,"pos");
  bfly->setDuration(3000);
  bfly->setStartValue(QPoint(0, 560));
  bfly->setEndValue(QPoint(860, 0));
  bfly->setEasingCurve(QEasingCurve::CosineCurve);
 
  QLabel *pig=new QLabel(w);
  pig->setPixmap(QPixmap("pig.png").scaled(40,40));
 
  QPropertyAnimation *pfly=new QPropertyAnimation(pig,"pos");
  pfly->setDuration(3000);
  pfly->setStartValue(QPoint(0, 0));
  pfly->setEndValue(QPoint(860, 560));
  pfly->setEasingCurve(QEasingCurve::OutBounce);
 
  QSequentialAnimationGroup group;
  //QParallelAnimationGroup group;
  group.addAnimation(bfly);
  group.addAnimation(pfly);
  group.start();
 
  w->show();
  return app.exec();
}

可以切换动画组的类型,使动画以并行方式运行.点击这里下载该代码.

http://blog.csdn.net/itjobtxq/article/details/8951665

QT动画介绍(有例子可以下载)的更多相关文章

  1. Qt动画效果的实现,QPropertyAnimation

    Qt动画架构中的主要类如下图所示: 动画框架由基类QAbstractAnimation和它的两个儿子QVariantAnimation和QAnimationGroup组成.QAbstractAnima ...

  2. Qt动画与Qt坐标小记

    Qt动画 转载自: <http://jingyan.baidu.com/article/154b46315757b628ca8f4116.html> 和  <http://blog. ...

  3. Qt动画框架The Animation Framework

    动画框架是Kinetic(运动)项目的一部分,它的目标是提供一中简单的方法创建动画的和流畅的GUI.借助Qt动画属性,可以提供非常自由的动画窗体组件和其他对象(QObjects).动画框架也能被用于图 ...

  4. android动画介绍之 自己定义Animation动画实现qq抖一抖效果

    昨天我们介绍了Animation的基本使用方法.小伙伴们了解的怎么样了?假设还没有了解过Animation的小伙伴能够看看这篇博客 android动画介绍--Animation 实现loading动画 ...

  5. android动画介绍之 自定义Animation动画实现qq抖一抖效果

    昨天我们介绍了Animation的基本用法.小伙伴们了解的怎么样了?如果还没有了解过Animation的小伙伴可以看看这篇博客 android动画介绍--Animation 实现loading动画效果 ...

  6. android动画介绍--Animation 实现loading动画效果

    Animation的使用方法并不难.这里简单的介绍一下使用方法. 先看效果图: 效果还是不错的吧. 下面来看看使用方法. 动画效果是通过Animation来实现的,一共有四种,分别为: AlphaAn ...

  7. {MySQL数据库初识}一 数据库概述 二 MySQL介绍 三 MySQL的下载安装、简单应用及目录介绍 四 root用户密码设置及忘记密码的解决方案 五 修改字符集编码 六 初识sql语句

    MySQL数据库初识 MySQL数据库 本节目录 一 数据库概述 二 MySQL介绍 三 MySQL的下载安装.简单应用及目录介绍 四 root用户密码设置及忘记密码的解决方案 五 修改字符集编码 六 ...

  8. [转]使用QT开发GoogleMap瓦片显示和下载工具

    第一节 之前做项目的时候经常遇到需要大量地图背景数据,然后没有数据被逼着去Google上下载瓦片数据在拼接成整张影像的工作,其实遥感影像晚上有很多可以下载到的,但是大部分是作为研究用的,作为GIS的背 ...

  9. 最新Burpsuite Pro v1.7.03 介绍和破解版下载

    0x00 介绍 Burp Suite 是用于攻击web 应用程序的集成平台.它包含了许多工具,并为这些工具设计了许多接口,以促进加快攻击应用程序的过程.所有的工具都共享一个能处理并显示HTTP 消息, ...

随机推荐

  1. 12.06 JavaScript

    任务 掌握JavaScript基础知识,能够使用JavaScript编写一些复杂度不大的交互功能. 任务: JavaScript基础 做完任务一的时候深深地感觉到自己的基础非常的薄弱,在这里再次感谢一 ...

  2. LuCI探究(转)

    原文链接 : http://www.cnblogs.com/gnuhpc/archive/2013/08/31/3293643.html 1. 多语言 1)检查: opkg list | grep l ...

  3. ArcMAp对线要素进行平滑处(打断)

    一:工具简单介绍 -- ArcMAp10.1的高级编辑工具中提供了对线/面要素进行概括/平滑处理的工具. 概括工具.平滑工具分别例如以下:(首先得开启编辑状态 --- 才干够对要素的属性进行更改).选 ...

  4. 关于typedef之四种用途 和 两个陷进

    typedef用来声明一个别名,typedef后面的语法,是一个声明.本来笔者以为这里不会产生什么误解的,但结果却出乎意料,产生误解的人 不在少数.罪魁祸首又是那些害人的教材.在这些教材中介绍type ...

  5. Img垂直居中

    IMG垂直居中问题 2011-02-22 10:51:00|  分类: CSS |  标签:垂直居中  div  align  img  vertical  |举报|字号 订阅    转载来自:htt ...

  6. HTML静态网页(css样式表)

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/    此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...

  7. BZOJ 3479: [Usaco2014 Mar]Watering the Fields( MST )

    MST...一开始没注意-1结果就WA了... ---------------------------------------------------------------------------- ...

  8. poj 1041 John's trip 欧拉回路

    题目链接 求给出的图是否存在欧拉回路并输出路径, 从1这个点开始, 输出时按边的升序输出. 将每个点的边排序一下就可以. #include <iostream> #include < ...

  9. HTML+CSS笔记 CSS中级 一些小技巧

    水平居中 行内元素的水平居中 </a></li> <li><a href="#">2</a></li> &l ...

  10. 汇编语言学习——第二章 寄存器(CPU工作原理)

    1.一个典型的CPU由运算器.控制器.寄存器等器件组成,这些器件靠内部总线相连. 区别: 内部总线实现CPU内部各个器件之间的联系. 外部总线实现CPU和主板上其它器件的联系. 8086CPU有14个 ...