Delayed Animations/es: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 9: | Line 9: | ||
<code><br />import QtQuick 1.0 | <code><br />import QtQuick 1.0 | ||
Rectangle {<br /> property int time: 800<br /> property int size: 300<br /> width: size; height: size; radius: size<br /> color: | Rectangle {<br /> property int time: 800<br /> property int size: 300<br /> width: size; height: size; radius: size<br /> color: "red"<br /> Behavior on radius { NumberAnimation { duration: time } }<br /> Timer {<br /> id: reset<br /> interval: time;<br /> onTriggered: parent.radius = size<br /> } | ||
MouseArea {<br /> anchors.fill: parent<br /> onClicked: {<br /> parent.radius = 0;<br /> reset.start()<br /> }<br /> }<br />}<br /></code> | MouseArea {<br /> anchors.fill: parent<br /> onClicked: {<br /> parent.radius = 0;<br /> reset.start()<br /> }<br /> }<br />}<br /></code> | ||
Tenga en cuenta que si sólo quería que la animación se ejecutara inmediatamente después de hacer click, puede utilizar SequentialAnimation. Este ejemplo es más bien para mostrar cual es el resultado de aplicar retrasos arbitrarios en las animaciones. | Tenga en cuenta que si sólo quería que la animación se ejecutara inmediatamente después de hacer click, puede utilizar SequentialAnimation. Este ejemplo es más bien para mostrar cual es el resultado de aplicar retrasos arbitrarios en las animaciones. | ||
Revision as of 14:17, 24 February 2015
Spanish English Italian Български
¿Alguna vez deseo que el usuario haga click en algo y luego ejecutar una serie de eventos con retraso? Por ejemplo abrir una lista y cerrarla de nuevo?
En siguiente ejemplo se inicia con un círculo rojo. Cuando el usuario hace click en el círculo este anima a un rectángulo y activa un temporizador. Una vez que el temporizador se dispara este anima la propiedad radius en el rectángulo.
<br />import QtQuick 1.0
Rectangle {<br /> property int time: 800<br /> property int size: 300<br /> width: size; height: size; radius: size<br /> color: "red"<br /> Behavior on radius { NumberAnimation { duration: time } }<br /> Timer {<br /> id: reset<br /> interval: time;<br /> onTriggered: parent.radius = size<br /> }
MouseArea {<br /> anchors.fill: parent<br /> onClicked: {<br /> parent.radius = 0;<br /> reset.start()<br /> }<br /> }<br />}<br />
Tenga en cuenta que si sólo quería que la animación se ejecutara inmediatamente después de hacer click, puede utilizar SequentialAnimation. Este ejemplo es más bien para mostrar cual es el resultado de aplicar retrasos arbitrarios en las animaciones.