ScreenTools.qml 9.71 KB
Newer Older
Don Gagne's avatar
Don Gagne committed
1 2
pragma Singleton

3 4
import QtQuick 2.3
import QtQuick.Controls 1.2
dogmaphobic's avatar
dogmaphobic committed
5
import QtQuick.Window 2.2
Don Gagne's avatar
Don Gagne committed
6

7
import QGroundControl                       1.0
Don Gagne's avatar
Don Gagne committed
8 9
import QGroundControl.ScreenToolsController 1.0

Don Gagne's avatar
Don Gagne committed
10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
/*!
 The ScreenTools Singleton provides information on QGC's standard font metrics. It also provides information on screen
 size which can be used to adjust user interface for varying available screen real estate.

 QGC has four standard font sizes: default, small, medium and large. The QGC controls use the default font for display and you should use this font
 for most text within the system that is drawn using something other than a standard QGC control. The small font is smaller than the default font.
 The medium and large fonts are larger than the default font.

 Usage:

        import QGroundControl.ScreenTools 1.0

        Rectangle {
            anchors.fill:       parent
            anchors.margins:    ScreenTools.defaultFontPixelWidth
            ...
        }
*/
Don Gagne's avatar
Don Gagne committed
28
Item {
29 30
    id: _screenTools

Don Gagne's avatar
Don Gagne committed
31
    //-- The point and pixel font size values are computed at runtime
32

dogmaphobic's avatar
dogmaphobic committed
33
    property real defaultFontPointSize:     10
Don Gagne's avatar
Don Gagne committed
34

Ricardo de Almeida Gonzaga's avatar
Ricardo de Almeida Gonzaga committed
35
    /// You can use this property to position ui elements in a screen resolution independent manner. Using fixed positioning values should not
Don Gagne's avatar
Don Gagne committed
36 37
    /// be done. All positioning should be done using anchors or a ratio of the defaultFontPixelHeight and defaultFontPixelWidth values. This way
    /// your ui elements will reposition themselves appropriately on varying screen sizes and resolutions.
dogmaphobic's avatar
dogmaphobic committed
38
    property real defaultFontPixelHeight:   10
Don Gagne's avatar
Don Gagne committed
39

Ricardo de Almeida Gonzaga's avatar
Ricardo de Almeida Gonzaga committed
40
    /// You can use this property to position ui elements in a screen resolution independent manner. Using fixed positioning values should not
Don Gagne's avatar
Don Gagne committed
41 42
    /// be done. All positioning should be done using anchors or a ratio of the defaultFontPixelHeight and defaultFontPixelWidth values. This way
    /// your ui elements will reposition themselves appropriately on varying screen sizes and resolutions.
dogmaphobic's avatar
dogmaphobic committed
43
    property real defaultFontPixelWidth:    10
Don Gagne's avatar
Don Gagne committed
44

dogmaphobic's avatar
dogmaphobic committed
45 46 47
    property real smallFontPointSize:       10
    property real mediumFontPointSize:      10
    property real largeFontPointSize:       10
dogmaphobic's avatar
dogmaphobic committed
48

Don Gagne's avatar
Don Gagne committed
49
    property real availableHeight:          0
50
    property real toolbarHeight:            0
Don Gagne's avatar
Don Gagne committed
51

52 53 54
    readonly property real smallFontPointRatio:      0.75
    readonly property real mediumFontPointRatio:     1.25
    readonly property real largeFontPointRatio:      1.5
dogmaphobic's avatar
dogmaphobic committed
55

56
    property real realPixelDensity: {
57
        //-- If a plugin defines it, just use what it tells us
58 59 60
        if(QGroundControl.corePlugin.options.devicePixelDensity != 0) {
            return QGroundControl.corePlugin.options.devicePixelDensity
        }
61 62
        //-- Android is rather unreliable
        if(isAndroid) {
63 64 65 66
            // Lets assume it's unlikely you have a tablet over 300mm wide
            if((Screen.width / Screen.pixelDensity) > 300) {
                return Screen.pixelDensity * 2
            }
67
        }
68
        //-- Let's use what the system tells us
69
        return Screen.pixelDensity
70
    }
71

72 73 74 75 76 77 78 79 80 81 82 83 84
    property bool isAndroid:                        ScreenToolsController.isAndroid
    property bool isiOS:                            ScreenToolsController.isiOS
    property bool isMobile:                         ScreenToolsController.isMobile
    property bool isWindows:                        ScreenToolsController.isWindows
    property bool isDebug:                          ScreenToolsController.isDebug
    property bool isMac:                            ScreenToolsController.isMacOS
    property bool isTinyScreen:                     (Screen.width / realPixelDensity) < 120 // 120mm
    property bool isShortScreen:                    ScreenToolsController.isMobile && ((Screen.height / Screen.width) < 0.6) // Nexus 7 for example
    property bool isHugeScreen:                     (Screen.width / realPixelDensity) >= (23.5 * 25.4) // 27" monitor
    property bool isSerialAvailable:                ScreenToolsController.isSerialAvailable

    readonly property real minTouchMillimeters:     10      ///< Minimum touch size in millimeters
    property real minTouchPixels:                   0       ///< Minimum touch size in pixels
85

86
    // The implicit heights/widths for our custom control set
87 88 89 90 91 92 93 94 95 96
    property real implicitButtonWidth:              Math.round(defaultFontPixelWidth *  (isMobile ? 7.0 : 5.0))
    property real implicitButtonHeight:             Math.round(defaultFontPixelHeight * (isMobile ? 2.0 : 1.6))
    property real implicitCheckBoxHeight:           Math.round(defaultFontPixelHeight * (isMobile ? 2.0 : 1.0))
    property real implicitRadioButtonHeight:        implicitCheckBoxHeight
    property real implicitTextFieldHeight:          Math.round(defaultFontPixelHeight * (isMobile ? 2.0 : 1.6))
    property real implicitComboBoxHeight:           Math.round(defaultFontPixelHeight * (isMobile ? 2.0 : 1.6))
    property real implicitComboBoxWidth:            Math.round(defaultFontPixelWidth *  (isMobile ? 7.0 : 5.0))
    property real implicitSliderHeight:             isMobile ? Math.max(defaultFontPixelHeight, minTouchPixels) : defaultFontPixelHeight
    property real checkBoxIndicatorSize:            Math.round(defaultFontPixelHeight * (isMobile ? 1.5 : 1.0))
    property real radioButtonIndicatorSize:         checkBoxIndicatorSize
97

98 99
    readonly property string normalFontFamily:      "opensans"
    readonly property string demiboldFontFamily:    "opensans-demibold"
100
    readonly property string fixedFontFamily:       ScreenToolsController.fixedFontFamily
101 102 103 104
    /* This mostly works but for some reason, reflowWidths() in SetupView doesn't change size.
       I've disabled (in release builds) until I figure out why. Changes require a restart for now.
    */
    Connections {
105 106
        target: QGroundControl.settingsManager.appSettings.appFontPointSize
        onValueChanged: {
107
            if(ScreenToolsController.isDebug)
108
                _setBasePointSize(QGroundControl.settingsManager.appSettings.appFontPointSize.value)
109 110 111
        }
    }

112 113 114 115
    onRealPixelDensityChanged: {
        _setBasePointSize(defaultFontPointSize)
    }

116 117 118 119
    function printScreenStats() {
        console.log('ScreenTools: Screen.width: ' + Screen.width + ' Screen.height: ' + Screen.height + ' Screen.pixelDensity: ' + Screen.pixelDensity)
    }

Don Gagne's avatar
Don Gagne committed
120
    /// Returns the current x position of the mouse in global screen coordinates.
Don Gagne's avatar
Don Gagne committed
121 122 123 124
    function mouseX() {
        return ScreenToolsController.mouseX()
    }

Don Gagne's avatar
Don Gagne committed
125
    /// Returns the current y position of the mouse in global screen coordinates.
Don Gagne's avatar
Don Gagne committed
126 127 128 129
    function mouseY() {
        return ScreenToolsController.mouseY()
    }

Don Gagne's avatar
Don Gagne committed
130 131
    /// \private
    function _setBasePointSize(pointSize) {
132 133
        _textMeasure.font.pointSize = pointSize
        defaultFontPointSize    = pointSize
134 135
        defaultFontPixelHeight  = Math.round(_textMeasure.fontHeight/2.0)*2
        defaultFontPixelWidth   = Math.round(_textMeasure.fontWidth/2.0)*2
136 137 138
        smallFontPointSize      = defaultFontPointSize  * _screenTools.smallFontPointRatio
        mediumFontPointSize     = defaultFontPointSize  * _screenTools.mediumFontPointRatio
        largeFontPointSize      = defaultFontPointSize  * _screenTools.largeFontPointRatio
139
        minTouchPixels          = Math.round(minTouchMillimeters * realPixelDensity)
140
        if (minTouchPixels / Screen.height > 0.15) {
141
            // If using physical sizing takes up too much of the vertical real estate fall back to font based sizing
142 143
            minTouchPixels      = defaultFontPixelHeight * 3
        }
144
        toolbarHeight           = isMobile ? minTouchPixels : defaultFontPixelHeight * 3
145
        toolbarHeight           = toolbarHeight * QGroundControl.corePlugin.options.toolbarHeightMultiplier
146 147
    }

148 149 150 151 152
    Text {
        id:     _defaultFont
        text:   "X"
    }

Don Gagne's avatar
Don Gagne committed
153
    Text {
154 155
        id:     _textMeasure
        text:   "X"
156
        font.family:    normalFontFamily
157 158 159
        property real   fontWidth:    contentWidth
        property real   fontHeight:   contentHeight
        Component.onCompleted: {
160 161
            var _appFontPointSizeFact = QGroundControl.settingsManager.appSettings.appFontPointSize
            var baseSize = _appFontPointSizeFact.value
162
            //-- If this is the first time (not saved in settings)
163
            if(baseSize < _appFontPointSizeFact.min || baseSize > _appFontPointSizeFact.max) {
164 165
                //-- Init base size base on the platform
                if(ScreenToolsController.isMobile) {
166
                    //-- Check iOS really tiny screens (iPhone 4s/5/5s)
167 168 169 170 171 172
                    if(ScreenToolsController.isiOS) {
                        if(ScreenToolsController.isiOS && Screen.width < 570) {
                            // For iPhone 4s size we don't fit with additional tweaks to fit screen,
                            // we will just drop point size to make things fit. Correct size not yet determined.
                            baseSize = 12;  // This will be lowered in a future pull
                        } else {
173
                            baseSize = 14;
174
                        }
175
                    } else if((Screen.width / realPixelDensity) < 120) {
176 177
                        baseSize = 11;
                    // Other Android
178
                    } else {
179
                        baseSize = 14;
180
                    }
181
                } else {
182
                    baseSize = _defaultFont.font.pointSize;
183
                }
184
                _appFontPointSizeFact._setIgnoreQGCRebootRequired(true)
185
                _appFontPointSizeFact.value = baseSize
186
                _appFontPointSizeFact._setIgnoreQGCRebootRequired(false)
187 188
                //-- Release build doesn't get signal
                if(!ScreenToolsController.isDebug)
Don Gagne's avatar
Don Gagne committed
189
                    _screenTools._setBasePointSize(baseSize);
190
            } else {
191
                //-- Set size saved in settings
Don Gagne's avatar
Don Gagne committed
192
                _screenTools._setBasePointSize(baseSize);
193
            }
194
        }
Don Gagne's avatar
Don Gagne committed
195 196
    }
}