Learn what Felgo offers to help your business succeed. Start your free evaluation today! Felgo for Your Business

Forums

OverviewFelgo 2 Support (Qt 5) › Sprite sequence reverse

Tagged: ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #21576

    Phil

    Hello,

    I noticed that the behaviour when reversing a sprite sequence isn’t as expected. I want to play a sprite forwards once. Then I want to reverse the animation back to the first frame. I’ve written a test programme using the example sprite below. I wanted the sprite to remain on the last frame but it doesn’t. Then the reverse animation isn’t smooth. Is this something possible using the Sprite component?

    Example sprite:

    https://s1.construct.net/images/v675/uploads/articleuploadobject/0/images/16567/num.fw.png

    Main.qml:

    import Felgo 3.0
    import QtQuick 2.0
    
    App {
        property bool spriteReverse
    
        SpriteSequence {
            anchors.centerIn: parent
            width: parent.width / 5
            height: width
            running: spriteTimer.running
            Sprite {
                frameCount: 5
                frameWidth: 80
                frameHeight: 80
                source: "../assets/numbers_spritesheet.png"
                frameRate: frameCount / (spriteTimer.interval / 1000)
                reverse: spriteReverse
            }
        }
    
        Timer {
            id: spriteTimer
            interval: 5000
            onTriggered: spriteReverse = !spriteReverse
        }
    
        AppButton {
            anchors.horizontalCenter: parent.horizontalCenter
            text: spriteReverse ? "count down" : "count up"
            onClicked: spriteTimer.start()
        }
    }

    Thanks,

    Phil

    #21601

    Günther
    Felgo Team

    Hi Phil,

    this is how you would create something like this with SpriteSequence. Please note that the import order (import Felgo 3.0 after import Qt Quick) is important, as both modules contain a SpriteSequence type, with a different implementation though.

    With the Felgo Sprite type, you can add multiple states (Sprite items) for your animation and trigger them as needed, to e.g. count down or up as required (or stay at a certain position).

    import QtQuick 2.0
    import Felgo 3.0
    
    App {
      property bool spriteReverse
    
      SpriteSequence {
        id: spriteSeq
        anchors.centerIn: parent
        width: parent.width / 5
        height: width
        defaultSource: "../assets/num_fw.png"
    
        Sprite {
          name: "start"
          frameCount: 1
          frameWidth: 80
          frameHeight: 80
          startFrameColumn: 1
          to: { "start": 1 }
        }
    
        Sprite {
          name: "countUp"
          frameCount: 5
          frameWidth: 80
          frameHeight: 80
          frameRate: 5
          to: { "end": 1 }
        }
    
        Sprite {
          name: "end"
          frameCount: 1
          frameWidth: 80
          frameHeight: 80
          startFrameColumn: 5
          to: { "end": 1 }
        }
    
        Sprite {
          name: "countDown"
          frameCount: 5
          frameWidth: 80
          frameHeight: 80
          frameRate: 5
          reverse: true
          to: { "start": 1 }
        }
      }
    
      AppButton {
        anchors.horizontalCenter: parent.horizontalCenter
        text: spriteReverse ? "count down" : "count up"
        onClicked: {
          if(spriteReverse)
            spriteSeq.jumpTo("countDown")
          else
            spriteSeq.jumpTo("countUp")
          spriteReverse = !spriteReverse
        }
      }
    }
    

    Best,
    Günther

    #21614

    Phil

    great, thanks =]

Viewing 3 posts - 1 through 3 (of 3 total)

RSS feed for this thread

You must be logged in to reply to this topic.

Qt_Technology_Partner_RGB_475 Qt_Service_Partner_RGB_475_padded