QGCButton.qml 4.78 KB
Newer Older
1 2
import QtQuick 2.3
import QtQuick.Controls 1.2
3
import QtQuick.Controls.Styles 1.4
Don Gagne's avatar
Don Gagne committed
4 5

import QGroundControl.Palette 1.0
6
import QGroundControl.ScreenTools 1.0
Don Gagne's avatar
Don Gagne committed
7 8

Button {
9 10 11
    property bool   primary:        false                               ///< primary button for a group of buttons
    property real   pointSize:      ScreenTools.defaultFontPointSize    ///< Point size for button text
    property bool   showBorder:     _qgcPal.globalTheme === QGCPalette.Light
12
    property bool   iconLeft:       false
13 14
    property real   backRadius:     0
    property real   heightFactor:   0.5
15

16 17
    property var    _qgcPal:            QGCPalette { colorGroupEnabled: enabled }
    property bool   _showHighlight:     (pressed | hovered | checked) && !__forceHoverOff
Don Gagne's avatar
Don Gagne committed
18

Don Gagne's avatar
Don Gagne committed
19 20 21 22 23
    // This fixes the issue with button hover where if a Button is near the edge oa QQuickWidget you can
    // move the mouse fast enough such that the MouseArea does not trigger an onExited. This is turn
    // cause the hover property to not be cleared correctly.

    property bool __forceHoverOff: false
Don Gagne's avatar
Don Gagne committed
24

dogmaphobic's avatar
dogmaphobic committed
25 26
    property int __lastGlobalMouseX:    0
    property int __lastGlobalMouseY:    0
27
    property int _horizontalPadding:    ScreenTools.defaultFontPixelWidth
28
    property int _verticalPadding:      Math.round(ScreenTools.defaultFontPixelHeight * heightFactor)
Don Gagne's avatar
Don Gagne committed
29

Don Gagne's avatar
Don Gagne committed
30 31 32
    Connections {
        target: __behavior
        onMouseXChanged: {
Don Gagne's avatar
Don Gagne committed
33 34
            __lastGlobalMouseX = ScreenTools.mouseX()
            __lastGlobalMouseY = ScreenTools.mouseY()
Don Gagne's avatar
Don Gagne committed
35 36
        }
        onMouseYChanged: {
Don Gagne's avatar
Don Gagne committed
37 38
            __lastGlobalMouseX = ScreenTools.mouseX()
            __lastGlobalMouseY = ScreenTools.mouseY()
Don Gagne's avatar
Don Gagne committed
39
        }
40 41
        onEntered: { __forceHoverOff = false; hoverTimer.start() }
        onExited: { __forceHoverOff = false; hoverTimer.stop() }
Don Gagne's avatar
Don Gagne committed
42 43 44 45 46 47 48
    }

    Timer {
        id:         hoverTimer
        interval:   250
        repeat:     true
        onTriggered: {
dogmaphobic's avatar
dogmaphobic committed
49
            __forceHoverOff = (__lastGlobalMouseX !== ScreenTools.mouseX() || __lastGlobalMouseY !== ScreenTools.mouseY());
Don Gagne's avatar
Don Gagne committed
50 51
        }
    }
52

Don Gagne's avatar
Don Gagne committed
53
    style: ButtonStyle {
54 55
            /*! The padding between the background and the label components. */
            padding {
56 57 58 59
                top:    _verticalPadding
                bottom: _verticalPadding
                left:   _horizontalPadding
                right:  _horizontalPadding
60 61 62
            }

            /*! This defines the background of the button. */
63
            background: Rectangle {
64
                id:             backRect
65 66
                implicitWidth:  ScreenTools.implicitButtonWidth
                implicitHeight: ScreenTools.implicitButtonHeight
67 68
                radius:         backRadius
                border.width:   showBorder ? 1 : 0
69 70 71 72
                border.color:   _qgcPal.buttonText
                color:          _showHighlight ?
                                    control._qgcPal.buttonHighlight :
                                    (primary ? control._qgcPal.primaryButton : control._qgcPal.button)
73 74 75 76
            }

            /*! This defines the label of the button.  */
            label: Item {
77 78 79
                implicitWidth:          text.implicitWidth + icon.width
                implicitHeight:         text.implicitHeight
                baselineOffset:         text.y + text.baselineOffset
80

81 82 83 84 85 86 87 88 89 90 91 92 93 94
                QGCColoredImage {
                    id:                     icon
                    source:                 control.iconSource
                    height:                 source === "" ? 0 : text.height
                    width:                  height
                    color:                  text.color
                    fillMode:               Image.PreserveAspectFit
                    sourceSize.height:      height
                    anchors.left:           control.iconLeft ? parent.left : undefined
                    anchors.leftMargin:     control.iconLeft ? ScreenTools.defaultFontPixelWidth : undefined
                    anchors.right:          !control.iconLeft ? parent.right : undefined
                    anchors.rightMargin:    !control.iconLeft ? ScreenTools.defaultFontPixelWidth : undefined
                    anchors.verticalCenter: parent.verticalCenter
                }
95

96 97 98 99 100 101 102 103 104 105
                Text {
                    id:                     text
                    anchors.centerIn:       parent
                    antialiasing:           true
                    text:                   control.text
                    font.pointSize:         pointSize
                    font.family:            ScreenTools.normalFontFamily
                    color:                  _showHighlight ?
                                                control._qgcPal.buttonHighlightText :
                                                (primary ? control._qgcPal.primaryButtonText : control._qgcPal.buttonText)
106 107
                }
            }
Don Gagne's avatar
Don Gagne committed
108 109
        }
}