40.QT-QPropertyAnimationdong动画类使用

 

• 简述:qpropertyanimation (动画类,用来向qobject对象添加动画)

该类的继承框图如下所示:

 

1.qabstractanimation(所有动画的抽象基类)

该抽象类为qpropertyanimation提供了动画播放,暂停,停止,持续时间,循环周期等抽象函数.

其中常用的成员函数如下所示:

int   currentloop() const                   //获取当前动画已经循环了几个周期了

int   currenttime() const                     //获取当前动画已经启动了多少时间

void   setloopcount(int loopcount);           //设置动画循环次数,默认为1(表示动画运行1次就停止),如果为-1,则表示动画一直循环,直到调用stop()为止.

void  setdirection(direction direction);     //设置动画方向,默认为qabstractanimation::forward(表示从起始点到结束点),也可以设置为qabstractanimation::backward.

常用信号函数如下所示:

void   currentloopchanged(int currentloop);      //动画运行周期信号函数,当周期进行新的循环时,则会发出这个信号

void   finished();                    //当动画完成后,则会发出这个信号

void  statechanged(qabstractanimation::state newstate, qabstractanimation::state oldstate);   
 //当动画发生改变(停止/暂停/运行)时,则会发出这个信号, newstate表示动画改变后的状态, oldstate表示动画改变前的状态

void  directionchanged(qabstractanimation::direction newdirection);//当动画发生方向改变时,这会发出这个信号,

常用槽函数如下所示:

void  pause();                          //暂停动画

void  resume();                       //恢复动画

void  setcurrenttime(int msecs);   //直接更改当前动画的进度时间,可以通过currenttime()函数来获取改的值

void  setpaused(bool paused);   //和pause()类似,但是有个参数,如果paused为真则暂停动画,否则就是恢复动画

void  start(qabstractanimation::deletionpolicy policy = keepwhenstopped);   //启动动画
                                                     //默认参数为keepwhenstopped,表示停止动画时,保持当前状态
                                                     //如果改为deletewhenstopped,则表示停止动画时,自动删除


void  stop();               //停止动画

2.qvariantanimation (动画的多样类)

该qvariantanimation类主要是为qpropertyanimation类提供动画起始结束的位置,方向,运动等机制

该类常用函数如下所示:

void         setstartvalue(const qvariant &value);           //设置动画启动的位置
void         setendvalue(const qvariant &value);             //设置动画结束的位置
void         setduration(int msecs);                         //设置动画运行一次需要的时间,单位为毫秒

qeasingcurve         easingcurve() const;                     //返回easingcurve曲线的设置(easingcurve:可以设置动画运动曲线的动作)

void         seteasingcurve(const qeasingcurve &easing);       //设置动画运动时的easingcurve曲线

void         setkeyvalueat(qreal step, const qvariant &value);       //设置动画在不同时间帧时所在的位置
 //step(0~1): 时间帧,0表示为开始的帧,1表示结束的帧,0.5表示在中间的时间帧
 // value:表示对应的step时间帧所在的动画位置(比如设置抖动,则会用到该函数)

qvariant  keyvalueat(qreal step) const;      //返回step时间帧所在的动画位置

该类常用信号函数如下所示:

void         valuechanged(const qvariant &value);
                          //当运行的动画位置在改变时,则会发出这个信号

 

3.qpropertyanimation (用来向qobject对象添加动画属性)

该类的构造函数如下所示:

qpropertyanimation(qobject *target, const qbytearray &propertyname, qobject *parent = q_nullptr);
// target:要实现动画的目标对象
// propertyname:动画属性名称
// parent:该动画的父类,一般设为this

 

4.示例1-界面实现下降动画

效果如下:

ps:由于gif录制无法录制带阴影的界面,所以将界面阴影屏蔽掉了.

ps:如果动画启动失败,则看看父界面是否布局了.

代码如下:

void loginwindow::initanimation()                 //在构造函数里调用该函数
{
    downanimation = new qpropertyanimation(this,"geometry",this);
    downanimation->setduration(300);             //设置动画时间
    qdesktopwidget* desktop = qapp->desktop();
    downanimation->setstartvalue(qrect((desktop->width() -this->width())/2,(desktop->height() -this->height())/2,this->width(),0));        //起始位置
    downanimation->setendvalue(qrect((desktop->width() -this->width())/2,(desktop->height() -this->height())/2,this->width(),this->height()));            //结束位置
     downanimation->start();              //启动动画
}

这个我们只是实现单个动画,如果该动画后面还要实现其它动画,则需要信号槽机制来实现.

 

5.示例2-通过信号槽机制实现多个动画串行运行

启动界面时,通过下降动画结束后,再来继续实现logo向上浮的动画(参考的qq启动画面)

效果如下所示:

代码如下:

//设置图标
void loginwindow::seticonpix(qlabel *l,const qstring & name,qsize size)
{
    qpixmap pix(name);
    pix = pix.scaled(size,qt::ignoreaspectratio);
    l->setpixmap(pix);
    l->setfixedsize(size);
}
//初始化动画
void loginwindow::initanimation()
{
    qsize size(110,110);
    logo = new qlabel(this);
    seticonpix(logo,":logo",size);                //设置logo图标
    logo->move(this->width()/2-size.width()/2,142);    
    logo->hide();                                  //先隐藏

    //设置图标上浮动画
    logoanimation = new qpropertyanimation(logo,"geometry",this);
    logoanimation->setduration(200);
    logoanimation->setstartvalue(qrect(this->width()/2-size.width()/2,142,100,100));
    logoanimation->setendvalue(qrect(this->width()/2-size.width()/2,107,100,100));

     //设置界面下降动画
    downanimation = new qpropertyanimation(this,"geometry",this);
    downanimation->setduration(300);
    qdesktopwidget* desktop = qapp->desktop();
    downanimation->setstartvalue(qrect((desktop->width() -this->width())/2,(desktop->height() -this->height())/2,this->width(),0));
    downanimation->setendvalue(qrect((desktop->width() -this->width())/2,(desktop->height() -this->height())/2,this->width(),this->height()));
    downanimation->start();

    //连接槽函数
    connect(downanimation,signal(finished()),this,slot(downanimationonfinished()));
}

//槽函数,用来启动图标上浮动画
void loginwindow::downanimationonfinished()
{
    logo->show();
    logoanimation->start();
}

6.示例3-界面关闭时实现居中关闭

效果如下:

 

ps：gif录制的帧数不达标,有点延迟.

关闭居中的代码如下:

//初始化动画
void loginwindow::initanimation()
{
  //... ... 省略其它动画初始化
  closeanimation = new qpropertyanimation(this,"geometry",this);
  closeanimation->setduration(150);

  connect(ui->title_close,signal(clicked()),this,slot(closeanimationonstart()));
  connect(closeanimation,signal(finished()),this,slot(close()));
};

//关闭槽函数,由于界面随时会在任意xy位置,所以需要在关闭时,再来初始化closeanimation的起始和结束的动画位置
void loginwindow::closeanimationonstart()
{
    closeanimation->setstartvalue(qrect(this->geometry()));
    closeanimation->setendvalue(qrect(this->x(),this->y()+this->height()/4-2,this->width(),4));
    closeanimation->start();
}

 

未完待续,接下来讲qparallelanimationgroup并行动画组,来实现一串动画并行运行.