Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. svg animations in qt 4.8.6
Forum Updated to NodeBB v4.3 + New Features

svg animations in qt 4.8.6

Scheduled Pinned Locked Moved Unsolved General and Desktop
9 Posts 2 Posters 3.1k Views 2 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.
  • B Offline
    B Offline
    Bjorn.Gurnett
    wrote on last edited by Bjorn.Gurnett
    #1

    Hello

    We are trying to use animated svg files in a project using qt 4.8.6 using QSvgRenderer. It appears that animations such as

    <animateTransform attributeName="transform" type="scale" values="1;0.85;1" begin="0s" dur="0.8s" fill="freeze" repeatCount="indefinite" />
    

    work as expected when compiled. However, animations like

    <animate attributeName="opacity" values="0;1;0" begin="0s" dur="0.8s" fill="freeze" repeatCount="indefinite" />
    

    works fine in chrome, but does not work via Qt. I have found only one reference to this problem, but no solution. Is there one?

    Thank you

    1 Reply Last reply
    0
    • SGaistS Offline
      SGaistS Offline
      SGaist
      Lifetime Qt Champion
      wrote on last edited by
      #2

      Hi and welcome to devnet,

      What reference was it ?

      Interested in AI ? www.idiap.ch
      Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

      1 Reply Last reply
      0
      • B Offline
        B Offline
        Bjorn.Gurnett
        wrote on last edited by
        #3

        Hello.

        it was the following

        http://stackoverflow.com/questions/23095732/why-do-animated-elements-in-qtsvg-need-to-be-of-type-animatetransform-in-order-t

        Thanks

        1 Reply Last reply
        0
        • SGaistS Offline
          SGaistS Offline
          SGaist
          Lifetime Qt Champion
          wrote on last edited by
          #4

          From a quick look at the sources, the animate node are not parsed. However, Qt's officially supports the static features for SVG Tiny 1.2 so I don't know whether animate not falls in this case.

          Interested in AI ? www.idiap.ch
          Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

          1 Reply Last reply
          0
          • B Offline
            B Offline
            Bjorn.Gurnett
            wrote on last edited by
            #5

            Which files are you looking at regarding the parsing?

            Thanks

            1 Reply Last reply
            0
            • SGaistS Offline
              SGaistS Offline
              SGaist
              Lifetime Qt Champion
              wrote on last edited by
              #6

              qsvghandler.cpp

              Interested in AI ? www.idiap.ch
              Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

              1 Reply Last reply
              0
              • B Offline
                B Offline
                Bjorn.Gurnett
                wrote on last edited by
                #7

                Thanks for the help. Seems like a big omission to leave out animate which holds opacity, but never mind.

                1 Reply Last reply
                0
                • SGaistS Offline
                  SGaistS Offline
                  SGaist
                  Lifetime Qt Champion
                  wrote on last edited by
                  #8

                  I don't know what it would take to implement that. Do you have an example of a simple SVG that has that animation ?

                  Interested in AI ? www.idiap.ch
                  Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                  1 Reply Last reply
                  0
                  • B Offline
                    B Offline
                    Bjorn.Gurnett
                    wrote on last edited by
                    #9

                    This is a simple one that uses hover

                    <?xml version="1.0" encoding="utf-8"?>
                    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
                    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="34px" height="34px" viewBox="0 0 34 34" xml:space="preserve">
                    	<image width="34" height="34" opacity="1" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABNRJREFUeNrsWElLbEcUPu08tbM4PMeFLxAxiGCI0BBUgpvgSkmy8mXTImSRTTZvI/kPgcZVsgo2vAgRkk0IGJQYIogEVAwOJHHEoZ3nId9X9Gmqr32vbVYucuBwvVW3zvnqqzNU67u/v5fnICnyTOTZAEmzX6qqqpJZ0wD9CPoBtADaEh2fhR5Cf4KGNzY2Vt0M+Hw+87TDwme/EMjAwEDCxcPDw3Q+WFRU9H5bW5u0trZKXl6eVFZWmvnNzU05OTmRmZkZmZ6elkgkMonhEOx96wZoaGgoMSMuAN7G47P6+vrBvr4+qaurk+PjYzk9PZWjoyPZ2dkx32VlZUl6erp0dHRIT0+PrK2tBcLhcADrA5j+CoDmvfx4MkIWUlNTR2i4vb1d9vf3DQiuIb1KsQrHda6goEAKCwtlampKxsbG5Pb29mPYDrsxkuLBxCvsciQYDEpzc7OsrKwYIDAYA0EFUKMpKSmxsbu7O9nd3ZXV1VWzljZoizaflDVY0JKWlvZ1f3+/5OfnCwJPrq+v43btJvYc13At2aEt2qTtp6TvYFdXl/j9ftna2jIGbdqpZIBqZ4I9pt/f3NyYQOaGaJO2kwICxL1lZWXBpqYmY4AgSDWFT3XAvycmJmR0dNTo5ORk3LzNjoKhTdqmj2QYGWRgHh4eytXVVQwEY8MGQ4CMA2WI2VNdXR0HlE9dR1sMdNpOxIoTSAvqRGd5eTnrgDFCg/bTBuOUjIwMM2eD599khM+9vT2pqKgQ+nDGihNIb01NjSlMyoYCcBpVULbodxob9jo+ySJt0wd9uZZ4SHtJSYkpVuoorgw76oZT6NwJgsp3HaNt+oAEvIC8xejWALXPmjWBceMloVAo7p0FraGh4QFT9EFfXkdTxjKtLCgDNMJybheyZJTAS0tL49KeG8vMzKTZEi9GYs61JtiG3QqXl2RnZ8d1W7dAdwLZwc5fkD67SPFJg0w/e/wxYYZw96iocWkdrdIRLyCLqA0v2DvUoTotLi6WxsbG2A55XOPj43GLu7u7Y5mmjhcXF02PspmIZt5fXkCmwEgnz5ULnUdCgzqWiF6OsbfYQJzxxifjDd/MegXrm+3tbcOAFqVkmps95rWOc2SbPlCnfvACMgu0vzDX3WLAZsiZJc6dJ1p7dnYmBwcHM8io6cd6TYg1g0Dsu4caUia4s9zc3Ng8j9N2rimr62iLa5aXlxmsbzB84Jm+OOMwbmqdiIcgC5LSqSBsZ7W1teympsdQzs/PHxyVguDG2GtgdxT6HebOkrmPhJaWluTi4iJ2tm50s+uur68bpSPnUWjgXl5eStQm2VhL6mIEVmaxi08XFhZMk7LbufN+6jWmDY8xNzc3R8a+RAz+6mTD884KMN8gsj+Zn5839w4WIe28j4l2ab2zEASK4WswNoLpf5K6xbMO2ILfLe/imy/QMXt5T+FvGb0sa8XUY7CvCGSB10wA+Z7HASZ+x2cr+P7mPwGJOvEhKD8HgFfIlHdYZXNycgyYaAMz9xcCYHqy8AHIH8wOsPAjpnehf997NKgHQLwE907cp/0B/DT4ECDeA7486MtofPwJPQEjvyEWfkZssYSfQtehx48VxScBsQBl4VEE9bOkQHOiUwzC26jjCI71wmW9N5D//y0B+VeAAQBSLcVa3zwajAAAAABJRU5ErkJggg==">
                    		<animate attributeName="opacity" to="0" dur="300ms" begin="theTop.mouseover" fill="freeze"/>
                    		<animate attributeName="opacity" to="1" dur="300ms" begin="theTop.mouseout" fill="freeze"/>
                    	</image>
                    
                    	<image width="34" height="34" opacity="0" xlink:href="data:image/png;base64,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">
                    		<animate attributeName="opacity" to="1" dur="300ms" begin="theTop.mouseover" fill="freeze"/>
                    		<animate attributeName="opacity" to="0" dur="300ms" begin="theTop.mouseout" fill="freeze"/>
                    	</image>
                    
                    	<circle id="theTop" fill="#000000" opacity="0" cx="16.917" cy="16.917" r="14"/>
                    </svg>
                    

                    kind regards

                    1 Reply Last reply
                    0

                    • Login

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