QML StackView：动态更改 replaceEnter/Exit 动画

Question

是否可以根据要在堆栈视图中加载的下一个 QML 文件动态更改 replaceEnter/Exit 过渡动画。情况：

我有一个 Center QML 文件，在屏幕的 4 个边上有 4 个按钮。还有其他 4 个 QML 文件，即 Top、Bottm、Right 和 Left。按下中心 QML 上的顶部按钮时，顶部 qml 文件应从上到下过渡并替换中心文件。同样，在中央 QML 上按下左按钮时，左侧 QML 应从左到右进入显示区域并替换中心 QML。

我尝试使用 replaceEnter/Exit 属性。但无法理解如何根据要显示的下一个 QML 动态更改它。

Answer 1

查看 doc 了解有关为 Stackview 自定义转换的信息。

如果您需要多个转换，您可以单独定义它们，然后在使用它们之前分配它们。这是一个例子：

StackView {
    id: control

    pushEnter: topTransition

    Transition {
        id: topTransition
        XAnimator {
            from: (control.mirrored ? -1 : 1) * -control.width
            to: 0
            duration: 400
            easing.type: Easing.OutCubic
        }
    }

    Transition {
        id: bottomTransition
        XAnimator {
            from: 0
            to: (control.mirrored ? -1 : 1) * control.width
            duration: 400
            easing.type: Easing.OutCubic
        }
    }

    Button {
        text: "Push page from bottom"
        onClicked: {
            control.pushEnter = bottomTransition
            control.push(bottomPage)
        }
    }
}

您必须在每次单击按钮之前明确设置所需的所有 push/pop/replace 转换。

QML StackView：动态更改 replaceEnter/Exit 动画

QML StackView : Changing replaceEnter/Exit animation dynamically

qt

qml

qtquickcontrols2

stackview