diff --git a/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml b/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml
index ff2c19247c3b9829b98bd66ca72596e7aa8a05f6..8813e359853536379f0ed08c33384cfd35aab028 100755
--- a/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml
+++ b/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml
@@ -7,147 +7,171 @@ Page {
id: dapUiQmlScreenDashboard
title: qsTr("General")
- Rectangle {
- id: rectangleTabs
+ Rectangle
+ {
+ id: rectangleTabsBorder
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
+ color: "#B5B5B5"
width: 150
- color: "#36314D"
- ListView {
- id: listViewTabs
+ Rectangle {
+ id: rectangleTabs
anchors.fill: parent
- model: listModelTabs
- spacing: 3
+ anchors.leftMargin: 1
+ anchors.rightMargin: 1
- ListModel {
- id: listModelTabs
+ color: "#E1E4E6"
+ ListView {
+ id: listViewTabs
+ anchors.fill: parent
+ model: listModelTabs
+ spacing: 3
- ListElement {
- name: qsTr("Home")
- page: "DapUiQmlScreenDialog.qml"
- source: "qrc:/Resources/Icons/home.png"
- }
- ListElement {
- name: qsTr("Settings")
- page: "DapQmlScreenAbout.qml"
- source: "qrc:/Resources/Icons/settings.png"
- }
- ListElement {
- name: qsTr("Logs")
- page: "DapUiQmlWidgetChainNodeLogs.qml"
- source: "qrc:/Resources/Icons/logs.png"
- }
- ListElement {
- name: qsTr("About")
- page: "DapQmlScreenAbout.qml"
- source: "qrc:/Resources/Icons/about.png"
+ ListModel {
+ id: listModelTabs
+
+ ListElement {
+ name: qsTr("Home")
+ page: "DapUiQmlScreenDialog.qml"
+ source: "qrc:/Resources/Icons/home.png"
+ }
+ ListElement {
+ name: qsTr("Settings")
+ page: "DapQmlScreenAbout.qml"
+ source: "qrc:/Resources/Icons/settings.png"
+ }
+ ListElement {
+ name: qsTr("Logs")
+ page: "DapUiQmlWidgetChainNodeLogs.qml"
+ source: "qrc:/Resources/Icons/logs.png"
+ }
+ ListElement {
+ name: qsTr("About")
+ page: "DapQmlScreenAbout.qml"
+ source: "qrc:/Resources/Icons/about.png"
+ }
}
- }
- delegate:
- Component {
+ delegate:
+ Column {
id: componentTab
+ height: 148
Rectangle {
id: componentItem
+ property bool isPushed: listViewTabs.currentIndex === index
+
width: listViewTabs.width
height: 150
- color: listViewTabs.currentIndex === index ? "#48435F" : "#3E3856"
- Column
+ color: "transparent"
+ Rectangle
{
- spacing: 20
- anchors.centerIn: parent
- Image
+ id: spacerItem1
+ height: 25
+ anchors.top: parent.top
+ }
+ Image
+ {
+ id: imageItem
+ anchors.top: spacerItem1.bottom
+ source: model.source
+ height: 60
+ width: 60
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+ Rectangle
+ {
+ id: spacerItem2
+ anchors.top: imageItem.bottom
+ height: 16
+ }
+ Text
+ {
+ id: textItemMenu
+ anchors.top: spacerItem2.bottom
+ text: qsTr(name)
+ color: "#505559"
+ anchors.horizontalCenter: parent.horizontalCenter
+ font.family: "Roboto"
+ font.weight: componentItem.isPushed ? Font.Normal : Font.Light
+ font.pointSize: 16
+ }
+ Rectangle
+ {
+ id: spacerItem3
+ anchors.top: textItemMenu.bottom
+ height: 30
+ }
+ MouseArea {
+ anchors.fill: parent
+ hoverEnabled: true
+ onEntered:
{
- id: imageMenu
- source: model.source
- height: 64
- width: 64
- anchors.horizontalCenter: parent.horizontalCenter
+ textItemMenu.font.weight = Font.Normal
+ if(!componentItem.isPushed) componentItem.color ="#B0B0B5"
}
- Text
+ onExited:
+ {
+ textItemMenu.font.weight = Font.Light
+ if(!componentItem.isPushed) componentItem.color = "transparent"
+ }
+
+ onClicked:
{
- text: qsTr(name)
- color: "#CFCBD9"
- anchors.horizontalCenter: parent.horizontalCenter
- font.family: "Roboto"
- font.pointSize: 12
+ listViewTabs.currentIndex = index
+ stackViewScreenDashboard.setSource(Qt.resolvedUrl(page))
}
}
- MouseArea {
- anchors.fill: parent
- onClicked:
- {
- listViewTabs.currentIndex = index
- stackViewScreenDashboard.setSource(Qt.resolvedUrl(page))
- }
- }
+ onIsPushedChanged: {
+ componentItem.color = (isPushed ? "#D0D3D6" : "transparent");
}
}
+ Rectangle
+ {
+ id: borderItem
+ height: 1
+ color: "#B5B5B5"
+ width: parent.width
+ }
}
+ }
focus: true
+ }
}
+
+ Rectangle
+ {
+ id: rectangleStatusBar
+ anchors.left: rectangleTabsBorder.right
+ anchors.top: parent.top
+ anchors.right: parent.right
+ color: "#B5B5B5"
+ height: 60
Rectangle
{
- id: rectangleExit
- color: "transparent"
- width: listViewTabs.width
- height: 150
- anchors.left: parent.left
- anchors.bottom: parent.bottom
-
- Column
- {
- spacing: 20
- anchors.centerIn: parent
- Image
- {
- id: imageMenu
- source: "qrc:/Resources/Icons/exit.png"
- height: 64
- width: 64
- anchors.horizontalCenter: parent.horizontalCenter
- }
- Text
- {
- text: qsTr("Exit")
- color: "#CFCBD9"
- anchors.horizontalCenter: parent.horizontalCenter
- font.family: "Roboto"
- font.pointSize: 12
- }
- }
-
- MouseArea {
- anchors.fill: parent
- onHoveredChanged:
- {
- rectangleExit.color = "#48435F"
- }
-
- onClicked:
- {
-
- Qt.quit()
- }
- }
+ anchors.fill: parent
+ anchors.bottomMargin: 1
+ color: "#F2F2F4"
}
- Rectangle {
- id: mainDashboard
- anchors.left: rectangleTabs.right
- anchors.top: parent.top
- anchors.bottom: parent.bottom
- anchors.right: parent.right
- border.color: "whitesmoke"
+ }
- Loader {
- id: stackViewScreenDashboard
- anchors.fill: parent
- source: "DapUiQmlScreenDialog.qml"
- }
+ Rectangle {
+ id: mainDashboard
+ anchors.left: rectangleTabsBorder.right
+ anchors.top: rectangleStatusBar.bottom
+ anchors.bottom: parent.bottom
+ anchors.right: parent.right
+ border.color: "whitesmoke"
+
+ Loader {
+ id: stackViewScreenDashboard
+ clip: true
+ anchors.fill: parent
+ source: "DapUiQmlScreenDialog.qml"
}
+ }
}
diff --git a/KelvinDashboardGUI/main.qml b/KelvinDashboardGUI/main.qml
index b5a94b04b6829e3668983dc278aaa1a988e91058..5fb41f07e5aa83c52a99947a036421c6769508d7 100755
--- a/KelvinDashboardGUI/main.qml
+++ b/KelvinDashboardGUI/main.qml
@@ -47,84 +47,84 @@ ApplicationWindow {
}
- header:
- Column
- {
- ToolBar
- {
- width: parent.width
- height: buttomMenu.implicitHeight
- contentItem: Item {
- anchors.fill: parent
- Rectangle
- {
- anchors.fill: parent
- color: "#353841"
- }
-
- }
-
- ToolButton {
- id: buttomMenu
-
- contentItem: Item {
- anchors.fill: parent
- Rectangle
- {
- anchors.fill: parent
- color: "#353841"
-
- Text {
- text: stackView.depth > 1 ? "\u25C0" : "\u2630"
- font.pixelSize: Qt.application.font.pixelSize * 2
- anchors.centerIn: parent
- color: "#A5A7AA"
- }
- }
-
- }
-
- onClicked: {
- if (stackView.depth > 1) {
- stackView.pop()
- } else {
- drawerMenu.open()
- }
- }
- }
-
- Label {
- id: labelTitleWidget
- text: stackView.currentItem.title
- anchors.centerIn: parent
- color: "white"
- }
-
- Image {
- id: imageNetwork
- source: "qrc:/Resources/Icons/iconNetwork.png"
- scale: 0.7
- visible: false
- anchors.verticalCenter: parent.verticalCenter
- anchors.right: parent.left
- }
-
- Image {
- id: imageErrorNetwork
- source: "qrc:/Resources/Icons/iconErrorNetwork.png"
- scale: 0.7
- visible: true
- anchors.verticalCenter: parent.verticalCenter
- anchors.right: parent.right
- }
- }
- Rectangle
- {
- height: 1
- width: parent.width
- color: "green"
- }
- }
+// header:
+// Column
+// {
+// ToolBar
+// {
+// width: parent.width
+// height: buttomMenu.implicitHeight
+// contentItem: Item {
+// anchors.fill: parent
+// Rectangle
+// {
+// anchors.fill: parent
+// color: "#353841"
+// }
+
+// }
+
+// ToolButton {
+// id: buttomMenu
+
+// contentItem: Item {
+// anchors.fill: parent
+// Rectangle
+// {
+// anchors.fill: parent
+// color: "#353841"
+
+// Text {
+// text: stackView.depth > 1 ? "\u25C0" : "\u2630"
+// font.pixelSize: Qt.application.font.pixelSize * 2
+// anchors.centerIn: parent
+// color: "#A5A7AA"
+// }
+// }
+
+// }
+
+// onClicked: {
+// if (stackView.depth > 1) {
+// stackView.pop()
+// } else {
+// drawerMenu.open()
+// }
+// }
+// }
+
+// Label {
+// id: labelTitleWidget
+// text: stackView.currentItem.title
+// anchors.centerIn: parent
+// color: "white"
+// }
+
+// Image {
+// id: imageNetwork
+// source: "qrc:/Resources/Icons/iconNetwork.png"
+// scale: 0.7
+// visible: false
+// anchors.verticalCenter: parent.verticalCenter
+// anchors.right: parent.left
+// }
+
+// Image {
+// id: imageErrorNetwork
+// source: "qrc:/Resources/Icons/iconErrorNetwork.png"
+// scale: 0.7
+// visible: true
+// anchors.verticalCenter: parent.verticalCenter
+// anchors.right: parent.right
+// }
+// }
+// Rectangle
+// {
+// height: 1
+// width: parent.width
+// color: "green"
+// }
+// }
Drawer {
id: drawerMenu