examples/quickshapes/weatherforecast/MapLabel.qml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65

// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause

import QtQuick

Rectangle {
    id: mapLabel
    property url iconSource
    property string label
    property int degrees

    radius: 8 * mainWindow.designWindowWidthRatio
    color: Qt.rgba(0, 0, 0, 0.05)
    height: 42 * mainWindow.designWindowHeightRatio
    width: labelText.width + divider.width + labelDegrees.width + iconLoader.width + row.padding * 5

    x: -height / 2
    y: -height / 2

    Row {
        id: row
        anchors.fill: parent
        padding: 8 * mainWindow.designWindowWidthRatio
        spacing: padding

        Text {
            id: labelText
            text: mapLabel.label
            color: "#333"
            font.family: workSansRegular.font.family
            font.pixelSize: 22 * mainWindow.designWindowHeightRatio
            anchors.verticalCenter: parent.verticalCenter
        }

        Rectangle {
            id: divider
            color: "#333"
            width: 2 * mainWindow.designWindowWidthRatio
            antialiasing: true
            height: labelText.implicitHeight
            anchors.verticalCenter: parent.verticalCenter
        }

        Text {
            id: labelDegrees
            text: degrees+"°"
            color: "#333"
            font.family: workSansRegular.font.family
            font.pixelSize: 22 * mainWindow.designWindowHeightRatio
            anchors.verticalCenter: parent.verticalCenter
        }

        Loader {
            id: iconLoader
            source: mapLabel.iconSource

            // TODO: implement PreserveAspectRatio in Shapes
            property real aspectRatio: implicitWidth / implicitHeight
            width: 25 * mainWindow.designWindowWidthRatio
            height: width / aspectRatio

            anchors.verticalCenter: parent.verticalCenter
        }
    }
}