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 Icon problems
Forum Updated to NodeBB v4.3 + New Features

SVG Icon problems

Scheduled Pinned Locked Moved Solved General and Desktop
10 Posts 5 Posters 4.0k 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.
  • G Offline
    G Offline
    Gianluca86 0
    wrote on last edited by
    #1

    Hi everyone,
    In my application I'm trying to include vector icons, but the display is incorrect.
    link Image SVG
    This image is created by IconGenerator of Axialis, if I open it with GIMP or Inkscape I see correctly.
    This is the code I use:

    QSvgRenderer svgRenderer( QString("book-new.svg") );
    QPixmap pix( ICON_SIZE_EXTRA, ICON_SIZE_EXTRA );
    pix.fill(Qt::transparent);
    QPainter pixPainter( &pix );
    svgRenderer.render( &pixPainter );
    
    QToolButton *pNewSolution = new QToolButton(this);
    pNewSolution->setSizePolicy(QSizePolicy::Fixed,QSizePolicy::Fixed);
    pNewSolution->setIconSize(QSize(ICON_SIZE_EXTRA,ICON_SIZE_EXTRA));
    pNewSolution->setIcon(QIcon(pix));
    

    Qt 5.5.1 32Bit on Linux

    Thanks for your help

    jsulmJ JonBJ 2 Replies Last reply
    0
    • G Gianluca86 0

      Hi everyone,
      In my application I'm trying to include vector icons, but the display is incorrect.
      link Image SVG
      This image is created by IconGenerator of Axialis, if I open it with GIMP or Inkscape I see correctly.
      This is the code I use:

      QSvgRenderer svgRenderer( QString("book-new.svg") );
      QPixmap pix( ICON_SIZE_EXTRA, ICON_SIZE_EXTRA );
      pix.fill(Qt::transparent);
      QPainter pixPainter( &pix );
      svgRenderer.render( &pixPainter );
      
      QToolButton *pNewSolution = new QToolButton(this);
      pNewSolution->setSizePolicy(QSizePolicy::Fixed,QSizePolicy::Fixed);
      pNewSolution->setIconSize(QSize(ICON_SIZE_EXTRA,ICON_SIZE_EXTRA));
      pNewSolution->setIcon(QIcon(pix));
      

      Qt 5.5.1 32Bit on Linux

      Thanks for your help

      jsulmJ Offline
      jsulmJ Offline
      jsulm
      Lifetime Qt Champion
      wrote on last edited by
      #2

      @Gianluca86-0 said in SVG Icon problems:

      QPixmap

      Why don't you use the SVG with QIcon/QPixmap? Both should be able to load it without QSvgRenderer.
      See http://doc.qt.io/qt-5/qimagereader.html#supportedImageFormats

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

      1 Reply Last reply
      1
      • G Gianluca86 0

        Hi everyone,
        In my application I'm trying to include vector icons, but the display is incorrect.
        link Image SVG
        This image is created by IconGenerator of Axialis, if I open it with GIMP or Inkscape I see correctly.
        This is the code I use:

        QSvgRenderer svgRenderer( QString("book-new.svg") );
        QPixmap pix( ICON_SIZE_EXTRA, ICON_SIZE_EXTRA );
        pix.fill(Qt::transparent);
        QPainter pixPainter( &pix );
        svgRenderer.render( &pixPainter );
        
        QToolButton *pNewSolution = new QToolButton(this);
        pNewSolution->setSizePolicy(QSizePolicy::Fixed,QSizePolicy::Fixed);
        pNewSolution->setIconSize(QSize(ICON_SIZE_EXTRA,ICON_SIZE_EXTRA));
        pNewSolution->setIcon(QIcon(pix));
        

        Qt 5.5.1 32Bit on Linux

        Thanks for your help

        JonBJ Offline
        JonBJ Offline
        JonB
        wrote on last edited by
        #3

        @Gianluca86-0

        link Image SVG

        Is that link supposed to work, because it doesn't for me....?

        1 Reply Last reply
        0
        • G Offline
          G Offline
          Gianluca86 0
          wrote on last edited by
          #4

          @jsulm :
          Like this?

          pNewSolution->setIcon(QIcon("book-new.svg"));
          

          I tried but it is the same

          @JNBarchan : I'm sorry it does not work anymore and I do not know why.

          0_1510308755883_SVG.png

          1 Reply Last reply
          0
          • M Offline
            M Offline
            mostefa
            wrote on last edited by
            #5

            Hi @Gianluca86-0

            Is it possible to share an attachement of your svg image?

            1 Reply Last reply
            1
            • mrjjM Offline
              mrjjM Offline
              mrjj
              Lifetime Qt Champion
              wrote on last edited by
              #6

              @Gianluca86-0 said in SVG Icon problems:

              svgRenderer

              As far as i know, it only supports Tiny 1.2 Specification
              https://www.w3.org/TR/SVGMobile12/

              So if make sure its not using newer features when exporting.

              1 Reply Last reply
              2
              • G Offline
                G Offline
                Gianluca86 0
                wrote on last edited by
                #7

                This is the SVG code. The version is 1.1, so is not supported by QT? Is there a way to convert it to svg 1.2?

                <?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" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve">
                  <g id="main">
                    <clipPath id="clip_mask">
                      <path d="M20.9262,32C18.5189,30.6,16.9,27.9878,16.9,25c0,-4.4735,3.6265,-8.1,8.1,-8.1c2.9878,0,5.6,1.6189,7,4.0262V0L0,0l0,32H20.9262z" fill-rule="evenodd"/>
                    </clipPath>
                    <g id="icon" clip-path="url(#clip_mask)">
                      <g id="transformed_icon" transform="translate(-1 -1)">
                        <path d="M8,2c0,8.3346,0,16.6889,0,25c6.3721,0,13.6,0,20,0c0,-8.3538,0,-16.7075,0,-25C21.6,2,14.3401,2,8,2zM24,11.2c0,0.44,-0.36,0.8,-0.8,0.8H12.8c-0.44,0,-0.8,-0.36,-0.8,-0.8V6.8c0,-0.44,0.36,-0.8,0.8,-0.8h10.4c0.44,0,0.8,0.36,0.8,0.8V11.2z" fill="#3E79B4"/>
                        <path d="M26.9956,28.985c0,0.3628,0,0.6323,0,0.9956c-0.2301,0,-0.45,0,-0.6698,0c-6.5189,0,-14.0209,0.0003,-20.5398,-0.0003c-1.1748,-0.0001,-1.7568,-0.5742,-1.7568,-1.7329c-0.0005,-7.831,-0.0003,-15.662,-0.0002,-23.493c0,-1.6626,1.2289,-2.829,2.948,-2.7507c0,8.3362,0,16.6748,0,24.9972c-0.4664,0.168,-0.9616,0.3024,-1.4103,0.5288c-0.1915,0.0966,-0.4185,0.4042,-0.3932,0.5823c0.0372,0.2611,0.234,0.5866,0.4589,0.7115c0.2687,0.1492,0.6388,0.1552,0.9651,0.1556c6.2065,0.0079,13.3961,0.0058,19.6026,0.0058C26.4457,28.985,26.6914,28.985,26.9956,28.985z" fill="#3E79B4"/>
                        <path d="M23.2,12H12.8c-0.44,0,-0.8,-0.36,-0.8,-0.8V6.8c0,-0.44,0.36,-0.8,0.8,-0.8h10.4c0.44,0,0.8,0.36,0.8,0.8v4.4C24,11.64,23.64,12,23.2,12z" fill="#FFFFFF"/>
                        <rect x="13" y="7" width="10" height="4" fill="#DCE7F0"/>
                      </g>
                    </g>
                    <g id="overlay">
                      <path d="M31.5917,24.1917l-3.7512,-0.1566c-0.0422,-0.1243,-0.092,-0.2451,-0.1495,-0.3615l2.5416,-2.763c0.1595,-0.1595,0.1595,-0.418,0,-0.5775l-0.5657,-0.5657c-0.1595,-0.1595,-0.418,-0.1595,-0.5775,0l-2.763,2.5416c-0.1164,-0.0575,-0.2371,-0.1073,-0.3615,-0.1495l-0.1566,-3.7512c0,-0.2255,-0.1828,-0.4083,-0.4083,-0.4083h-0.8c-0.2255,0,-0.4083,0.1828,-0.4083,0.4083l-0.1566,3.7512c-0.1243,0.0422,-0.2451,0.092,-0.3615,0.1495l-2.763,-2.5416c-0.1595,-0.1595,-0.418,-0.1595,-0.5775,0l-0.5657,0.5657c-0.1595,0.1595,-0.1595,0.418,0,0.5775l2.5416,2.7631c-0.0575,0.1164,-0.1073,0.2372,-0.1495,0.3615l-3.7512,0.1566c-0.2255,0,-0.4083,0.1828,-0.4083,0.4083v0.8c0,0.2255,0.1828,0.4083,0.4083,0.4083l3.7512,0.1566c0.0422,0.1243,0.092,0.2451,0.1495,0.3615l-2.5416,2.763c-0.1595,0.1595,-0.1595,0.418,0,0.5775l0.5657,0.5657c0.1595,0.1595,0.418,0.1595,0.5775,0l2.763,-2.5416c0.1164,0.0575,0.2372,0.1073,0.3615,0.1495l0.1566,3.7512c0,0.2255,0.1828,0.4083,0.4083,0.4083h0.8c0.2255,0,0.4083,-0.1828,0.4083,-0.4083l0.1566,-3.7512c0.1243,-0.0422,0.2451,-0.092,0.3615,-0.1495l2.763,2.5416c0.1595,0.1595,0.418,0.1595,0.5775,0l0.5657,-0.5657c0.1595,-0.1595,0.1595,-0.418,0,-0.5775l-2.5416,-2.763c0.0575,-0.1164,0.1073,-0.2371,0.1495,-0.3615l3.7512,-0.1566c0.2255,0,0.4083,-0.1828,0.4083,-0.4083v-0.8C32,24.3745,31.8172,24.1917,31.5917,24.1917zM25,26.2c-0.6627,0,-1.2,-0.5373,-1.2,-1.2c0,-0.6627,0.5373,-1.2,1.2,-1.2s1.2,0.5373,1.2,1.2C26.2,25.6627,25.6627,26.2,25,26.2z" fill-rule="evenodd" fill="#298970"/>
                    </g>
                  </g>
                </svg>
                
                1 Reply Last reply
                0
                • mrjjM Offline
                  mrjjM Offline
                  mrjj
                  Lifetime Qt Champion
                  wrote on last edited by mrjj
                  #8

                  Hi
                  Sorry I cant answer that.
                  It seems not to like they way its merged using overlay/masking.
                  So if you can find a program that covert that to other way, then yes.
                  Alternative. combine yourself in inkscape not using clipmask.

                  1 Reply Last reply
                  0
                  • G Offline
                    G Offline
                    Gianluca86 0
                    wrote on last edited by
                    #9

                    Thanks for your help.
                    Now I get it. I hope to find a converter, otherwise I will use normal png files.

                    1 Reply Last reply
                    0
                    • mrjjM Offline
                      mrjjM Offline
                      mrjj
                      Lifetime Qt Champion
                      wrote on last edited by
                      #10

                      Np.
                      Just for reference.
                      This is correct look ?
                      alt text

                      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