台州网站设计哪家好武汉seo网络优化公司
QML 实现一个动态的启动界面
- 一、效果查看
- 二、源码分享
- 三、所用到的资源下载
一、效果查看
二、源码分享
工程结构
main.qml
import QtQuick
import QtQuick.Controls
import QtQuick.Dialogs
import Qt.labs.platformWindow {id:windowwidth: 640height: 400visible: truetitle: qsTr("Hello World")property int imageCnt: 1Rectangle{anchors.fill: parentgradient: Gradient{orientation: Gradient.VerticalGradientStop { position: 0.0; color: "#4bb6ac" }GradientStop { position: 0.5; color: "#3edabd" }GradientStop { position: 1.0; color: "#24efc0" }}}Timer{interval: 2000repeat: truerunning:trueonTriggered: {var w = Qt.createComponent("DynamicImage.qml")if (w.status === Component.Ready) {var image = "qrc:/image/image"+imageCnt+".svg";imageCnt += 1if(imageCnt > 10)imageCnt = 1var endX = Math.floor(Math.random()*window.width);console.log(image,endX)var item = w.createObject(window,{x:window.width/2-50,y:window.height,width:100,height:100,source:image,stopX:endX,stopY:-150,originX:0,originy:50,moveDuration:15000,rotationDuration: 5000,running: true});console.log("create:"+item)item.moveFinished.connect(()=>{item.destroy()console.log("destroyed:"+item)})}else console.error("create component falied!");}}Text{id:btnwidth: 200height: 100z:1anchors.centerIn: parenttext: "正在启动中...请稍后!"color:"white"horizontalAlignment: Text.AlignHCenterverticalAlignment: Text.AlignVCenterfont.pixelSize: 30font.bold: truefont.italic: true}}
DynamicImage.qml
//DynamicImage.qml
import QtQuick
import QtQuick.ControlsImage{id:rootproperty int stopX: 0property int stopY: 0property alias originX: rotation.origin.xproperty alias originy: rotation.origin.yproperty int moveDuration: 5000property int rotationDuration: 5000property bool running: falsesignal moveFinished()transform: Rotation{id:rotationaxis.x: 0axis.y: 0axis.z: 1}RotationAnimation{running: root.runningtarget: rootfrom:0to:360loops:Animation.Infiniteduration: rotationDuration}ParallelAnimation{id:animrunning:root.runningNumberAnimation{target: rootproperties: "x"from:root.xto:stopXduration: moveDuration}NumberAnimation{target: rootproperties: "y"from:root.yto:stopYduration: moveDuration}onFinished: {moveFinished()console.log("onFinished")}}Component.onDestruction: {//console.log("onDestroyed")}
}
三、所用到的资源下载
本博文最前面下载。