QGCTextField.qml 4.11 KB
Newer Older
1 2
import QtQuick                  2.3
import QtQuick.Controls         1.2
3
import QtQuick.Controls.Styles  1.4
4
import QtQuick.Layouts          1.2
5

6 7
import QGroundControl.Palette       1.0
import QGroundControl.ScreenTools   1.0
8 9

TextField {
10 11 12 13
    id:                 root
    textColor:          qgcPal.textFieldText
    implicitHeight:     ScreenTools.implicitTextFieldHeight
    activeFocusOnPress: true
14

15 16
    property bool   showUnits:  false
    property bool   showHelp:   false
17
    property string unitsLabel: ""
18

19 20 21 22
    signal helpClicked

    property real _helpLayoutWidth: 0

23 24
    Component.onCompleted: selectAllIfActiveFocus()
    onActiveFocusChanged: selectAllIfActiveFocus()
25

26
    QGCPalette { id: qgcPal; colorGroupEnabled: enabled }
27

28 29 30 31 32 33 34
    onEditingFinished: {
        if (ScreenTools.isMobile) {
            // Toss focus on mobile after Done on virtual keyboard. Prevent strange interactions.
            focus = false
        }
    }

35 36 37 38 39 40
    function selectAllIfActiveFocus() {
        if (activeFocus) {
            selectAll()
        }
    }

Don Gagne's avatar
Don Gagne committed
41
    QGCLabel {
42 43
        id:             unitsLabelWidthGenerator
        text:           unitsLabel
dogmaphobic's avatar
dogmaphobic committed
44
        width:          contentWidth + parent.__contentHeight * 0.666
45 46
        visible:        false
        antialiasing:   true
Don Gagne's avatar
Don Gagne committed
47
    }
48

Don Gagne's avatar
Don Gagne committed
49
    style: TextFieldStyle {
50
        font.pointSize: ScreenTools.defaultFontPointSize
Don Gagne's avatar
Don Gagne committed
51 52 53
        background: Item {
            id: backgroundItem

54 55
            property bool showHelp: control.showHelp && control.activeFocus

Don Gagne's avatar
Don Gagne committed
56
            Rectangle {
dogmaphobic's avatar
dogmaphobic committed
57 58 59
                anchors.fill:           parent
                anchors.bottomMargin:   -1
                color:                  "#44ffffff"
Don Gagne's avatar
Don Gagne committed
60 61 62
            }

            Rectangle {
dogmaphobic's avatar
dogmaphobic committed
63
                anchors.fill:           parent
64
                border.color:           root.activeFocus ? "#47b" : "#999"
65
                color:                  qgcPal.textField
Don Gagne's avatar
Don Gagne committed
66 67
            }

68 69 70 71 72 73
            RowLayout {
                id:                     unitsHelpLayout
                anchors.top:            parent.top
                anchors.bottom:         parent.bottom
                anchors.rightMargin:    backgroundItem.showHelp ? 0 : control.__contentHeight * 0.333
                anchors.right:          parent.right
74
                spacing:                ScreenTools.defaultFontPixelWidth / 4
75 76 77 78 79

                Component.onCompleted:  control._helpLayoutWidth = unitsHelpLayout.width
                onWidthChanged:         control._helpLayoutWidth = unitsHelpLayout.width

                Text {
80 81 82 83 84 85 86
                    Layout.alignment:   Qt.AlignVCenter
                    text:               control.unitsLabel
                    font.pointSize:     backgroundItem.showHelp ? ScreenTools.smallFontPointSize : ScreenTools.defaultFontPointSize
                    font.family:        ScreenTools.normalFontFamily
                    antialiasing:       true
                    color:              control.textColor
                    visible:            control.showUnits
87 88 89
                }

                Rectangle {
90
                    Layout.margins:     2
91 92
                    Layout.leftMargin:  0
                    Layout.rightMargin: 1
93
                    Layout.fillHeight:  true
94
                    width:              helpLabel.contentWidth * 3
95 96 97 98
                    color:              control.textColor
                    visible:            backgroundItem.showHelp

                    QGCLabel {
99 100 101 102
                        id:                 helpLabel
                        anchors.centerIn:   parent
                        color:              qgcPal.textField
                        text:               qsTr("?")
103 104 105
                    }
                }
            }
106

107
            MouseArea {
Don Gagne's avatar
Don Gagne committed
108 109 110 111
                anchors.margins:    ScreenTools.isMobile ? -(ScreenTools.defaultFontPixelWidth * 0.66) : 0 // Larger touch area for mobile
                anchors.fill:       unitsHelpLayout
                enabled:            control.activeFocus
                onClicked:          root.helpClicked()
Don Gagne's avatar
Don Gagne committed
112 113 114
            }
        }

115
        padding.right: control._helpLayoutWidth //control.showUnits ? unitsLabelWidthGenerator.width : control.__contentHeight * 0.333
Don Gagne's avatar
Don Gagne committed
116
    }
117
}