Я задал этот вопрос на форумах Qt (link), но не получил никакого ответа, а similar question там пропал без ответа в течение 3 месяцев ... так что я здесь.Анимация по расширению/обрушению Qt Quick TreeView
Я пытаюсь анимировать расширение и крах TreeView в QML. У меня есть анимация, которую можно воспроизвести в другом месте моего приложения, где высота дочернего объекта в движущемся анимирована, чтобы эмулировать «расширение», и мне нужно, чтобы развернуть/свернуть TreeView было одинаковым (или, по крайней мере, похожим).
Я попытался добавить анимацию на высоте моей строки внутри моей rowDelegate, который не имел никакого эффекта:
Behavior on height {
NumberAnimation {
duration: 250
easing.type: Easing.InOutQuad
}
Глядя на реализацию TreeView сделал Габриэль де Дитрих и Кэролайн Чао в комплекте с Qt (documentation here), кажется, что они выполняют вставку дочерних данных в закрытый «__listView», когда родитель расширяется, и удаляют, когда он сбрасывается.
После некоторого исследования я смог найти информацию о view transitions и несколько советов из ответа stackoverflow относительно animating new items in a table.
Вооружившись этими советами, я был в состоянии взломать вокруг в частных свойств TreeView, чтобы получить довольно дерьмовый расширить анимации ...
TreeView {
id: tree
model: myModel
Transition {
id: treeTransitionAnimation
NumberAnimation { properties: "y"; duration: 300 }
}
Component.onCompleted: {
if(this.__listView) {
this.__listView.add = treeTransitionAnimation
this.__listView.remove = treeTransitionAnimation
//doesn't actually work on remove. The child items in the tree just disappear.
}
else {
console.log("Something bad happened. Darn.")
}
}
...
Это сдвигает новые предметы в от верхней части дерева когда это они расширены (вставлены) ... но это не то, что мне нужно. Я знаю, что плохая практика заключается в использовании частных свойств этих объектов QML, но я возьму все, что работает.
Также обратите внимание, что вышеизложенное не работает даже при удалении.
Подстановка «height» для «y» в числовой анимации выше также не работает.
Класс Qt, используемый для деревьев, имеет простой boolean property для анимации расширения и сглаживания дерева, но TreeView не обладает таким свойством.
Кто-нибудь знает способ сделать эту анимацию?
Заранее благодарим за любой совет!
EDIT Я также попытался добавить ListView.onAdd и ListView.onRemove обработчики в rowDelegate и itemDelegate без толку ... смотри пример ниже:
rowDelegate: Rectangle {
id: rowDelegateItem
height: 100
SequentialAnimation {
id: collapseAnimation
running: false
PropertyAction { target: rowDelegateItem; property: "ListView.delayRemove"; value: true }
NumberAnimation { target: rowDelegateItem; properties: "height"; to: 0.0; duration: 250 }
PropertyAction { target: rowDelegateItem; property: "ListView.delayRemove"; value: false }
}
SequentialAnimation {
id: addAnimation
running: false
PropertyAction { target: rowDelegateItem; property: "height"; value: 0 }
NumberAnimation { target: rowDelegateItem; properties: "height"; to: 100; duration: 250 }
}
ListView.onRemove: {
console.log("onRemove");
collapseAnimation.start();
}
ListView.onAdd: {
console.log("onAdd");
addAnimation.start();
}
Но «onAdd» и «onRemove» выходы журнала никогда не печатаются.