如何更改图像大小以适应其他屏幕并在 Qt creator qml 中保留纵横比答案

【问题标题】：How do I change imagesize to fit on other screens and preserve aspect-ratio in Qt creator qml如何更改图像大小以适应其他屏幕并在 Qt creator qml 中保留纵横比
【发布时间】：2021-01-24 02:40:01
【问题描述】：

我已经用 Qt quick qml - 代码构建了我的第一个用户界面。所有图片都放在正确的位置，x和y坐标，ui的标准尺寸是width:1540和height:540。但我希望它适合分辨率为 1024 x 768 的 ipad。如何缩放整个 ui 以适合其他屏幕并保持纵横比并且 ui 在两个屏幕上看起来都一样？

我的代码如下所示：

    import QtQuick 2.0
    import QtQuick.Window 2.0
    import QtGraphicalEffects 1.0

    Item{
        id: root
        focus: true
        width:1440
        height:540

    ...

    Image {
        id: layer_0
        source: "images/layer_0.png"
        x: 0
        y: 0
        opacity: 1
    }
    Image {
        id: layer_1
        source: "images/layer_1.png"
        x: 4
        y: 1
        opacity: 1
    }
    Image {
        id: emap
        source: "images/€map.png"
        opacity: 1
    }

    ...

    }

【问题讨论】：

请在问题中格式化您的代码，以便于阅读。
通过布局、锚点或表格视图。保存纵横比不存在其他方法。

标签： qt qml aspect-ratio

【解决方案1】：

您好，您可以在每个图像组件中添加：

fillMode: Image.PreserveAspectFit

为了更好地控制不同的屏幕尺寸，请考虑使用 Grid 组件来组织所有内容。

【讨论】：