使矩形宽度填充ScrollView

Question

我正试图在ScrollView中获得一些东西，以便在width中展开以适应屏幕。ScrollView固定在主窗口上。

例如，Rectangle:

ScrollView {
    anchors.fill: parent //mainWindow
    Rectangle {
        color: "light grey"
        height: 1000
        width: mainWindow.width
    }
}

但当垂直滚动条出现时，它会遮挡Rectangle。我可以用一个神奇的常数来修复它：

width: mainWindow.width - 20

但是，如果有人的电脑上有更大的滚动条呢？此外，当垂直滚动条不可见时，它会在右侧留下一个丑陋的空白。

有没有一种方法可以自动了解ScrollView内部的可用空间？

Answer 1

无需显式调整滚动条。你可以让它填满整个可用的父空间。如果你想指定边距：

ScrollView {
    id: scrollView
    anchors.fill: parent // mainWindow ?
    anchors.centerIn: parent // anchoring as asked
    anchors.margins: 20
    contentItem:
        Rectangle {
        id: rectScroll
        width: scrollView.viewport.width  // set as viewport
        height: 1000 // set to what you need
    }
}

最初的问题之所以得到解决，主要是因为Rectangle的width属性设置为parent.parent.width或scrollView.viewport.width更合适。后者肯定更好，只要滚动区域的精确视口的width而不是父width（通常不能保证只包含这个ScrollView）。