mirror of
https://github.com/status-im/status-desktop.git
synced 2025-02-03 18:25:33 +00:00
937dd89146
Having all the different input types in one file made it simpler to design, but created an issue with memory, because all the aliases, properties and images were created for all types even if you only used a basic Input. I tried using Loaders, but making aliases within loaders is super painful/impossible in some cases.
92 lines
2.6 KiB
QML
92 lines
2.6 KiB
QML
import QtQuick 2.12
|
|
import QtQuick.Controls 2.3
|
|
import QtQuick.Layouts 1.3
|
|
import QtGraphicalEffects 1.12
|
|
import "../imports"
|
|
|
|
Item {
|
|
property alias textField: inputValue
|
|
property string placeholderText: "My placeholder"
|
|
property alias text: inputValue.text
|
|
property string label: ""
|
|
// property string label: "My Label"
|
|
readonly property bool hasLabel: label !== ""
|
|
property color bgColor: Theme.grey
|
|
// property url icon: "../app/img/hash.svg"
|
|
property url icon: ""
|
|
readonly property bool hasIcon: icon.toString() !== ""
|
|
readonly property var forceActiveFocus: function () {
|
|
inputValue.forceActiveFocus(Qt.MouseFocusReason)
|
|
}
|
|
readonly property int labelMargin: 7
|
|
property int customHeight: 44
|
|
|
|
id: inputBox
|
|
height: inputRectangle.height + (hasLabel ? inputLabel.height + labelMargin : 0)
|
|
anchors.right: parent.right
|
|
anchors.left: parent.left
|
|
|
|
Text {
|
|
id: inputLabel
|
|
text: inputBox.label
|
|
font.weight: Font.Medium
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 0
|
|
anchors.top: parent.top
|
|
anchors.topMargin: 0
|
|
font.pixelSize: 13
|
|
color: Theme.black
|
|
}
|
|
|
|
Rectangle {
|
|
id: inputRectangle
|
|
height: customHeight
|
|
color: bgColor
|
|
radius: 8
|
|
anchors.top: inputBox.hasLabel ? inputLabel.bottom : parent.top
|
|
anchors.topMargin: inputBox.hasLabel ? inputBox.labelMargin : 0
|
|
anchors.right: parent.right
|
|
anchors.left: parent.left
|
|
|
|
TextField {
|
|
id: inputValue
|
|
visible: !inputBox.isTextArea && !inputBox.isSelect
|
|
placeholderText: inputBox.placeholderText
|
|
text: inputBox.text
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: inputBox.hasIcon ? 36 : Theme.padding
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
font.pixelSize: 15
|
|
background: Rectangle {
|
|
color: "#00000000"
|
|
}
|
|
}
|
|
|
|
Image {
|
|
id: iconImg
|
|
sourceSize.height: 24
|
|
sourceSize.width: 24
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 10
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
fillMode: Image.PreserveAspectFit
|
|
source: inputBox.icon
|
|
}
|
|
}
|
|
|
|
MouseArea {
|
|
id: mouseArea
|
|
anchors.fill: parent
|
|
onClicked: {
|
|
inputValue.forceActiveFocus(Qt.MouseFocusReason)
|
|
}
|
|
}
|
|
}
|
|
|
|
/*##^##
|
|
Designer {
|
|
D{i:0;formeditorColor:"#ffffff";formeditorZoom:1.25}
|
|
}
|
|
##^##*/
|
|
|