Javascript 记住QML元素中的滚动位置

我有一些qml作为应用程序的输出（有点像只读控制台）。然而，使用它很烦人，因为当它打印信息时，它会卷回顶部

例如，假设我每秒打印一行到我的

TextArea

，大约一分钟后，我将有足够的行，现在我有了一个滚动条。我滚动到底部，一秒钟后，一行文本被打印出来，使其滚动回到顶部

我想要的功能是自动滚动到底部（很像控制台打印内容时的样子），除非用户通过向上滚动来覆盖它，否则文本应该保持不变。我希望这是有意义的，以下是一些代码：

        ScrollArea {
            id: helpTextScrollArea
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: myButton.bottom
            anchors.topMargin: 5
            anchors.bottom: parent.bottom
            visible: false
            horizontalScrollBar.visible: false

            onVisibleChanged: {
                helpText.visible = visible
            }

            HelpTextArea {
                id: helpText
                width: parent.parent.width - helpTextScrollArea.verticalScrollBar.width
                text: "Oops, no documentation."

                onVisibleChanged: {
                    if(helpTextScrollArea.visible != visible) {
                        helpTextScrollArea.visible = visible
                    }
                }
            }
        }

        Flickable
        {
            id: flick

            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: runStopButton.bottom
            anchors.bottom: parent.bottom
            anchors.topMargin: 5


            TextArea{

                id: messageArea
                anchors.fill: parent

                focus: true

                readOnly: true

                visible: !helpTextScrollArea.visible

                wrapMode: TextEdit.Wrap

                function addText(newText) {
                    text += newText + "\n"
                }
            }
        }

---

注意：我不认为我的Flickable做了什么，它是我尝试解决问题的一部分。此外，我还使用函数

addText

打印到文本区域。我对qml几乎一无所知，而且大部分代码都是由其他人编写的，我正在尝试使用它。谢谢大家!

您可以将

Flickable

的

contentY

属性绑定到将计算正确位置的表达式

Flickable {
    id: flick
    states: State {
        name: "autoscroll"
        PropertyChanges {
            target: flick
            contentY: messageArea.height - height
        }
    }
    onMovementEnded: {
        if (contentY === messageArea.height - height) {
            state = "autoscroll"
        }
        else {
            state = ""  // default state
        }
    }
    // ...
}

---

Flickable在visibleArea.*中有4个只读属性（您可以在QML文档中了解它们的含义）：

• 可视区域.xPosition：xPosition=contentX/contentWidth
• 可视区域yPosition：yPosition=contentY/contentHeight
• 可视区域宽度比率：宽度比率=宽度/内容宽度
• 可视区域高度比率：高度比率=高度/内容高度

---

如果您使用的是GridView而不是Flickable，则可以使用这些方法

positionViewAtBeginning()

positionViewAtEnd()

positionViewAtIndex(int index, PositionMode mode)

我发现这些方法非常有用，因为在添加文本行时，只需调用GridView中的

positionViewAtEnd（）

方法即可

希望能有帮助