如何在横向和纵向方向上显示QImage，保持纵横比并且不切断图像数据

Question

我有一个可以在肖像或景观模式处处于宽度 vs vs 高度的Qimage。或相反亦然。

我试图将肖像qimage拟合到景观模式＆amp;A 肖像模式中的景观Qimage 而不会破坏纵横比。

以下是我尝试这样做的方式：

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
    }
  }
}

它基本上可以保持纵横比。当我将app_window大小从肖像到风景调整时，图像不会偏斜。

问题：
但是在景观模式下，如果app_window的高度小于my_image的高度，则图像不完全可见。

问题：
我应该如何设置my_image_view_container＆amp;my_image能够在景观中完成托管image.jpg＆amp;肖像方向而不打破纵横比，也不会缺少以任何模式查看图像的一部分？

PS：
挑战是：我拍摄QML快照＆amp;创建了100个单位宽度x 300单位高度的Qimage。现在，将移动设备的方向更改为桌面上的窗口大小。现在，我需要将300单位高度的Qimage安装到100个单位的高度。如何设置宽度＆amp;Qimage的高度可以很好地完成这项工作？我看到，当您在景观模式下查看肖像捕获图像时，Android上的Google照片可以很好地嵌入图像的两个侧面，从而可以很好地做到这一点。VID VERSA。我希望准确地实现Google照片的这种功能。设置正确的宽度＆amp;应该可以做到。图像QML元素的高度？

Answer 1

对于您的情况，您可以根据当前像素密度和屏幕状态选择绑定来选择其他图像。根据官方文档：

绑定使对象能够自动更新其属性，以响应其他对象中的变化属性或某些外部事件的发生。

检查有关现代QT可伸缩性的文档，我认为这确实很有用。您可以通过比较宽度＆amp;可以轻松地检查屏幕，景观或肖像情况的当前状态。身高：

 parameter:  width > height ? contition_1 : condition_2

在您的情况下，我建议根据国家的不同图像具有2个不同的图像。在官方文档中，您可以找到一个目标观察者，旨在完成您想要的绑定。顺便说一句，您可以做这样的事情：

Image {
   source: {
      if (width > height)
        "image_1.png"
      else
        "image_2.png"
    }
}

[update]

作为替代方案，如果要使用相同的图像，则可以处理屏幕类的属性方向。如果适合图像大小，则通过属性宽度，高度到屏幕。屏幕。高度属性就足够了。如果您打算使用自定义代码，则：

Image {
    id: image
    source: "image.jpg"
    width: whatever
    height: whatever 
    fillMode: Image.PreserveAspectFit
    anchors.top: parent.top
    Screen.onOrientationChanged: {
       if (Screen.primaryOrientation === Qt.PortraitOrientation) {
          image.width = 300;
          image.heigh = 100; 
       } else {
          image.width = 100;
          image.heigh = 300;
       }
    }
}