Ubuntu SDK QML 如何更改TextField的背景颜色

Ubuntu SDK QML 如何更改TextField的背景颜色

我遇到过这样的情况:我的 QML 应用 MainView 的背景颜色导致文本字段条目在同样深棕色的背景上显示灰色字母。这几乎让人无法读取文本字段中输入的文本。

输入文本时没问题,因为背景变成白色并且深色文本现在可见,但是当未选择文本字段时,文本将无法读取。

有没有办法改变文本框的背景颜色?我已经尝试改变文本颜色,在不输入文本时可以正常工作,但是当我单击文本框输入文本时,我无法再阅读它,因为文本框的背景颜色变为白色,文本颜色也很浅。

有人可以提出解决这个问题的建议吗?

谢谢

答案1

Ubuntu SDK 带有自己的风格文本域元素。在深色背景上,您可以通过导入使用默认 Qt 版本QtQuick.Controls(仅限 14.04)。它将始终呈现白色背景,但也可以使用以下样式TextFieldStyle

import QtQuick 2.0
import Ubuntu.Components 0.1
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1

MainView {
    width: 400
    height: 300
    backgroundColor: "black"

    Column {
        spacing: units.gu(2)
        anchors.centerIn: parent
        TextField {
            placeholderText: "ask"
        }
        TextField {
            placeholderText: "Enter text"
            text: "ubuntu"
            style: TextFieldStyle {
                textColor: "black"
                background: Rectangle {
                    radius: 5
                    color: "gold"
                    implicitWidth: 100
                    implicitHeight: 24
                    border.color: "#333"
                    border.width: 1
                }
            }
        }
    }
}

它看上去将如下面的截图所示:

在此处输入图片描述

来源:http://qt-project.org/doc/qt-5/qml-qtquick-controls-styles-textfieldstyle.html

相关内容