LineEdit: added placeholder label, added input label

This commit is contained in:
Sander Ferdinand 2017-12-05 01:27:34 +01:00 committed by moneromooo-monero
parent a07fd46718
commit 901e77e6f1

View File

@ -31,8 +31,8 @@ import "." 1.0
Item { Item {
id: item id: item
property alias placeholderText: placeholderLabel.text
property alias text: input.text property alias text: input.text
property alias placeholderText: placeholderLabel.text
property alias validator: input.validator property alias validator: input.validator
property alias readOnly : input.readOnly property alias readOnly : input.readOnly
property alias cursorPosition: input.cursorPosition property alias cursorPosition: input.cursorPosition
@ -43,11 +43,20 @@ Item {
property int fontSize: 18 * scaleRatio property int fontSize: 18 * scaleRatio
property bool showBorder: true property bool showBorder: true
property bool error: false property bool error: false
property alias labelText: inputLabel.text
property alias labelColor: inputLabel.color
property alias labelTextFormat: inputLabel.textFormat
property string tipText: ""
property int labelFontSize: 16 * scaleRatio
property bool labelFontBold: false
property alias labelWrapMode: inputLabel.wrapMode
property alias labelHorizontalAlignment: inputLabel.horizontalAlignment
signal labelLinkActivated();
signal editingFinished() signal editingFinished()
signal accepted(); signal accepted();
signal textUpdated(); signal textUpdated();
height: 48 * scaleRatio height: (inputLabel.height + inputItem.height + 10) * scaleRatio
onTextUpdated: { onTextUpdated: {
// check to remove placeholder text when there is content // check to remove placeholder text when there is content
@ -76,17 +85,37 @@ Item {
return "transparent" return "transparent"
} }
Text {
id: inputLabel
anchors.top: parent.top
anchors.topMargin: 10 * scaleRatio
anchors.left: parent.left
font.family: Style.fontRegular.name
font.pixelSize: labelFontSize
font.bold: labelFontBold
textFormat: Text.RichText
color: "white"
onLinkActivated: item.labelLinkActivated()
}
Item{
id: inputItem
height: 48 * scaleRatio
anchors.top: inputLabel.bottom
anchors.topMargin: 6
width: parent.width
Text { Text {
id: placeholderLabel id: placeholderLabel
visible: input.text ? false : true
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: inlineIcon.visible ? 50 : 10 anchors.leftMargin: inlineIcon.visible ? 50 : 10
opacity: 0.25 opacity: 0.25
color: "#FFFFFF"
font.family: Style.fontRegular.name font.family: Style.fontRegular.name
font.pixelSize: 20 * scaleRatio font.pixelSize: 20 * scaleRatio
color: "#FFFFFF"
text: "" text: ""
visible: input.text ? false : true
z: 3 z: 3
} }
@ -121,7 +150,7 @@ Item {
id: input id: input
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: inlineIcon.visible ? 38 : 0 anchors.leftMargin: inlineIcon.visible ? 38 : 0
font.pixelSize: parent.fontSize font.pixelSize: item.fontSize
onEditingFinished: item.editingFinished() onEditingFinished: item.editingFinished()
onAccepted: item.accepted(); onAccepted: item.accepted();
onTextChanged: item.textUpdated() onTextChanged: item.textUpdated()
@ -131,5 +160,10 @@ Item {
id: inlineButtonId id: inlineButtonId
onClicked: inlineButtonId.onClicked onClicked: inlineButtonId.onClicked
visible: item.inlineButtonText ? true : false visible: item.inlineButtonText ? true : false
anchors.right: parent.right
anchors.rightMargin: 8
anchors.top: parent.top
anchors.topMargin: 8
}
} }
} }