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. Not scaling svg in Image
Forum Updated to NodeBB v4.3 + New Features

Not scaling svg in Image

Scheduled Pinned Locked Moved Solved QML and Qt Quick
13 Posts 5 Posters 1.7k 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.
  • M Mihaill

    Hi.
    I using svg in Image. And when I increase size Image, quality not increased, image is blurred. How I can increase size Image and increase quality?

    O Offline
    O Offline
    odelaune
    wrote on last edited by
    #2

    @Mihaill which object do you use to disply the SVG file?
    If this is a QPixmap, then what you get is the expected behaviour because QPixmap convert the SVG to a matrix image before being displayed.

    M 1 Reply Last reply
    0
    • O odelaune

      @Mihaill which object do you use to disply the SVG file?
      If this is a QPixmap, then what you get is the expected behaviour because QPixmap convert the SVG to a matrix image before being displayed.

      M Offline
      M Offline
      Mihaill
      wrote on last edited by Mihaill
      #3

      @odelaune It's not widgets. I use QML image and set source.

      Image {
                  id: imageMap
                  source: "/path/to/file/or/data/from/file"
                  anchors.verticalCenter: parent.verticalCenter
                  anchors.horizontalCenter: parent.horizontalCenter
                  width: flickableMap.contentWidth * 0.2
                  height: flickableMap.contentHeight * 0.2
                  fillMode: Image.PreserveAspectFit
      
      JoeCFDJ 1 Reply Last reply
      0
      • M Mihaill

        @odelaune It's not widgets. I use QML image and set source.

        Image {
                    id: imageMap
                    source: "/path/to/file/or/data/from/file"
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.horizontalCenter: parent.horizontalCenter
                    width: flickableMap.contentWidth * 0.2
                    height: flickableMap.contentHeight * 0.2
                    fillMode: Image.PreserveAspectFit
        
        JoeCFDJ Offline
        JoeCFDJ Offline
        JoeCFD
        wrote on last edited by
        #4

        @Mihaill can you show your pic? If it is too complicated, svg may not be able to keep the resolution.

        M 1 Reply Last reply
        0
        • JoeCFDJ JoeCFD

          @Mihaill can you show your pic? If it is too complicated, svg may not be able to keep the resolution.

          M Offline
          M Offline
          Mihaill
          wrote on last edited by
          #5

          @JoeCFD I cant load heare svg file. All vector graphics are scaled.

          JoeCFDJ 1 Reply Last reply
          0
          • M Mihaill

            @JoeCFD I cant load heare svg file. All vector graphics are scaled.

            JoeCFDJ Offline
            JoeCFDJ Offline
            JoeCFD
            wrote on last edited by
            #6

            @Mihaill
            There are two notable reasons why you may not choose to use an SVG file.
            1. Not the right format for high-quality or detailed photos. Designers create vector graphics with points and paths, not pixels. ...
            2. Requires some knowledge of code. SVG is an XML-based scene description language for graphics.

            I have a background image with a lot of machines and svg does not help in its display. Therefore, it was made to png.

            M 1 Reply Last reply
            0
            • JoeCFDJ JoeCFD

              @Mihaill
              There are two notable reasons why you may not choose to use an SVG file.
              1. Not the right format for high-quality or detailed photos. Designers create vector graphics with points and paths, not pixels. ...
              2. Requires some knowledge of code. SVG is an XML-based scene description language for graphics.

              I have a background image with a lot of machines and svg does not help in its display. Therefore, it was made to png.

              M Offline
              M Offline
              Mihaill
              wrote on last edited by
              #7

              @JoeCFD With my svg file all good, I can scaled his in Inkscape. What me need doing with my svg? Me need scaled image.

              1 Reply Last reply
              0
              • S Offline
                S Offline
                SimonSchroeder
                wrote on last edited by
                #8

                I am not an expert in QML as I am always using QWidgets. Inside QWidgets you would use something like QPixmap or QImage. Both render the SVG file with a certain resolution and forget about the source. This is why it would also look pixelated using QWidgets. There, I would write code that reacts to the scaling and reloads the SVG every time to have the proper size (maybe a trick would be to load it with twice the pixelRatio and hope it looks fine when scaled like this).

                I am not sure how (or if) this approach translates to QML. Can you react to the resizing in QML and then "change" the image to the same SVG file?

                M 1 Reply Last reply
                0
                • S SimonSchroeder

                  I am not an expert in QML as I am always using QWidgets. Inside QWidgets you would use something like QPixmap or QImage. Both render the SVG file with a certain resolution and forget about the source. This is why it would also look pixelated using QWidgets. There, I would write code that reacts to the scaling and reloads the SVG every time to have the proper size (maybe a trick would be to load it with twice the pixelRatio and hope it looks fine when scaled like this).

                  I am not sure how (or if) this approach translates to QML. Can you react to the resizing in QML and then "change" the image to the same SVG file?

                  M Offline
                  M Offline
                  Mihaill
                  wrote on last edited by
                  #9

                  @SimonSchroeder updating image not help me, Image rendered svg with big pixels.

                  johngodJ 1 Reply Last reply
                  0
                  • M Mihaill

                    @SimonSchroeder updating image not help me, Image rendered svg with big pixels.

                    johngodJ Offline
                    johngodJ Offline
                    johngod
                    wrote on last edited by
                    #10

                    @Mihaill set the Image mipmap property to true

                    mipmap: true
                    
                    M 1 Reply Last reply
                    1
                    • johngodJ johngod

                      @Mihaill set the Image mipmap property to true

                      mipmap: true
                      
                      M Offline
                      M Offline
                      Mihaill
                      wrote on last edited by
                      #11

                      @johngod It's too not help me. Scaled image are blurred.

                      JoeCFDJ 1 Reply Last reply
                      0
                      • M Mihaill

                        @johngod It's too not help me. Scaled image are blurred.

                        JoeCFDJ Offline
                        JoeCFDJ Offline
                        JoeCFD
                        wrote on last edited by
                        #12

                        @Mihaill
                        using sourceSize
                        https://forum.qt.io/topic/11859/solved-rendering-svg-images

                        M 1 Reply Last reply
                        0
                        • JoeCFDJ JoeCFD

                          @Mihaill
                          using sourceSize
                          https://forum.qt.io/topic/11859/solved-rendering-svg-images

                          M Offline
                          M Offline
                          Mihaill
                          wrote on last edited by
                          #13

                          @JoeCFD Thanks, it is help me

                          sourceSize.width: paintedWidth
                          sourceSize.height: paintedHeight
                          
                          1 Reply Last reply
                          0
                          • M Mihaill has marked this topic as solved on

                          • Login

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