QML TextEdit中的占位文本

Question

我正在寻找一种方法来显示文本提示，以告知用户期望的输入。以Google搜索栏为例:

这是否有我所缺失的属性，还是需要通过编写脚本来实现？

- Herr von Wurst

Answer 1

在Qt Quick输入项上不存在该属性。您可以在此处投票支持该功能。

同时，您可以使用来自Qt Quick Controls 2的 TextArea 。

如果您更愿意使用纯Qt Quick，则可以类似于控件所做的方式，在字段上方添加 Text 项：

import QtQuick 2.5
import QtQuick.Window 2.2

Window {
    width: 300
    height: 300
    visible: true

    TextEdit {
        id: textEdit
        width: 200
        height: 50

        property string placeholderText: "Enter text here..."

        Text {
            text: textEdit.placeholderText
            color: "#aaa"
            visible: !textEdit.text
        }
    }
}

- Mitch

---

Qt Quick Controls 1 中的 TextField 也可以实现这个功能。 - GrecKo

Answer 2

虽然这个问题有点老，但我发现在Android构建中还有另一个需要解决的问题。 由于Android只在你按虚拟键盘上的“确认”按钮后才发送文本编辑信号，因此占位符仍然存在。为了避免这种情况，我建议：

TextEdit {
    id: textEdit
    width: 200
    height: 50

    property string placeholderText: "Enter text here..."

    Text {
        text: textEdit.placeholderText
        color: "#aaa"
        visible: !textEdit.text && !textEdit.activeFocus // <----------- ;-)
    }
}

- Renato Caetano

Answer 3

如果您想要单行输入，为什么不使用TextField呢？

- 너를 속였다