Почему анимация срабатывает при загрузке - PullRequest
0 голосов
/ 22 февраля 2019

Когда откроется окно, вы увидите, что прямоугольник выдвигается наружу.Я установил для свойства y родительскую высоту, чтобы она изначально находилась за пределами окна, почему это анимируется?
Полагаю, это из-за parent:height.Может быть, из-за того, что parent.height недоступен во время загрузки и изначально установлен на 0?

У меня есть следующий пример для воспроизведения:

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        id: test;
        y: parent.height;
        states: [
            State {
                name: "slideOut"
                PropertyChanges{
                    target: test;
                    y: parent.height;
                }
            },
            State {
                name: "slideIn"
                PropertyChanges{
                    target: test;
                    y: 0;

                }
            }
        ]
        Behavior on y {
            NumberAnimation {
                duration: 500;
            }
        }
        color: "red";
        width: parent.width;
        height: parent.height;

    }

    MouseArea {
        anchors.fill: parent;
        onClicked: {
            if(test.state == "slideIn") {
                test.state = "slideOut";
            } else {
                test.state = "slideIn";
            }
        }
    }
}

1 Ответ

0 голосов
/ 22 февраля 2019

Ваше предположение звучит точно для меня.

Вы должны использовать переходы вместо состояний:

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        id: test
        y: parent.height
        width: parent.width
        height: parent.height
        color: "red"

        states: [
            State {
                name: "slideOut"
                PropertyChanges {
                    target: test
                    y: parent.height
                }
            },
            State {
                name: "slideIn"
                PropertyChanges {
                    target: test
                    y: 0
                }
            }
        ]
        transitions: [
            Transition {
                NumberAnimation {
                    property: "y"
                    duration: 500
                }
            }
        ]
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            if (test.state == "slideIn") {
                test.state = "slideOut"
            } else {
                test.state = "slideIn"
            }
        }
    }
}

Другим решением может быть использование свойство enabled в поведении позволяет запускать анимацию только тогда, когда окно готово.Я не уверен, на какой собственности ты бы основал это все же.Некоторые идеи:

  • enabled: window.height > 0
  • enabled: window.active
...