How to display a QImage across landscape & portrait orientations with aspect ratio maintained & not cutting off image data



  • I have a QIMage that can be in portrait or landscape mode depending upon its width vs height. Or vice versa.

    I am trying to fit a portrait QIMage in landscape mode & a landscape QImage in portrait mode without breaking the aspect ratio.

    Following is how I am trying to do this:

    Window {
      id: app_window
      visible: true
        
      Rectangle {
        id: my_image_view_container
        width: my_image.sourceSize.width
        height: my_image.sourceSize.height
    
        // This is a Image item which has to host a portrait/landscape image.jpg in both portrait & landscape modes on an android device
        Image {
           id: my_image
           anchors.fill: parent
           // changes at runtime based on the image my app selects
           source: "random/path/to/an/image.jpg"
           scale: Qt.KeepAspectRatio
        }
      }
    }
    

    It basically works to preserve the aspect ratio. The image is not skewed when I resize my app_window from portrait to landscape.

    Problem:
    But in landscape mode if the app_window's height is less than my_image's height then the image is not fully visible.

    Question:
    How should I set the size of my_image_view_container & my_image to be able accomplish hosting image.jpg in both landscape & portrait orientations without breaking the aspect ratio as well not missing to view parts of the image in any mode?


  • Moderators

    Use this:

    fillMode: Image.PreserveAspectFit
    

    Docs:
    https://doc.qt.io/qt-5/qml-qtquick-image.html#fillMode-prop


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.