QT动画介绍(有例子可以下载)

所谓动画就是在一个时间段内的不同时间点有不同的状态,只要定义好这样状态,实现动画就是水到渠成的事情.当然做这件事情,最好用的就是状态机,点击这里查看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

时间: 2024-08-03 07:08:44

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

Qt动画与Qt坐标小记

Qt动画 转载自: <http://jingyan.baidu.com/article/154b46315757b628ca8f4116.html> 和  <http://blog.csdn.net/syzobelix/article/details/9377863> Qt动画架构中的主要类如下图所示: 动画框架由基类QAbstractAnimation和它的两个子类QVariantAnimation和QAnimationGroup组成. QAbstractAnimation是所有

Qt动画架构中的主要类

Qt动画架构中的主要类如下图所示: 动画框架由基类QAbstractAnimation和它的两个儿子QVariantAnimation和QAnimationGroup组成.QAbstractAnimation是所有动画类的祖宗.它包含了所有动画的基本属性.比如开始,停止和暂停一个动画的能力.它也可以接收时间改变通知. 动画框架又进一步提供了QProertyAnimation类.它继承自QVariantAnimation并对某个Qt属性(它须是Qt的"元数据对象系统"的一部分,见http

创意无限!一组网页边栏过渡动画【附源码下载】

今天我们想与大家分享另一套过渡效果.这一次,我们将探讨如何实现侧边栏的过渡动画,就像我们已经在多级推出菜单中使用的.我们的想法是,以细微的过渡动画显示一些隐藏的侧边栏,其余的内容也是.通常侧边栏滑入,把其他内容推到一边.这个可过程中可以加入很多微妙而奇特的效果,而今天这篇文章能够给你一些启示. 温馨提示:为保证最佳的效果,请在 IE10+.Chrome.Firefox 和 Safari 等现代浏览器中浏览. 立即下载      在线演示 因为我们希望能够在一个页面上展现所有的效果,因此我们示例的

详解Qt动画框架(2)--- 实现网易云音乐tag切换

在详解Qt的动画框架(一)介绍了关于Qt动画框架一些基础知识,在这一节中,将会实际的看到有关与动画框架的实现,该案例主要实现的具体是网易云音乐tag的切换,网易云音乐中的切换如图所示: 本文介绍的方法也可以达到这种切换的简易效果. 设计动画框架 首先我们需要设计对于动画框架,其需要的动画效果是什么?对于上图,我们需要的是三个tag可以不停的切换,可以抽象为左移以及右移,即一个tag从一个矩形区域,移动到另外的矩形区域,那么对于Tag的承载体选为什么较为合适呢?因为我们仅仅只需要图片的显示,因此Q

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

第一节 之前做项目的时候经常遇到需要大量地图背景数据,然后没有数据被逼着去Google上下载瓦片数据在拼接成整张影像的工作,其实遥感影像晚上有很多可以下载到的,但是大部分是作为研究用的,作为GIS的背景图或者三维可视化的基础背景数据需要大量的处理工作,而google瓦片数据只要拼接好就可以用,很方便,就是下载量太大会被google封ip一段时间,需要谨慎. 之前用很多第三方的软件下载,很方便,但是去年google换掉接口以后很多软件没法用了,然后就欲哭无泪了.现在突然有时间和精力了,顺便想学习一

Qt动画窗口,Qt之对话框消失动画

在讲解代码之前,先来认识几个概念 QPropertyAnimation:属性动画,可以参考qt 窗口动画 QGraphicsOpacityEffect:窗口透明度设置类,继承自QGraphicsEffect QGraphicsDropShadowEffect:窗口阴影,继承自QGraphicsEffect QGraphicsBlurEffect:滤镜,继承自QGraphicsEffect QGraphicsColorizeEffect:着色,继承自QGraphicsEffect http://w

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

0x00 介绍 Burp Suite 是用于攻击web 应用程序的集成平台.它包含了许多工具,并为这些工具设计了许多接口,以促进加快攻击应用程序的过程.所有的工具都共享一个能处理并显示HTTP 消息,持久性,认证,代理,日志,警报的一个强大的可扩展的框架. 0x01 特点: 1 2 3 4 5 6 7 8 9 10 11 1.Target(目标)——显示目标目录结构的的一个功能 2.Proxy(代理)——拦截HTTP/S的代理服务器,作为一个在浏览器和目标应用程序之间的中间人,允许你拦截,查看,

转:Maven介绍(创建工程项目以及下载所需要的jar包)

http://blog.csdn.net/guanghua2009/article/details/6644111 目前我还不太会用maven,慢慢学吧 目前就是用来下载自己要的jar包,先根据这篇转载的文章新建一个工程,然后修改pom.xml,然后把cmd拷贝到maven新建的工程的根目录下,运行命令:mvn compile,就会下载你想要的jar包,或者直接运行mvn package,你就能得到一个war包,把里面WEB-INF/lib的jar包拷贝出来就是你想要的了 至于maven下载下来

令人惊叹的HTML5动画及源码分析下载

HTML5非常酷,利用HTML5制作动画简直让我们忘记了这世界上还有flash的存在.今天我们要分享的一些HTML5动画都还不错,有些动画设计还是挺别出心裁的.另外,每一款HTML5动画都提供源代码下载,并且我们对源码作一些简单的分析. HTML5可爱的404页面动画 很逗的机器人 利用HTML5绘制的机器人,还会动哦.你可以将它作为一个富有创意的404页面. 核心CSS3代码: @-webkit-keyframes move { 0%, 100% { -webkit-transform: ro