Делаю счетчик на экране, который должен показывать произвольное число. Для отрисовки цифр используется картинка в виде вертикальной ленты, на которой нанесены цифры 0-9. Цифры на счетчике должны отображаться с анимацией прокрутки.
Для дальнейшей доработки счетчика (нужно будет сделать специальную анимацию для перехода через 0 и 9, т.е. счетчик должен будет уметь прокрутиться от 2 до 8 как 2-1-0-9-8, а не как 2-3-4-5-6-7-8) мне нужно знать с какой предыдущей цифры и на какую целевую цифру он прокручивается.
Целевая цифра хранится как свойство targetDigit. С ней проблем нет: она задается внешним кодом.
Предыдущая цифра хранится как свойство previousDigit. Она запоминается в конце анимации прокрутки. Но есть проблема: как только я в конец анимации прокрутки вставляю код, который как раз и запоминает предыдущее значение:
previousDigit=targetDigit
... то сразу анимация перестает работать. То есть, числа не «прокручиваются», а просто устанавливаются в нужное значение.
Вот весь код:
Image {
id: ribbon
source: "qrc:/resource/pic/digits/timeDigitRibbon.png"
// Вертикальные смещения в пикселях
property double hDelta: -478.0 // Смещение картинки по высоте чтобы при значении 0 картинка нуля была в окошке индикатора
property double hStep: 53.5 // Шаг между изображением цифр
// Число, на которое должна переключиться лента
property int targetDigit: 0
// Предыдущее число, которое показывала лента
property int previousDigit: 0
// Анимация от цифры к цифре
YAnimator {
id: directAnimation
target: ribbon;
from: hDelta+(previousDigit*hStep);
to: hDelta+(targetDigit*hStep);
duration: 100
onRunningChanged: {
if(running==true) {
console.log( "Start animation digit from: "+previousDigit+" to: "+targetDigit+" (YAnimator from:"+from+" to: "+to+")" )
}
if(running==false) {
previousDigit=targetDigit // <----- Это проблемный код
console.log( "Stop animation. Set previous: "+previousDigit )
}
}
onFromChanged: {
console.log("From changed: "+from)
}
onToChanged: {
console.log("To changed: "+to)
}
}
onTargetDigitChanged: {
console.log(" ")
console.log("Target digit new: "+targetDigit+" , previous: "+previousDigit)
directAnimation.start()
}
}
В логе я вижу следующее:
Target digit new: 5 , previous: 4
Start animation digit from: 4 to: 5 (YAnimator from:-264 to: -264)
To changed: -210.5
From changed: -210.5
Stop animation. Set previous: 5
Target digit new: 6 , previous: 5
Start animation digit from: 5 to: 6 (YAnimator from:-210.5 to: -210.5)
To changed: -157
From changed: -157
Stop animation. Set previous: 6
Target digit new: 7 , previous: 6
Start animation digit from: 6 to: 7 (YAnimator from:-157 to: -157)
To changed: -103.5
From changed: -103.5
Stop animation. Set previous: 7
Обратите внимание на длинные строки (Start animation...). Сами цифры там разные: 5 и 4, 6 и 5, 7 и 6. А вот параметры from и to для YAnimator почему-то одинаковые, несмотря на то, что from зависит от previousDigit, а to зависит от targetDigit по одной и той же формуле:
from: hDelta+(previousDigit*hStep);
to: hDelta+(targetDigit*hStep);
Я грешил на то, что тут как-то некорретно работает property bindings, потому что свойство previousDigit меняется внутри JavaScript:
http://doc.qt.io/qt-5/qtqml-syntax-propertybinding.html#creating-property-bindings-from-javascriptvИ я попробовал вместо проблемной строки написать:
previousDigit=Qt.binding( function() {return targetDigit; } )Но это никакого эффекта не дало.
Сейчас мне нужно сделать две вещи:
- научиться запоминать previousDigit. Если текущий способ не подходит, может быть есть какой-то другой.
- научиться запускать анимацию с использованием значений previousDigit и targetDigit. Как видно, текущий способ некорректно выставляет свойства from и to.
Вот. Кто может подсказать как обойти эти два затыка?
