☰

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

tag-icon • tag-icon application-development ubuntu-touch ubuntu-sdk qml
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

相关内容