Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    [SOLVED] Parallel Animation and property change in sequence

    QML and Qt Quick
    2
    3
    1187
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • M
      marcin100 last edited by

      Hello,

      I got stuck on what seems like a simple issue (maybe it is just my lack of experience). I have a screen fadeOut and fadeIn ParallelAnimations set up (shown below).
      When a button is clicked I would like to run things in this order:

      1. fadeOut animation - removes the current screen from view
      2. When fadeOut completes, re-assign new qml file source to the screen via Loader element. ( I got this part working)
      3. start the fadeIn animation.

      This seems straight forward, but I have not been able to wait until step 1 above completes. Any attempts of while (!fadeOut.stopped()) {}, end up locking up the app.

      There must be a clean QML way of doing this... I hope.

      @
      ParallelAnimation
      {
      id: fadeOut
      running: false
      NumberAnimation { target: screen; property: "opacity"; to: 0; duration: 300; easing.type: Easing.InQuad }
      NumberAnimation { target: screen; property: "scale"; to: 0; duration: 300; easing.type: Easing.InQuad }
      alwaysRunToEnd: true

      }
      
      ParallelAnimation
      {
          id: fadeIn
          running: false
          NumberAnimation { target: screen; property: "opacity"; to: 1; duration: 300; easing.type: Easing.InQuad }
          NumberAnimation { target: screen; property: "scale"; to: 1; duration: 300; easing.type: Easing.InQuad }
          alwaysRunToEnd: true
      }
      

      @

      1 Reply Last reply Reply Quote 0
      • p3c0
        p3c0 Moderators last edited by

        Hi,

        Use onStopped signal handler. In QML every signal has its corresponding "signal-handlers":http://doc.qt.io/qt-5/qtqml-syntax-signals.html#property-change-signal-handlers.

        157

        1 Reply Last reply Reply Quote 0
        • M
          marcin100 last edited by

          Thanks!

          Here is what I did and it works perfectly.

          @
          ParallelAnimation
          {
          id: fadeOut
          running: false
          NumberAnimation { target: screen; property: "opacity"; to: 0; duration: 300; easing.type: Easing.InQuad }
          NumberAnimation { target: screen; property: "scale"; to: 0; duration: 300; easing.type: Easing.InQuad }
          alwaysRunToEnd: true

              onStopped:
              {
                  buttonMenu.updateSource()   // source update is done by Loader in separate qml file
                  fadeIn.start()
              }
          

          }

          ParallelAnimation
          {
          id: fadeIn
          running: false
          NumberAnimation { target: screen; property: "opacity"; to: 1; duration: 300; easing.type: Easing.InQuad }
          NumberAnimation { target: screen; property: "scale"; to: 1; duration: 300; easing.type: Easing.InQuad }
          alwaysRunToEnd: true
          }
          @

          1 Reply Last reply Reply Quote 0
          • First post
            Last post