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

Canvas resize

Scheduled Pinned Locked Moved QML and Qt Quick
12 Posts 2 Posters 3.6k 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.
  • Q Offline
    Q Offline
    qomg
    wrote on last edited by
    #1

    I'm trying to do so in order to "Canvas" accepted dimensions of the image. I need this is because I write "Canvas" to the file. All the time I get tired of that "Canvas" does not accept the dimensions of the new image. Maybe there is a person who knows how to solve it?

    Here is my broken code:

    @import QtQuick 2.2
    import QtQuick.Controls 1.1

    ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }
    
    Image {
        id: myImage
        source: "http://i.snag.gy/5VVZR.jpg"
    }
    
    Canvas {
        anchors.bottom: parent.bottom
        width: myImage.width
        height: myImage.height
    
        onPaint: {
            var ctx = getContext("2d")
            ctx.drawImage(myImage, 0, 0)
        }
    }
    
    MouseArea {
        anchors.fill: parent
    
        onClicked: {
            myImage.source = "http://i.snag.gy/qLdPZ.jpg"
        }
    }
    

    }@

    1 Reply Last reply
    0
    • p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      Hi,

      bq. “Canvas” does not accept the dimensions of the new image

      Do you mean you want to draw the image using canvas with certain width and height ?
      If so, then you can try this overloaded function
      @
      ctx.drawImage(myImage, 0, 0,50,50)
      @

      will draw image of dimension 50x50

      157

      1 Reply Last reply
      0
      • Q Offline
        Q Offline
        qomg
        wrote on last edited by
        #3

        I want to "Canvas" always accept what the image dimensions will be loaded.
        I also tried like you say.
        @import QtQuick 2.2
        import QtQuick.Controls 1.1

        ApplicationWindow {
        visible: true
        width: 640
        height: 480
        color: "blue"
        title: qsTr("Hello World")

        menuBar: MenuBar {
            Menu {
                title: qsTr("File")
                MenuItem {
                    text: qsTr("Exit")
                    onTriggered: Qt.quit();
                }
            }
        }
        
        Image {
            id: myImage
            source: "http://i.snag.gy/5VVZR.jpg"
            //onWidthChanged: myCanvas.width = width
            //onHeightChanged: myCanvas.height = height
        }
        
        Canvas {
            id: myCanvas
            anchors.bottom: parent.bottom
            width: myImage.width
            height: myImage.height
        
            onPaint: {
                var ctx = getContext("2d")
                ctx.drawImage(myImage, 0, 0)
                //ctx.drawImage(myImage, 0, 0, myImage.width, myImage.height)
            }
        }
        
        MouseArea {
            anchors.fill: parent
        
            onClicked: {
                myImage.source = "http://i.snag.gy/qLdPZ.jpg"
                //myCanvas.requestPaint()
            }
        }
        

        }
        @

        1 Reply Last reply
        0
        • p3c0P Offline
          p3c0P Offline
          p3c0
          Moderators
          wrote on last edited by
          #4

          Sorry, but i'm not actully understanding your question.
          Do you want to set the width and height of Canvas to that of myImage ?

          157

          1 Reply Last reply
          0
          • Q Offline
            Q Offline
            qomg
            wrote on last edited by
            #5

            bq. Sorry, but i’m not actully understanding your question.
            Do you want to set the width and height of Canvas to that of myImage ?

            Yes. I want to canvas element always have the same dimensions as the image even if I load another image with different dimensions.

            1 Reply Last reply
            0
            • p3c0P Offline
              p3c0P Offline
              p3c0
              Moderators
              wrote on last edited by
              #6

              Then your 1st code works as expected. I tested with Qt5.3.1

              157

              1 Reply Last reply
              0
              • Q Offline
                Q Offline
                qomg
                wrote on last edited by
                #7

                I have Qt 5.3. For me it looks like this.
                http://i.imgur.com/XT4j1E5.png
                http://i.imgur.com/icVU9nq.png

                Share your snapshots.

                1 Reply Last reply
                0
                • p3c0P Offline
                  p3c0P Offline
                  p3c0
                  Moderators
                  wrote on last edited by
                  #8

                  Here:

                  http://imgur.com/KxXvvs0

                  157

                  1 Reply Last reply
                  0
                  • p3c0P Offline
                    p3c0P Offline
                    p3c0
                    Moderators
                    wrote on last edited by
                    #9

                    May be it is taking time to load the other image on your network and hence unable to determine the size.
                    You could try getting the "status":http://qt-project.org/doc/qt-5/qml-qtquick-image.html#status-prop of it and then assigning the dimensions.

                    157

                    1 Reply Last reply
                    0
                    • Q Offline
                      Q Offline
                      qomg
                      wrote on last edited by
                      #10

                      I will install qt again. This may solve the problem.

                      1 Reply Last reply
                      0
                      • Q Offline
                        Q Offline
                        qomg
                        wrote on last edited by
                        #11

                        I struggled with this for a few days, and the problem was solved by reinstalling Qt :)

                        Thanks p3c0

                        1 Reply Last reply
                        0
                        • p3c0P Offline
                          p3c0P Offline
                          p3c0
                          Moderators
                          wrote on last edited by
                          #12

                          That's strange. Did you notice anything during reinstallation that you might have missed in first ?

                          157

                          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