qt - 在 Qt Quick 中将 SVG 图像的 Canvas 大小减小到实际绘制的大小

Question

大家好! :)

我正在开发一个 Qt Quick Controls 2 应用程序，我需要缩小作为 ColumnLayout 一部分的 SVG 图像以适应屏幕高度。这是我的代码:

Page {
    title: "About"

    ColumnLayout {
        anchors.fill: parent
        spacing: 20

        Image {
            id: app_logo
            source: "images/app_logo.svg"
            mipmap: true
            Layout.maximumWidth: Math.min(parent.width, 300)
            Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
            verticalAlignment: Qt.AlignTop
            fillMode: Image.PreserveAspectFit
        }

        Label {
            text: "Version 0.1"
            font.pointSize: 15
            Layout.fillWidth: true
            horizontalAlignment: Qt.AlignHCenter
        }
    }
}

原始 SVG 大小为 1200x500，生成的绘制图像为 300x125，这也是由paintedWidth 和paintedHeight 属性显示的。我面临的问题是SVG的 Canvas 没有改变，保持1200x500，这将其他控件(例如标签)移出屏幕:



如何将 Canvas 大小设置为实际绘制的大小而不导致绑定(bind)循环？

Answer 1

在 Qt Quick 中使用 SVG 图像时，更改它们的 sourceSize 以匹配它们的项目大小:

Image {
        id: app_logo
        source: "images/app_logo.svg"
        mipmap: true
        Layout.maximumWidth: Math.min(parent.width, 300)
        Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
        verticalAlignment: Qt.AlignTop
        sourceSize: Qt.size(width, height) //important
    }

突出显示的行更改 Canvas (渲染)大小。