QML 文本滚动答案

【问题标题】：QML text scrollQML 文本滚动
【发布时间】：2011-03-22 17:08:50
【问题描述】：

我正在使用 C++ 和 QML 创建一个漂亮的界面。我想要一个“控制台视图”，随着时间的推移会打印出大量的文本。但是，当文本项的文本或 webview 内容增长时，视图不会“向下滚动”。

如何使 text/webview 项底部的文本始终保持可见？

我尝试过使用 flickable 和 the_webview.evaluateJavaScript + window.scrollTo ，但我无法让它们做我想做的事。这似乎是一个相当简单的 UI，但我在使用 QML 时遇到了严重的麻烦。

谢谢你的回答。

【问题讨论】：

标签： c++ qt webview qml

【解决方案1】：

是的，我会使用包含 Text 对象的 Flickable。每当您向Text 添加文本时，请检查其paintedHeight，如果更大，请调整Flickable 的contentY。

【讨论】：

这启发了我的最终解决方案：

【解决方案2】：

也许您应该考虑使用ListView 并将消息作为视图中的项目。然后你可以使用ListView::positionViewAtEnd。

【讨论】：

【解决方案3】：

funkybro 的回答启发了我的最终解决方案：

function scroll_to_bottom() {
    flickabe_item.contentY = 
        Math.max(0, webview_item.height - flickabe_item.height);
    return;
}

谢谢！

【讨论】：

【解决方案4】：

我对此的解决方案是垂直翻转内容和 Flickable。这样，文本以正确的方式结束，并自然地锚定在可滑动区域的底部。

由于变换是由 OpenGL 在幕后处理的，因此它也可能更有效。

Flickable {
    id: flick
    anchors.fill: parent
    contentHeight: text.height
    Text {
        id: text
        width: parent.width
        transform: Scale { yScale: -1; origin.y: text.height/2 }
    }

    transform: Scale { yScale: -1; origin.y: flick.height/2 }
}

【讨论】：