本篇内容主要讲解“怎么使用QML属性实现足球运动”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“怎么使用QML属性实现足球运动”吧!
Animation动画类型不能直接在QML文件中使用。它的存在是为了提供一组通用的属性和方法,可用于继承自它的所有其他动画类型。直接使用Animation类型会导致错误,类似C++的抽象类。
loops:int 设置当前动画循环的次数
paused:bool 表示当前动画是否暂停,可读可写,功能与stop()pause()类似
running:bool 标识当前动画是否正在运行
下述列出的动画均是Animation的子类
AnchorAnimation:一般用于在锚定布局发生变化时候的转场动画,当在转换中使用锚定动画时,它将对状态更改期间发生的任何锚定更改进行动画处理。这可以通过使用AnchorChanges设置特定的目标项来覆盖。目标属性。 注意:AnchorAnimation只能在Transition中使用,并与AnchorChange一起使用。它不能用于行为和其他类型的动画
定义在并列式动画对象内的几组动画在播放时没有先后顺序,都会同时播放,并列式动画同时也支持内嵌序列式动画组和单个动画
与并列式相反,定义在序列式动画内的动画会按照动画创建的先后顺序依次执行,与并列式动画都可以理解为是单个动画的容器类动画。
和对象属性相关的动画,可以定义属性的值按照某种已知曲线从
from
到to
的转换,PropertyAnimation被NumberAnimation,RotationAnimation和ColorAnimation所继承
定义和路径相关的动画,与Path和Transaction共同使用,定义路径动画
一般地,在动画运行时,运行规律不都是线性的,有时候需要让动画按某种曲线斜率变化着运行,这时就需要指定动画的easing属性,Qt内置许多动画曲线,保证动画运行的多样性
在PropertyAnimation中,往往需要运行动画的目标对象,表示属性值的改变是该目标对象的属性值
一般地,目标对象的属性不止一个,在指定属性动画时,需要明确动画改变哪个属性,就是用property,也可一次指定多个属性,使用properties指定
指定当前动画从开始到结束运行的时间,单位ms,对于特殊的动画,有时还需要指定动画的振幅,周期,超调信息等等
标志当前动画的初始值
标志当前动画的结束值
基本代码如下
import QtQuick 2.12
import QtQuick.Window 2.12
Window {
id:root
visible: true
width: 1500
height: 300
title: qsTr("Window Test")
flags: Qt.FramelessWindowHint
y:1200
//准备地面和天空
Rectangle {
id: sky
width: parent.width
height: 200
gradient: Gradient {
GradientStop { position: 0.0; color: "#0080FF" }
GradientStop { position: 1.0; color: "#66CCFF" }
}
}
Rectangle {
id: ground
anchors.top: sky.bottom
anchors.bottom: root.bottom
width: parent.width
color:"#00802F"
// gradient: Gradient {
// GradientStop { position: 0.0; color: "#00FF00" }
// GradientStop { position: 1.0; color: "#00802F" }
// }
}
//准备足球
Image {
id: ball
x: 20; y: 240
source: "qrc:/images/ball.png"
MouseArea {
anchors.fill: parent
onClicked: {
ball.x = 20; ball.y = 240
anim.restart()
}
}
}
//准备序列动画
ParallelAnimation {
id: anim
SequentialAnimation {
NumberAnimation {
target: ball
properties: "y"
to: 20
duration: 2000
easing.type: Easing.OutCirc
}
NumberAnimation {
target: ball
properties: "y"
to: 240
duration: 2000
easing.type: Easing.OutBounce
}
}
SequentialAnimation{
NumberAnimation {
target: ball
properties: "x"
to: 400
duration: 2000
easing.type: Easing.Linear
}
NumberAnimation {
target: ball
properties: "x"
to: 650
duration: 2000
easing.type: Easing.Linear
}
}
RotationAnimation {
target: ball
properties: "rotation"
to: 720
duration: 4000
easing.type: Easing.Linear
}
}
}
到此,相信大家对“怎么使用QML属性实现足球运动”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。
原文链接:https://blog.51cto.com/u_13030942/5720443