Как мне анимировать, используя javascript и qml?

Я искал в Интернете, и я не могу найти простое руководство, как анимировать объекты пользовательского интерфейса в Ubuntu SDK.

Может кто-нибудь объяснить, пожалуйста, разные части, необходимые и как они работают вместе?

1 ответ

QtQuick предлагает богатый набор библиотек переходов и анимации, которые вы можете найти здесь. В основном это включает изменение свойств объекта с указанным интервалом времени.

Вот пример кода для анимации прямоугольного блока для перемещения в сторону.

     Rectangle {
        id: rect
        color: "Green"
        width: units.gu(20)
        height: width
        x: units.gu(0)
        y: units.gu(0)

        MouseArea {
            anchors.fill: parent
            onClicked: rectAnimation.start()
        }

        NumberAnimation {
            id: rectAnimation
            target: rect
            property: "y"
            from: units.gu(0)
            to: units.gu(20)
            duration: 500
        }
    }

Вы можете запускать анимацию, основываясь на различных вещах, таких как состояния объекта, поведение и т. Д. Например, если вы хотите, чтобы прямоугольник плавно увеличивал свой размер, вы должны определить следующее поведение:

Behavior on width {
    NumberAnimation { duration: 500 }
}

QtQuick бесконечно мощен. Я настоятельно рекомендую просмотреть официальную документацию Qt, чтобы узнать о различных доступных типах анимации и их триггерах.

Примечание. Хотя для разработки приложений для Ubuntu Touch требуется Ubuntu SDK, стоит знать, что сам Ubuntu SDK использует Qt, и, следовательно, вы получите больше результатов, если будете искать решения QML, а не решения Ubuntu SDK в будущем.

Другие вопросы по тегам