qt - 如何在 QML 中动画添加和删除元素到布局？

Question

我想在 ColumnLayout 中添加和删除 TextField 的动画。基本上我想像这样制作动画：- https://doc.qt.io/qt-5/videos/viewtransitions-basic.mp4

标签： qtanimationqml

Answer 1

由于 ColumnLayout 使用implicitHeight来定位项目，您可以向其添加动画以创建滑动效果。我用一个包装Item来保存implicitHeight它TextField本身。它可能看起来并不完美，但我认为你不能走得更远

Item {

    visible: your_property_here

    implicitHeight: visible ? text.implicitHeight : 0
    Behavior on implicitHeight { NumberAnimation { duration: 500 } }

    TextField {
        id: text
        anchors.fill: parent

        scale: parent.visible ? 1 : 0.2
        Behavior on scale { NumberAnimation { duration: 500 } }
    }
}