qt-quick-for-designers-1:components_javascript_example
Components + Javascript example
- The following is a rewrite of the Javascript example using the Button component created in Components.
- resuing-button-complete.qml
import QtQuick 1.0 import "randomFile.js" as RandomFunction Item { id: myItem width: 400 height: 400 property int currentStateNumber: 0 Image { source: "images/background.png" } Image { id: spaceship x: -200 y: 50 source: "images/spaceship.png" } Button { id: button labelText: "PRESS" anchors.horizontalCenter: myItem.horizontalCenter anchors.bottom: myItem.bottom anchors.bottomMargin: 20 onButtonClicked:{ myItem.state = RandomFunction.randomState(); } } states: [ State { name: "bottomRight" PropertyChanges { target: spaceship x: 250 y: 200 } }, State { name: "bottomLeft" PropertyChanges { target: spaceship x: 100 y: 200 } }, State { name: "topLeft" PropertyChanges { target: spaceship x: 10 y: 50 } }, State { name: "topRight" PropertyChanges { target: spaceship x: 100 y: 50 } } ] transitions: [ Transition { NumberAnimation { properties: "x,y" duration: 500 easing.type: Easing.OutExpo } }, Transition { from: "" to: "topLeft" SequentialAnimation{ PauseAnimation { duration: 1000 } NumberAnimation { properties: "x,y" duration: 500 easing.type: Easing.OutExpo } } } ] Component.onCompleted:{ myItem.state = "topLeft"; } }
Resources
- All source code is subject to this copyright.
qt-quick-for-designers-1/components_javascript_example.txt · Last modified: 2013/07/06 22:54 by mithat