LRT_meldog_application/MainToolBar.qml at main · KNR-PW/LRT_meldog_application · GitHub

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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
import QtQuick 2.15
import "Components"

Rectangle {
    id: root

    property real px: 1.0

    property real toolbarHeight: 80 * px
    height: toolbarHeight

    property int toolbarIndex: 0

    property var tabs: [
        { label: "DASHBOARD" },
        { label: "RVIZ" },
        { label: "JOINTS" }
    ]

    readonly property int itemCount: tabs.length
    readonly property real itemWidth: toolbarItemsArea.width / Math.max(1, itemCount)
    readonly property real tabHeight: Math.max(30 * px, height * 0.58)

    border.color: "#1f2a37"
    border.width: 1

    gradient: Gradient {
        GradientStop { position: 0.0; color: "#141C26" }
        GradientStop { position: 1.0; color: "#0F1620" }
    }

    Item {
        id: toolbarItemsArea
        anchors.left: parent.left
        anchors.right: assistantButton.left
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        anchors.leftMargin: 16 * px
        anchors.rightMargin: 12 * px

        Row {
            id: tabsRow
            anchors.left: parent.left
            anchors.verticalCenter: parent.verticalCenter
            spacing: 0

            Repeater {
                model: root.tabs
                delegate: Item {
                    width: root.itemWidth
                    height: root.tabHeight

                    TabBarItem {
                        anchors.centerIn: parent
                        px: root.px
                        index: model.index
                        text: modelData.label
                        height: parent.height
                        selected: root.toolbarIndex === model.index

                        onClicked: function(i) { root.toolbarIndex = i }
                    }
                }
            }
        }
    }

    Rectangle {
        id: assistantButton
        readonly property real size: Math.max(40 * px, root.height * 0.55)
        width: size
        height: size
        radius: 12 * px
        anchors.right: parent.right
        anchors.rightMargin: 14 * px
        anchors.verticalCenter: parent.verticalCenter
        color: "#0F1620"
        border.color: "#1f2a37"
        border.width: 1

        Text {
            anchors.centerIn: parent
            text: "?"
            color: "#E6EAF2"
            font.pixelSize: Math.max(14 * px, parent.height * 0.45)
            font.bold: true
        }
    }
}