qml 可滑动画布加载内容不会调整大小且无法滑动答案

【问题标题】：qml flickable canvas load content doesn't resize and cannot flickqml 可滑动画布加载内容不会调整大小且无法滑动
【发布时间】：2019-01-13 20:10:00
【问题描述】：

我有一个Flickable 和一个孩子Canvas 和Image。我正在单击按钮将图像加载到Image 的source 中。这一切都有效。问题是 flickable 不会将其尺寸刷新为图像的尺寸，因此整个图像是“flickable”的，我可以滚动它（它比可视窗口大）。但是，如果我调整窗口大小，它会刷新，然后我可以在图像周围轻弹。

我猜这是因为窗口正在重绘，qml 正在重新读取img.width 和img.height 值以重绘Flickable。

（仅供参考，如果我在启动应用程序时加载图像，Flickable 按预期工作，只有当我在单击按钮时加载图像时，一旦应用程序运行，窗口需要重绘（或调整大小）才能获得Flickable 按预期工作

Flickable {
    id: flickableCanvas
    anchors.fill: parent
    Item {
        id: source
        width: Math.max(parent.width,img.width)
        height: Math.max(parent.height,img.height)
    Image
    {
        id: img
    }
    Canvas {
        id: myCanvas
        }
    }
}

Connections {
    target: QmlBridge
    onLoadImage: {
        img.source = p
        myCanvas.requestPaint()
        flickableCanvas.contentWidth = img.width
        flickableCanvas.contentHeight = img.height
    }

}

【问题讨论】：

标签： image qt qml flickable

【解决方案1】：

您似乎正试图在图像加载之前访问它的width/height。

您应该将您的 Flickable contentWidth/contentHeight 分配移动到 Image 组件下：

Image {
    id: im
    onStatusChanged: {
        if (status === Image.Ready) {
            flickableCanvas.contentWidth = img.width
            flickableCanvas.contentHeight = img.height
        }
    }
}

// ...

Connections {
    target: QmlBridge
    onLoadImage: {
        img.source = p
        myCanvas.requestPaint()
        // flickableCanvas.contentWidth = img.width
        // flickableCanvas.contentHeight = img.height
    }

}

但我认为您甚至不必手动设置这些属性。只需将它们绑定到您的 img 宽度/高度，您就可以做得更简单：

Flickable {
    id: flickableCanvas
    anchors.fill: parent
    contentWidth: img.width // no need for future assignment
    contentHeight: img.height
    // ...
}

【讨论】：