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. How to change opacity of a SVG using Qt

How to change opacity of a SVG using Qt

Scheduled Pinned Locked Moved Unsolved General and Desktop
9 Posts 4 Posters 1.4k Views
  • 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.
  • S Offline
    S Offline
    Sougata1996
    wrote on 24 Feb 2021, 11:53 last edited by
    #1

    I have an SVG which is internally represented as :

    <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path d="M8 16h8V8H8v8zm12 24h8v-8h-8v8zM8 40h8v-8H8v8zm0-12h8v-8H8v8zm12 0h8v-8h-8v8zM32 8v8h8V8h-8zm-12 8h8V8h-8v8zm12 12h8v-8h-8v8zm0 12h8v-8h-8v8z" fill="rgb(255,0,0)" fill-opacity="1"/></svg>
    

    I want to change the fill-opacity field to 0.5 . After changing the fill-opacity field i want to save the SVG . How can i do that using Qt , can we do this using QSvgRenderer ?

    J 1 Reply Last reply 24 Feb 2021, 11:56
    0
    • S Sougata1996
      24 Feb 2021, 11:53

      I have an SVG which is internally represented as :

      <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path d="M8 16h8V8H8v8zm12 24h8v-8h-8v8zM8 40h8v-8H8v8zm0-12h8v-8H8v8zm12 0h8v-8h-8v8zM32 8v8h8V8h-8zm-12 8h8V8h-8v8zm12 12h8v-8h-8v8zm0 12h8v-8h-8v8z" fill="rgb(255,0,0)" fill-opacity="1"/></svg>
      

      I want to change the fill-opacity field to 0.5 . After changing the fill-opacity field i want to save the SVG . How can i do that using Qt , can we do this using QSvgRenderer ?

      J Offline
      J Offline
      jsulm
      Lifetime Qt Champion
      wrote on 24 Feb 2021, 11:56 last edited by
      #2

      @Sougata1996 If you want to edit the SVG file directly you can use https://doc.qt.io/qt-5/qtxml-module.html as SVG is XML.

      https://forum.qt.io/topic/113070/qt-code-of-conduct

      1 Reply Last reply
      0
      • S Offline
        S Offline
        Sougata1996
        wrote on 24 Feb 2021, 12:26 last edited by
        #3

        Thanks @jsulm , i am thinking if there is a way to set the opacity while creating an SVG . I am using QSVGGenerator to generate the SVG's ?

        J 1 Reply Last reply 24 Feb 2021, 12:34
        0
        • S Sougata1996
          24 Feb 2021, 12:26

          Thanks @jsulm , i am thinking if there is a way to set the opacity while creating an SVG . I am using QSVGGenerator to generate the SVG's ?

          J Offline
          J Offline
          jsulm
          Lifetime Qt Champion
          wrote on 24 Feb 2021, 12:34 last edited by
          #4

          @Sougata1996 Take a look at https://forum.qt.io/topic/14762/solved-problem-with-svg-pictures-and-transparent-background/4
          You should do a transparent fill at the beginning of the drawing.

          https://forum.qt.io/topic/113070/qt-code-of-conduct

          1 Reply Last reply
          1
          • M Offline
            M Offline
            mrjj
            Lifetime Qt Champion
            wrote on 24 Feb 2021, 15:45 last edited by
            #5

            Hi
            If you want to change the actual file and save it back, you could use this
            https://stackoverflow.com/questions/15123544/change-the-color-of-an-svg-in-qt

            1 Reply Last reply
            0
            • S Offline
              S Offline
              Sougata1996
              wrote on 24 Feb 2021, 16:22 last edited by
              #6

              Thanks @mrjj , @jsulm : Actually what i want is any of the two :

              1. Just change the "fill-opacity" field of the original SVG(16x16.svg) from 1 to 0.5 and save it as a new file(16x16-disabled.svg) . OR
              2. Construct a completely new SVG file named as (16x16-disabled.svg) with the "fill-opacity" field having a value of 0.5 instead of the default value of 1 .

              Will need some more help here ....

              M 1 Reply Last reply 24 Feb 2021, 16:51
              0
              • S Sougata1996
                24 Feb 2021, 16:22

                Thanks @mrjj , @jsulm : Actually what i want is any of the two :

                1. Just change the "fill-opacity" field of the original SVG(16x16.svg) from 1 to 0.5 and save it as a new file(16x16-disabled.svg) . OR
                2. Construct a completely new SVG file named as (16x16-disabled.svg) with the "fill-opacity" field having a value of 0.5 instead of the default value of 1 .

                Will need some more help here ....

                M Offline
                M Offline
                mrjj
                Lifetime Qt Champion
                wrote on 24 Feb 2021, 16:51 last edited by
                #7

                @Sougata1996
                Hi
                Option 1 would be possible with the code from the link.
                just need to change
                SetAttrRecur(doc.documentElement(), "path", "fill-opacity", "0.5");

                1 Reply Last reply
                1
                • S Offline
                  S Offline
                  Sougata1996
                  wrote on 25 Feb 2021, 03:46 last edited by
                  #8

                  Thanks @mrjj ,@jsulm , @SGaist :

                  QSvgGenerator svgGenerator;
                  svgGenerator.setTitle("");
                  svgGenerator.setFileName(QString::fromStdWString(path.wstring()));
                  QPainter painter(&svgGenerator);
                  // will use this method to set the back-ground color of the SVG
                  draw(painter); 
                  painter.save();
                  painter.end();
                  

                  If I use option1 , i will have to edit the xml to change the "fill-opacity" field after saving the original SVG file . Can something be done to change the "fill-opacity" field during SVG creation that is before save . Here i am wanting to know if option 2 referred above is possible ?

                  1 Reply Last reply
                  0
                  • S Offline
                    S Offline
                    SGaist
                    Lifetime Qt Champion
                    wrote on 25 Feb 2021, 20:38 last edited by
                    #9

                    Unless you are generating the original in the same way, going with the xml change will likely be faster and simpler.

                    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

                    2/9

                    24 Feb 2021, 11:56

                    topic:navigator.unread, 7
                    • Login

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