diff --git a/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml b/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml index ff2c19247c3b9829b98bd66ca72596e7aa8a05f6..bddf5151300cd9e66e1640f9c804446a3dd7eb2e 100755 --- a/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml +++ b/KelvinDashboardGUI/DapUiQmlScreenDashboard.qml @@ -7,138 +7,155 @@ 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 { - id: componentTab - Rectangle { - id: componentItem - width: listViewTabs.width - height: 150 - color: listViewTabs.currentIndex === index ? "#48435F" : "#3E3856" - Column - { - spacing: 20 - anchors.centerIn: parent - Image - { - id: imageMenu - source: model.source - height: 64 - width: 64 - anchors.horizontalCenter: parent.horizontalCenter - } - Text - { - text: qsTr(name) - color: "#CFCBD9" - anchors.horizontalCenter: parent.horizontalCenter - font.family: "Roboto" - font.pointSize: 12 - } - } + delegate: + Column { + id: componentTab + height: 148 + Rectangle { + id: componentItem + width: listViewTabs.width + height: 150 + color: listViewTabs.currentIndex === index ? "#D0D3D6" : "transparent" + Rectangle + { + 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: listViewTabs.currentIndex === index ? Font.Normal : Font.Light + font.pointSize: 16 + } + Rectangle + { + id: spacerItem3 + anchors.top: textItemMenu.bottom + height: 30 + } + MouseArea { + anchors.fill: parent + hoverEnabled: true + onEntered: + { + textItemMenu.font.weight = Font.Normal + componentItem.color = "#D0D3D6" + } + onExited: + { + textItemMenu.font.weight = Font.Light + componentItem.color = "transparent" + } - MouseArea { - anchors.fill: parent - onClicked: - { - listViewTabs.currentIndex = index - stackViewScreenDashboard.setSource(Qt.resolvedUrl(page)) - } - } - } + onClicked: + { + listViewTabs.currentIndex = index + stackViewScreenDashboard.setSource(Qt.resolvedUrl(page)) + } + } + } + Rectangle + { + id: borderItem + height: 1 + color: "#B5B5B5" + width: parent.width + } + } } - } - focus: true + focus: true + } } + Rectangle { - id: rectangleExit - color: "transparent" - width: listViewTabs.width - height: 150 - anchors.left: parent.left - anchors.bottom: parent.bottom - - Column + id: rectangleStatusBar + anchors.left: rectangleTabsBorder.right + anchors.top: parent.top + anchors.right: parent.right + color: "#B5B5B5" + height: 60 + Rectangle { - 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 - } + anchors.fill: parent + anchors.bottomMargin: 1 + color: "#F2F2F4" } - - MouseArea { - anchors.fill: parent - onHoveredChanged: - { - rectangleExit.color = "#48435F" - } - - onClicked: - { - - Qt.quit() - } - } } + Rectangle { id: mainDashboard - anchors.left: rectangleTabs.right - anchors.top: parent.top + anchors.left: rectangleTabsBorder.right + anchors.top: rectangleStatusBar.bottom anchors.bottom: parent.bottom anchors.right: parent.right border.color: "whitesmoke" 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