QGCComboBox.qml 5.25 KB
Newer Older
1 2
/****************************************************************************
 *
Don Gagne's avatar
Don Gagne committed
3
 *   (c) 2009-2016 QGROUNDCONTROL PROJECT <http://www.qgroundcontrol.org>
4 5 6 7
 *
 * QGroundControl is licensed according to the terms in the file
 * COPYING.md in the root of the source code directory.
 *
Don Gagne's avatar
Don Gagne committed
8
 ****************************************************************************/
9

Don Gagne's avatar
Don Gagne committed
10 11 12 13 14
import QtQuick                  2.11
import QtQuick.Window           2.11
import QtQuick.Controls         2.11
import QtQuick.Controls.impl    2.11
import QtQuick.Templates        2.11 as T
15 16

import QGroundControl.ScreenTools   1.0
Don Gagne's avatar
Don Gagne committed
17
import QGroundControl.Palette       1.0
18

Don Gagne's avatar
Don Gagne committed
19 20 21 22 23 24 25 26 27 28 29 30
T.ComboBox {
    id:             control
    padding:        ScreenTools.comboBoxPadding
    spacing:        ScreenTools.defaultFontPixelWidth
    implicitWidth:  Math.max(implicitBackgroundWidth + leftInset + rightInset,
                             implicitContentWidth + leftPadding + rightPadding,
                             sizeToContents ? _popupWidth : 0)
    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
                             implicitContentHeight + topPadding + bottomPadding,
                             implicitIndicatorHeight + topPadding + bottomPadding)
    leftPadding:    padding + (!control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
    rightPadding:   padding + (control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width)
31

Don Gagne's avatar
Don Gagne committed
32 33 34
    property bool   centeredLabel:  false
    property bool   sizeToContents: false
    property string alternateText:  ""
Don Gagne's avatar
Don Gagne committed
35

Don Gagne's avatar
Don Gagne committed
36 37 38
    property var    _qgcPal:           QGCPalette { colorGroupEnabled: enabled }
    property real   _largestTextWidth: 0
    property real   _popupWidth:       sizeToContents ? _largestTextWidth + leftPadding + rightPadding : control.width
Don Gagne's avatar
Don Gagne committed
39

Don Gagne's avatar
Don Gagne committed
40 41
    TextMetrics {
        id: textMetrics
42
    }
Yasen's avatar
Yasen committed
43

Don Gagne's avatar
Don Gagne committed
44 45 46 47 48 49 50 51 52 53
    onModelChanged: {
        if (sizeToContents) {
            _largestTextWidth = 0
            textMetrics.font = control.font
            for (var i = 0; i < model.length; i++){
                textMetrics.text = model[i]
                _largestTextWidth = Math.max(textMetrics.width, _largestTextWidth)
            }
        }
    }
Yasen's avatar
Yasen committed
54

Don Gagne's avatar
Don Gagne committed
55
    // The items in the popup
56
    delegate: ItemDelegate {
Don Gagne's avatar
Don Gagne committed
57
        width: _popupWidth
58

Don Gagne's avatar
Don Gagne committed
59
        property string _text: control.textRole ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole]) : modelData
Yasen's avatar
Yasen committed
60

Don Gagne's avatar
Don Gagne committed
61 62 63 64
        TextMetrics {
            id:    popupItemMetrics
            text:  _text
        }
65

Don Gagne's avatar
Don Gagne committed
66 67 68 69 70
        contentItem: Text {
            text:                   _text
            font:                   control.font
            color:                  control.currentIndex === index ? _qgcPal.buttonHighlightText : _qgcPal.buttonText
            verticalAlignment:      Text.AlignVCenter
71
        }
72

Don Gagne's avatar
Don Gagne committed
73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90
        background: Rectangle {
            color:                  control.currentIndex === index ? _qgcPal.buttonHighlight : _qgcPal.button
        }

        highlighted:                control.highlightedIndex === index
    }

    // Dropdown indicator
    indicator: ColorImage {
        x:              control.mirrored ? control.padding : control.width - width
        y:              control.topPadding + (control.availableHeight - height) / 2
        color:          _qgcPal.text
        defaultColor:   "#353637"
        source:         "qrc:/qt-project.org/imports/QtQuick/Controls.2/images/double-arrow.png"
        opacity:        enabled ? 1 : 0.3
    }

    // The label of the button
91 92 93
    contentItem: Item {
        implicitWidth:                  text.implicitWidth
        implicitHeight:                 text.implicitHeight
Yasen's avatar
Yasen committed
94

95 96 97 98
        QGCLabel {
            id:                         text
            anchors.verticalCenter:     parent.verticalCenter
            anchors.horizontalCenter:   centeredLabel ? parent.horizontalCenter : undefined
Don Gagne's avatar
Don Gagne committed
99 100
            text:                       control.alternateText === "" ? control.currentText : control.alternateText
            font:                       control.font
Don Gagne's avatar
Don Gagne committed
101
            color:                      _qgcPal.text
102 103
        }
    }
Don Gagne's avatar
Don Gagne committed
104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141

    background: Rectangle {
        implicitWidth:  ScreenTools.implicitComboBoxWidth
        implicitHeight: ScreenTools.implicitComboBoxHeight
        color:          _qgcPal.window
        border.width:   enabled ? 1 : 0
        border.color:   "#999"
    }

    popup: T.Popup {
        y:              control.height
        width:          _popupWidth
        height:         Math.min(contentItem.implicitHeight, control.Window.height - topMargin - bottomMargin)
        topMargin:      6
        bottomMargin:   6

        contentItem: ListView {
            clip:                   true
            implicitHeight:         contentHeight
            model:                  control.delegateModel
            currentIndex:           control.highlightedIndex
            highlightMoveDuration:  0

            Rectangle {
                z:              10
                width:          parent.width
                height:         parent.height
                color:          "transparent"
                border.color:   _qgcPal.text
            }

            T.ScrollIndicator.vertical: ScrollIndicator { }
        }

        background: Rectangle {
            color: control.palette.window
        }
    }
142
}