持续时间长于更新时的Qt进度条动画
我正在定制Qt5 Quick 2 QML进度条。当进度更新很少且很大时,进度条会以块状方式跳转。为了解决这个问题,我想我应该向值动画添加一个简单的行为,以便它平滑地移动到下一个值。这非常有效,除非动画持续时间大于更新之间的时间间隔。然后,行为是更新移动非常缓慢,当它们停止时,它们似乎会加速并尝试完成 以下代码增加进度条,使其每秒重复一次。当行为持续时间小于计时器间隔时,它工作,但当持续时间较长时,它失败 我希望设置一个值,以停止先前执行的行为动画并继续执行下一个,而不是同时重叠持续时间长于更新时的Qt进度条动画,qt,animation,qml,Qt,Animation,Qml,我正在定制Qt5 Quick 2 QML进度条。当进度更新很少且很大时,进度条会以块状方式跳转。为了解决这个问题,我想我应该向值动画添加一个简单的行为,以便它平滑地移动到下一个值。这非常有效,除非动画持续时间大于更新之间的时间间隔。然后,行为是更新移动非常缓慢,当它们停止时,它们似乎会加速并尝试完成 以下代码增加进度条,使其每秒重复一次。当行为持续时间小于计时器间隔时,它工作,但当持续时间较长时,它失败 我希望设置一个值,以停止先前执行的行为动画并继续执行下一个,而不是同时重叠 Timer {
Timer
{
interval: 200; running:true; repeat:true
onTriggered:
{
if(mybar.doUpdate)
mybar.value = (mybar.value + 0.2 ) % 1
}
}
ProgressBar
{
id: mybar
value: .5
property bool doUpdate: true
Behavior on value
{
NumberAnimation
{
duration: 1000
easing.type: Easing.InOutQuad
}
}
MouseArea{
anchors.fill:parent
onClicked:
{
parent.doUpdate = !parent.doUpdate
console.log((!parent.doUpdate ? "Stop" : "Go") + " Now!")
}
}
}
我不能肯定我理解你的预期行为,但我认为有两个问题。首先,您需要使用一个不设置动画的中间值,以便以后可以引用它。然后需要一种关闭动画的方法,以便可以立即跳转到某个值。像这样的方法应该会奏效:
// This holds the current progress value without animating
property real tempVal: 0.5
// This controls whether or not to animate
property bool doAnimate: true
Timer
{
interval: 200; running:true; repeat:true
onTriggered:
{
if(mybar.doUpdate)
{
// Turn off the animation
doAnimate = false;
// Reset the progress bar to the current expected value
mybar.value = Qt.binding(function() { return tempVal });
// Turn on the animation again
doAnimate = true;
// Animate up to this new value
tempVal = (tempVal + 0.2 ) % 1
}
}
}
ProgressBar
{
id: mybar
// Bind the progress bar to our secondary value
value: tempVal
property bool doUpdate: true
Behavior on value
{
// Control animation with this flag
enabled: doAnimate
NumberAnimation
{
duration: 1000
easing.type: Easing.InOutQuad
}
}
MouseArea{
anchors.fill:parent
onClicked:
{
parent.doUpdate = !parent.doUpdate
console.log((!parent.doUpdate ? "Stop" : "Go") + " Now!")
}
}
}