diff options
Diffstat (limited to 'examples/declarative/modelviews/webview/content/FieldText.qml')
-rw-r--r-- | examples/declarative/modelviews/webview/content/FieldText.qml | 157 |
1 files changed, 157 insertions, 0 deletions
diff --git a/examples/declarative/modelviews/webview/content/FieldText.qml b/examples/declarative/modelviews/webview/content/FieldText.qml new file mode 100644 index 0000000..d1d003f --- /dev/null +++ b/examples/declarative/modelviews/webview/content/FieldText.qml @@ -0,0 +1,157 @@ +import Qt 4.7 + +Item { + id: fieldText + height: 30 + property string text: "" + property string label: "" + property bool mouseGrabbed: false + signal confirmed + signal cancelled + signal startEdit + + function edit() { + if (!mouseGrabbed) { + fieldText.startEdit(); + fieldText.state='editing'; + mouseGrabbed=true; + } + } + + function confirm() { + fieldText.state=''; + fieldText.text = textEdit.text; + mouseGrabbed=false; + fieldText.confirmed(); + } + + function reset() { + textEdit.text = fieldText.text; + fieldText.state=''; + mouseGrabbed=false; + fieldText.cancelled(); + } + + Image { + id: cancelIcon + width: 22 + height: 22 + anchors.right: parent.right + anchors.rightMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "pics/cancel.png" + opacity: 0 + } + + Image { + id: confirmIcon + width: 22 + height: 22 + anchors.left: parent.left + anchors.leftMargin: 4 + anchors.verticalCenter: parent.verticalCenter + source: "pics/ok.png" + opacity: 0 + } + + TextInput { + id: textEdit + text: fieldText.text + focus: false + anchors.left: parent.left + anchors.leftMargin: 0 + anchors.right: parent.right + anchors.rightMargin: 0 + anchors.verticalCenter: parent.verticalCenter + color: "black" + font.bold: true + readOnly: true + onAccepted: confirm() + Keys.onEscapePressed: reset() + } + + Text { + id: textLabel + x: 5 + width: parent.width-10 + anchors.verticalCenter: parent.verticalCenter + horizontalAlignment: Text.AlignHCenter + color: fieldText.state == "editing" ? "#505050" : "#AAAAAA" + font.italic: true + font.bold: true + text: label + opacity: textEdit.text == '' ? 1 : 0 + Behavior on opacity { + NumberAnimation { + property: "opacity" + duration: 250 + } + } + } + + MouseArea { + anchors.fill: cancelIcon + onClicked: { reset() } + } + + MouseArea { + anchors.fill: confirmIcon + onClicked: { confirm() } + } + + MouseArea { + id: editRegion + anchors.fill: textEdit + onClicked: { edit() } + } + + states: [ + State { + name: "editing" + PropertyChanges { + target: confirmIcon + opacity: 1 + } + PropertyChanges { + target: cancelIcon + opacity: 1 + } + PropertyChanges { + target: textEdit + color: "black" + readOnly: false + focus: true + selectionStart: 0 + selectionEnd: -1 + } + PropertyChanges { + target: editRegion + opacity: 0 + } + PropertyChanges { + target: textEdit.anchors + leftMargin: 34 + } + PropertyChanges { + target: textEdit.anchors + rightMargin: 34 + } + } + ] + + transitions: [ + Transition { + from: "" + to: "*" + reversible: true + NumberAnimation { + properties: "opacity,leftMargin,rightMargin" + duration: 200 + } + ColorAnimation { + property: "color" + duration: 150 + } + } + ] +} |