创建一个组件:TTextEdit.qml
可以编辑它的背景, 使⽤focus scope(焦点区域) 来更好的切换焦点
import QtQuick 2.0
FocusScope {
width: 96
height: 96
Rectangle {
anchors.fill: parent
color: "lightsteelblue"
border.color: "gray"
}
property alias text: input.text
property alias input: input
TextEdit {
id: input
anchors.fill: parent
anchors.margins: 4
focus: true
}
}
main.qml
import QtQuick 2.9
import QtQuick.Window 2.2
Window {
visible: true
width: 640
height: 480
Rectangle {
width: 136
height: 120
color: "linen"
TTextEdit {
id: input
x: 8; y: 8
width: 120
height: 104
focus: true
text: "编辑"
}
}
}
结果展示: