Qt动画框架：QEasingCurve（缓和曲线）

一、描述

缓和曲线描述了一个函数，该函数控制 0 和 1 之间的插值速度应该如何。QEasingCurve 类通常与 QVariantAnimation 和 QPropertyAnimation 类结合使用。

使用 QPropertyAnimation 时，关联的缓和曲线将用于控制 startValue 和 endValue 之间的插值进度：

    QPropertyAnimation animation;
    animation.setStartValue(0);
    animation.setEndValue(1000);
    animation.setDuration(1000);
    animation.setEasingCurve(QEasingCurve::InOutQuad);

二、部分成员函数

1、void addCubicBezierSegment(const QPointF &c1, const QPointF &c2, const QPointF &endPoint)

添加三次贝塞尔样条线段以定义自定义缓和曲线。仅当 type() 为 QEasingCurve::BezierSpline 时才适用。请注意，样条曲线隐式地从 (0.0, 0.0) 开始，必须在 (1.0, 1.0) 结束才能成为有效的缓和曲线。c1 和 c2 是用于绘制曲线的控制点。endPoint 是曲线的端点。

2、qreal amplitude() 

返回振幅。 这不适用于所有曲线类型。它仅适用于反弹和弹性曲线，即type() 为：

• QEasingCurve::InBounce
• QEasingCurve::OutBounce
• QEasingCurve::InOutBounce
• QEasingCurve::OutInBounce
• QEasingCurve::InElastic
• QEasingCurve::OutElastic
• QEasingCurve::InOutElastic
• QEasingCurve::OutInElastic

3、QEasingCurve::EasingFunction customType() 

返回指向自定义缓和曲线的函数指针。如果 type() 不返回 QEasingCurve::Custom（自定义曲线），则此函数将返回 0。

QEasingCurve::EasingFunction是一个函数指针，类似这样：

qreal myEasingFunction(qreal progress);

4、qreal overshoot() 

返回超调量。仅适用于 type() 为：

• QEasingCurve::InBack
• QEasingCurve::OutBack
• QEasingCurve::InOutBack
• QEasingCurve::OutInBack

5、qreal period() 

返回周期。仅适用于 type() 为：

• QEasingCurve::InElastic
• QEasingCurve::OutElastic
• QEasingCurve::InOutElastic
• QEasingCurve::OutInElastic

6、void setCustomType(QEasingCurve::EasingFunction func)

设置用户在函数 func 中定义的自定义缓和曲线。该函数签名是 qreal myEasingFunction(qreal progress)，其中 progress 和返回值被认为是在 0 和 1 之间归一化的。（在某些情况下，返回值可能超出该范围）调用此函数后 type() 将 返回 QEasingCurve::Custom。func 不能为零。

7、QList<QPointF> toCubicSpline() 

返回定义自定义缓和曲线的三次贝塞尔样式。如果缓和曲线没有自定义贝塞尔缓和曲线，则列表为空。

8、qreal valueForProgress(qreal progress) 

在运行时返回缓和曲线的有效进度。虽然进度必须介于 0 和 1 之间，但返回的有效进度可以超出这些范围。例如，QEasingCurve::InBack 将在函数的开头返回负值。

三、示例

    QPropertyAnimation * animation = new QPropertyAnimation(ui->w, "widgetWidth");
    animation->setDuration(3000);
    animation->setStartValue(100);
    animation->setEndValue(700);
    animation->setEasingCurve(QEasingCurve::OutBounce);
    animation->start(QAbstractAnimation::DeleteWhenStopped);//设置播放完了之后animation清除

这里给动画设置了缓和曲线：QEasingCurve::OutBounce

查qt帮助文档这曲线长这样：

在工程里添加charts模块，添加一个曲线图，记录一下动画属性的变化过程并绘制成图表，来看看属性的变化曲线。

    connect(animation,&QPropertyAnimation::valueChanged,this,&Widget::animationChange);

动画属性变化时会发送 valueChanged() 信号，收到此信号时记录此时的动画属性。

void Widget::animationChange(QVariant value)
{
    ++time;
    list.append(QPointF(time,value.toInt()));
}

最后绘制曲线：

    ui->widget->chart()->deleteLater();

    QSplineSeries *series = new QSplineSeries();
    series->append(list);

    QChart *chart = new QChart();
    chart->legend()->hide();
    chart->addSeries(series);
    chart->createDefaultAxes();
    chart->axes(Qt::Vertical).first()->setRange(0, 700);
    chart->axes(Qt::Horizontal).first()->setRange(0, time);

    ui->widget->setChart(chart);

效果：

把窗口拉窄一点看得清楚：

    

两个曲线一模一样的。

上面设置label宽度从100变到700，变化了600次，在setWidgetWidth()中添加打印信息可知setWidgetWidth()是被调用了600次，但是valueChanged信号只发送了173次，也就是说不是属性每次变化都会发送valueChanged信号。

上面的代码：https://download.csdn.net/download/kenfan1647/13131878