QT Quick - TextField 背景和边框

Question

我从 QT 开始并尝试使用以下 QML 代码设置 TextField 的样式：

property Component textfieldStyle: TextFieldStyle {
    background: BorderImage {
        source: control.focus ? "images/input-border-focused.png" : "images/input-border.png"
        border.left: 0 ; border.right: 0 ; border.top: 0 ; border.bottom: 4
    }
}

我的问题是：有没有办法像下图一样设置这样的边框以及字段内的图标？

蓝色部分是窗口的背景。

如果可以，怎么办？

提前谢谢你。

Answer 1

既然你必须为 TextFieldStyle 使用一个组件，你不限于使用 BorderImage，你可以使用例如这样的 Rectangle 创建你自己的 Field

TextField {
    style: TextFieldStyle {
        textColor: "black"
        background: Rectangle {
            radius: 2
            border.color: "red"
            border.width: 3

            Image {
                width: 10
                height: 10
                source: "qrc:///inner.png"
                anchors.verticalCenter: parent.verticalCenter
                anchors.left: parent.left
                anchors.leftMargin: 10
            }
        }
    }
}

由于 Rectangle 有边框属性，你可以直接使用它来设置边框。