status-desktop/ui/shared/StyledTextArea.qml
Alexandra Betouni 4ee21ada05 feat(desktop) Added image function in Style
Introduced Style.svg() Style.png() Style.emoji() and
Style.icon() in Style.qml. Those should be used to
set the source in Images instead of using relative
paths. Usage:
Image {
   source: Style.svg("check)
   ....

Also moved all Singletons inside a new "utils"
folder and made it a QML module, to use
import utils 1.0 instead of relative paths

Closes #3678
2021-09-28 15:28:00 -04:00

94 lines
2.9 KiB
QML

import QtQuick 2.12
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.3
import QtGraphicalEffects 1.12
import utils 1.0
Item {
property alias textField: textArea
property string placeholderText: "My placeholder"
property alias text: textArea.text
property string validationError: ""
property string label: ""
readonly property bool hasLabel: label !== ""
property color bgColor: Style.current.inputBackground
readonly property var forceActiveFocus: function () {
textArea.forceActiveFocus(Qt.MouseFocusReason)
}
readonly property int labelMargin: 7
property int customHeight: 44
property bool hideRectangle: false
signal keyPressed(var event)
id: inputBox
height: inputRectangle.height + (hasLabel ? inputLabel.height + labelMargin : 0) + (!!validationError ? validationErrorText.height : 0)
anchors.right: parent.right
anchors.left: parent.left
StyledText {
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
}
Rectangle {
id: inputRectangle
height: customHeight
color: hideRectangle ? Style.current.transparent : bgColor
radius: Style.current.radius
anchors.top: inputBox.hasLabel ? inputLabel.bottom : parent.top
anchors.topMargin: inputBox.hasLabel ? inputBox.labelMargin : 0
anchors.right: parent.right
anchors.left: parent.left
border.width: !!validationError && !hideRectangle ? 1 : 0
border.color: Style.current.red
TextArea {
id: textArea
text: ""
font.pixelSize: 15
selectByMouse: true
wrapMode: Text.WrapAnywhere
placeholderText: inputBox.placeholderText
anchors.rightMargin: Style.current.smallPadding
anchors.leftMargin: inputBox.hasIcon ? 36 : Style.current.smallPadding
anchors.bottomMargin: Style.current.smallPadding
anchors.topMargin: Style.current.smallPadding
anchors.fill: parent
font.family: Style.current.fontRegular.name
color: Style.current.textColor
placeholderTextColor: Style.current.secondaryText
selectionColor: Style.current.primarySelectionColor
Keys.onPressed: inputBox.keyPressed(event)
}
}
TextEdit {
visible: !!validationError
id: validationErrorText
text: validationError
anchors.top: inputRectangle.bottom
anchors.topMargin: 1
selectByMouse: true
readOnly: true
font.pixelSize: 12
color: Style.current.red
selectedTextColor: Style.current.textColor
selectionColor: Style.current.primarySelectionColor
}
}
/*##^##
Designer {
D{i:0;formeditorColor:"#ffffff";formeditorZoom:1.25}
}
##^##*/