qt4 qml Flipable、Flickable和状态与动画

最新推荐文章于 2025-04-12 11:38:58 发布

原创

最新推荐文章于 2025-04-12 11:38:58 发布 · 4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#qt #transition #import #image #behavior

这篇博客介绍了如何在Qt4的QML中使用transitions实现状态过渡动画，详细探讨了Flipable组件的翻转效果和Flickable组件的弹动效果，为QML应用添加生动的交互体验。

三十七、Flipable、Flickable和状态与动画

一、状态与动画
属性动画使用PropertyAnimation on x{ to:100; duration:1000 }

import QtQuick 1.0

Rectangle {
width: 300;height: 200
Rectangle{
    id:page; width:50; height:50
    x:0; y:100;
    color:"red"
    PropertyAnimation on x{ to:100; duration:1000 }
    //NumberAnimation on x{ to:100; duration:1000}
    PropertyAnimation on color{ to:"blue:"; duration:1000}
    //ColorAnimation on color{ to:"blue"; duration:1000}
}
}

缓冲曲线，在PropertyAnimation里指定 easing.type

import QtQuick 1.0

Rectangle {
width: 300;height: 200
Rectangle{
    id:page; width:50; height:50
    x:0; y:100;
    color:"red"
    PropertyAnimation on x{ to:100; duration:1000; easing.type: "InOutElastic"}
}
}<