aboutsummaryrefslogtreecommitdiff
path: root/components
diff options
context:
space:
mode:
Diffstat (limited to 'components')
-rw-r--r--components/Navbar.qml441
-rw-r--r--components/NavbarItem.qml37
2 files changed, 155 insertions, 323 deletions
diff --git a/components/Navbar.qml b/components/Navbar.qml
index 87c37dcd..0429eecc 100644
--- a/components/Navbar.qml
+++ b/components/Navbar.qml
@@ -1,4 +1,4 @@
-// Copyright (c) 2014-2018, The Monero Project
+// Copyright (c) 2014-2021, The Monero Project
//
// All rights reserved.
//
@@ -27,386 +27,181 @@
// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
import QtQuick 2.9
-import QtQuick.Controls 1.4
-import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.1
-import QtQuick.Dialogs 1.2
-import "../../js/Windows.js" as Windows
-import "../../js/Utils.js" as Utils
-import "../../components" as MoneroComponents
-import "../../pages"
-import "."
-import moneroComponents.Clipboard 1.0
+import "." as MoneroComponents
Rectangle {
+ default property list<MoneroComponents.NavbarItem> items
+
color: "transparent"
height: grid.height
width: grid.width
- GridLayout {
- id: grid
- anchors.verticalCenter: parent.verticalCenter
- anchors.horizontalCenter: parent.horizontalCenter
- columnSpacing: 0
- property string fontColorActive: MoneroComponents.Style.blackTheme ? "white" : "white"
- property string fontColorInActive: MoneroComponents.Style.blackTheme ? "white" : MoneroComponents.Style.dimmedFontColor
- property int fontSize: 15
- property bool fontBold: true
- property var fontFamily: MoneroComponents.Style.fontRegular.name
- property string borderColor: MoneroComponents.Style.blackTheme ? "#808080" : "#B9B9B9"
- property int textMargin: {
- // left-right margins for a given cell
- if(appWindow.width < 890){
- return 32;
- } else {
- return 64;
- }
+ GridLayout {
+ id: grid
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.horizontalCenter: parent.horizontalCenter
+ columnSpacing: 0
+ property string fontColorActive: MoneroComponents.Style.blackTheme ? "white" : "white"
+ property string fontColorInActive: MoneroComponents.Style.blackTheme ? "white" : MoneroComponents.Style.dimmedFontColor
+ property int fontSize: 15
+ property bool fontBold: true
+ property var fontFamily: MoneroComponents.Style.fontRegular.name
+ property string borderColor: MoneroComponents.Style.blackTheme ? "#808080" : "#B9B9B9"
+ property int textMargin: {
+ // left-right margins for a given cell
+ if(appWindow.width < 890){
+ return 32;
+ } else {
+ return 64;
}
+ }
- Rectangle {
- // navbar left side border
- id: navBarLeft
- property bool isActive: settingsStateView.state === "Wallet"
- Layout.preferredWidth: 2
- Layout.preferredHeight: 32
- color: "transparent"
-
- Rectangle {
- anchors.left: parent.left
- anchors.verticalCenter: parent.verticalCenter
- width: 1
- height: parent.height - 2
- color: grid.borderColor
- }
-
- ColumnLayout {
- anchors.top: parent.top
- anchors.bottom: parent.bottom
- anchors.right: parent.right
- width: 1
- spacing: 0
-
- Rectangle {
- Layout.preferredHeight: 1
- Layout.preferredWidth: 1
- color: grid.borderColor
- }
-
- Rectangle {
- Layout.fillHeight: true
- width: 1
- color: navBarLeft.isActive ? grid.borderColor : "transparent"
- }
+ Rectangle {
+ // navbar left side border
+ id: navBarLeft
+ Layout.preferredWidth: 2
+ Layout.preferredHeight: 32
+ color: "transparent"
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.preferredWidth: 1
- }
- }
+ Rectangle {
+ anchors.left: parent.left
+ anchors.verticalCenter: parent.verticalCenter
+ width: 1
+ height: parent.height - 2
+ color: grid.borderColor
}
ColumnLayout {
- // WALLET
- id: navWallet
- property bool isActive: settingsStateView.state === "Wallet"
- Layout.preferredWidth: navWalletText.width + grid.textMargin
- Layout.minimumWidth: 72
- Layout.preferredHeight: 32
+ anchors.top: parent.top
+ anchors.bottom: parent.bottom
+ anchors.right: parent.right
+ width: 1
spacing: 0
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
-
Rectangle {
- color: parent.isActive ? grid.borderColor : "transparent"
- height: 30
- Layout.fillWidth: true
-
- MoneroComponents.TextPlain {
- id: navWalletText
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.verticalCenter: parent.verticalCenter
- font.family: grid.fontFamily
- font.pixelSize: grid.fontSize
- font.bold: grid.fontBold
- text: qsTr("Wallet") + translationManager.emptyString
- color: navWallet.isActive ? grid.fontColorActive : grid.fontColorInActive
- themeTransition: false
- }
-
- MouseArea {
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.PointingHandCursor
-
- onClicked: { settingsStateView.state = "Wallet" }
- }
- }
-
- Rectangle {
- color: grid.borderColor
Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
- }
- Rectangle{
- Layout.preferredWidth: 1
- Layout.preferredHeight: 32
- color: grid.borderColor
- }
- ColumnLayout {
- // UI
- id: navUI
- property bool isActive: settingsStateView.state === "UI"
- Layout.preferredWidth: navUIText.width + grid.textMargin
- Layout.preferredHeight: 32
- Layout.minimumWidth: 72
- spacing: 0
-
- Rectangle {
+ Layout.preferredWidth: 1
color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
}
Rectangle {
- color: parent.isActive ? grid.borderColor : "transparent"
- height: 30
- Layout.fillWidth: true
-
- MoneroComponents.TextPlain {
- id: navUIText
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.verticalCenter: parent.verticalCenter
- font.family: grid.fontFamily
- font.pixelSize: grid.fontSize
- font.bold: grid.fontBold
- text: qsTr("Interface") + translationManager.emptyString
- color: navUI.isActive ? grid.fontColorActive : grid.fontColorInActive
- themeTransition: false
- }
-
- MouseArea {
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.PointingHandCursor
-
- onClicked: { settingsStateView.state = "UI" }
- }
+ Layout.fillHeight: true
+ width: 1
+ color: items.length > 0 && items[0].active ? grid.borderColor : "transparent";
}
- Rectangle {
+ Rectangle {
color: grid.borderColor
Layout.preferredHeight: 1
- Layout.fillWidth: true
+ Layout.preferredWidth: 1
}
}
- Rectangle{
- Layout.preferredWidth: 1
- Layout.preferredHeight: 32
- color: grid.borderColor
- }
- ColumnLayout {
- // NODE
- id: navNode
- property bool isActive: settingsStateView.state === "Node"
- visible: appWindow.walletMode >= 2
- Layout.preferredWidth: navNodeText.width + grid.textMargin
- Layout.preferredHeight: 32
- Layout.minimumWidth: 72
+ }
+
+ Repeater {
+ model: items.length
+
+ RowLayout {
spacing: 0
- Rectangle {
+ Rectangle {
+ Layout.preferredWidth: 1
+ Layout.preferredHeight: 32
color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
+ visible: index > 0 && items[index - 1].visible
}
- Rectangle {
- color: parent.isActive ? grid.borderColor : "transparent"
- height: 30
+ ColumnLayout {
+ Layout.minimumWidth: 72
+ Layout.preferredHeight: 32
Layout.fillWidth: true
+ spacing: 0
+ visible: items[index].visible
- MoneroComponents.TextPlain {
- id: navNodeText
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.verticalCenter: parent.verticalCenter
- font.family: grid.fontFamily
- font.pixelSize: grid.fontSize
- font.bold: grid.fontBold
- text: qsTr("Node") + translationManager.emptyString
- color: navNode.isActive ? grid.fontColorActive : grid.fontColorInActive
- themeTransition: false
- }
-
- MouseArea {
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.PointingHandCursor
-
- onClicked: { settingsStateView.state = "Node" }
+ Rectangle {
+ color: grid.borderColor
+ Layout.preferredHeight: 1
+ Layout.fillWidth: true
}
- }
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
- }
- Rectangle{
- visible: appWindow.walletMode >= 2
- Layout.preferredWidth: 1
- Layout.preferredHeight: 32
- color: grid.borderColor
- }
- ColumnLayout {
- // LOG
- id: navLog
- property bool isActive: settingsStateView.state === "Log"
- Layout.preferredWidth: navLogText.width + grid.textMargin
- Layout.preferredHeight: 32
- Layout.minimumWidth: 72
- spacing: 0
+ Rectangle {
+ Layout.minimumHeight: 30
+ color: items[index].active ? grid.borderColor : "transparent"
+ height: children[0].height
+ width: children[0].width
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
+ MoneroComponents.TextPlain {
+ anchors.verticalCenter: parent.verticalCenter
+ font.family: grid.fontFamily
+ font.pixelSize: grid.fontSize
+ font.bold: grid.fontBold
+ leftPadding: grid.textMargin / 2
+ rightPadding: grid.textMargin / 2
+ text: items[index].text
+ color: items[index].active ? grid.fontColorActive : grid.fontColorInActive
+ themeTransition: false
+ }
- Rectangle {
- color: parent.isActive ? grid.borderColor : "transparent"
- height: 30
- Layout.fillWidth: true
+ MouseArea {
+ anchors.fill: parent
+ hoverEnabled: true
+ cursorShape: Qt.PointingHandCursor
- MoneroComponents.TextPlain {
- id: navLogText
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.verticalCenter: parent.verticalCenter
- font.family: grid.fontFamily
- font.pixelSize: grid.fontSize
- font.bold: grid.fontBold
- text: qsTr("Log") + translationManager.emptyString
- color: navLog.isActive ? grid.fontColorActive : grid.fontColorInActive
- themeTransition: false
+ onClicked: items[index].selected()
+ }
}
- MouseArea {
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.PointingHandCursor
-
- onClicked: { settingsStateView.state = "Log" }
+ Rectangle {
+ color: grid.borderColor
+ Layout.preferredHeight: 1
+ Layout.fillWidth: true
}
}
-
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
}
- Rectangle{
- visible: appWindow.walletMode >= 2
- Layout.preferredWidth: 1
- Layout.preferredHeight: 32
+ }
+
+ Rectangle {
+ // navbar right side border
+ id: navBarRight
+ Layout.preferredWidth: 2
+ Layout.preferredHeight: 32
+ color: "transparent"
+ rotation: 180
+
+ Rectangle {
+ anchors.left: parent.left
+ anchors.verticalCenter: parent.verticalCenter
+ width: 1
+ height: parent.height - 2
color: grid.borderColor
}
+
ColumnLayout {
- // INFO
- id: navInfo
- property bool isActive: settingsStateView.state === "Info"
- Layout.preferredWidth: navInfoText.width + grid.textMargin
- Layout.preferredHeight: 32
- Layout.minimumWidth: 72
+ anchors.top: parent.top
+ anchors.bottom: parent.bottom
+ anchors.right: parent.right
+ width: 1
spacing: 0
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.fillWidth: true
- }
-
Rectangle {
- color: parent.isActive ? grid.borderColor : "transparent"
- height: 30
- Layout.fillWidth: true
-
- MoneroComponents.TextPlain {
- id: navInfoText
- anchors.horizontalCenter: parent.horizontalCenter
- anchors.verticalCenter: parent.verticalCenter
- font.family: grid.fontFamily
- font.pixelSize: grid.fontSize
- font.bold: grid.fontBold
- text: qsTr("Info") + translationManager.emptyString
- color: navInfo.isActive ? grid.fontColorActive : grid.fontColorInActive
- themeTransition: false
- }
-
- MouseArea {
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.PointingHandCursor
-
- onClicked: { settingsStateView.state = "Info" }
- }
- }
-
- Rectangle {
- color: grid.borderColor
Layout.preferredHeight: 1
- Layout.fillWidth: true
+ Layout.preferredWidth: 1
+ color: grid.borderColor
}
- }
-
- Rectangle {
- // navbar right side border
- id: navBarRight
- property bool isActive: settingsStateView.state === "Info"
- Layout.preferredWidth: 2
- Layout.preferredHeight: 32
- color: "transparent"
- rotation: 180
Rectangle {
- anchors.left: parent.left
- anchors.verticalCenter: parent.verticalCenter
+ Layout.fillHeight: true
width: 1
- height: parent.height - 2
- color: grid.borderColor
+ color: items.length > 0 && items[items.length - 1].active ? grid.borderColor : "transparent"
}
- ColumnLayout {
- anchors.top: parent.top
- anchors.bottom: parent.bottom
- anchors.right: parent.right
- width: 1
- spacing: 0
-
- Rectangle {
- Layout.preferredHeight: 1
- Layout.preferredWidth: 1
- color: grid.borderColor
- }
-
- Rectangle {
- Layout.fillHeight: true
- width: 1
- color: navBarRight.isActive ? grid.borderColor : "transparent"
- }
-
- Rectangle {
- color: grid.borderColor
- Layout.preferredHeight: 1
- Layout.preferredWidth: 1
- }
+ Rectangle {
+ color: grid.borderColor
+ Layout.preferredHeight: 1
+ Layout.preferredWidth: 1
}
}
}
+ }
}
diff --git a/components/NavbarItem.qml b/components/NavbarItem.qml
new file mode 100644
index 00000000..5d4cae06
--- /dev/null
+++ b/components/NavbarItem.qml
@@ -0,0 +1,37 @@
+// Copyright (c) 2021, The Monero Project
+//
+// All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without modification, are
+// permitted provided that the following conditions are met:
+//
+// 1. Redistributions of source code must retain the above copyright notice, this list of
+// conditions and the following disclaimer.
+//
+// 2. Redistributions in binary form must reproduce the above copyright notice, this list
+// of conditions and the following disclaimer in the documentation and/or other
+// materials provided with the distribution.
+//
+// 3. Neither the name of the copyright holder nor the names of its contributors may be
+// used to endorse or promote products derived from this software without specific
+// prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+// EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+// MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL
+// THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+// PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT,
+// STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF
+// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+import QtQuick 2.9
+
+QtObject {
+ property bool active: false
+ property string text
+ property bool visible: true
+
+ signal selected()
+}
generated by cgit v1.2.3 (git 2.51.0) at 2026-08-16 08:54:44 +0000