Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Floating Color Animation
Qt 6.11 is out! See what's new in the release blog

Floating Color Animation

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
2 Posts 2 Posters 322 Views 1 Watching
  • 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.
  • ? Offline
    ? Offline
    A Former User
    wrote on last edited by
    #1

    Hello, I want to give a floating color animation to a text, as in the picture. How can I apply this to a Label?

    aa52a8f9-7ad3-456b-8d14-cf2ba77e99f2-image.png

    L 1 Reply Last reply
    0
    • ? A Former User

      Hello, I want to give a floating color animation to a text, as in the picture. How can I apply this to a Label?

      aa52a8f9-7ad3-456b-8d14-cf2ba77e99f2-image.png

      L Offline
      L Offline
      lemons
      wrote on last edited by
      #2

      @NullByte you could e.g. use a LinearGradient to fill a non-visible Label:

      Window {
          width: 640
          height: 480
          visible: true
          color: "white"
      
          Rectangle {
              anchors.centerIn: parent
              width: text.width + 20
              height: text.height + 20
              color: "#2D0B5A"
              Label {
                  id: text
                  anchors.centerIn: parent
                  font.pointSize: 42
                  text: "Win by saving."
                  visible: false
              }
              LinearGradient {
                  anchors.fill: text
                  start: Qt.point(text.x, text.y)
                  end: Qt.point(text.x + text.width, text.y + text.height)
                  source: text
                  gradient: Gradient {
                      GradientStop {
                          position: 0
                          color: "#52C7F6"
                      }
                      GradientStop {
                          position: 0.3
                          color: "#FF77E1"
                      }
                  }
              }
          }
      }
      
      1 Reply Last reply
      1

      • Login

      • Login or register to search.
      • First post
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved