mirror of
https://github.com/monero-project/monero-gui.git
synced 2024-11-16 15:58:11 +00:00
New menu button layout - implemented arrow thingy
This commit is contained in:
Sander Ferdinand
moneromooo-monero
parent
ad68107e1b
commit
5fdc9d894e
4 changed files with 90 additions and 88 deletions
|
|
@ -289,6 +289,14 @@ Rectangle {
|
|||
}
|
||||
*/
|
||||
|
||||
// top border
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.leftMargin: 16
|
||||
color: "#313131"
|
||||
height: 1
|
||||
}
|
||||
|
||||
// ------------- Transfer tab ---------------
|
||||
MenuButton {
|
||||
|
|
|
|||
|
|
@ -58,21 +58,89 @@ Rectangle {
|
|||
|
||||
color: "black"
|
||||
property bool present: !under || under.checked || checked || under.numSelectedChildren > 0
|
||||
height: present ? ((appWindow.height >= 800) ? 40 * scaleRatio : 52 * scaleRatio ) : 0
|
||||
height: present ? ((appWindow.height >= 800) ? 44 * scaleRatio : 52 * scaleRatio ) : 0
|
||||
|
||||
Item {
|
||||
visible: parent.checked ? true : false
|
||||
width: 300
|
||||
height: 40
|
||||
// Button gradient whilst checked
|
||||
// @TODO: replace by .png - gradient not available in 2d renderer
|
||||
LinearGradient {
|
||||
visible: button.checked ? true : false
|
||||
anchors.fill: parent
|
||||
start: Qt.point(0, 0)
|
||||
end: Qt.point(300, 0)
|
||||
gradient: Gradient {
|
||||
GradientStop { position: 1.0; color: "#333333" }
|
||||
GradientStop { position: 0.0; color: "black" }
|
||||
}
|
||||
}
|
||||
|
||||
LinearGradient {
|
||||
anchors.fill: parent
|
||||
start: Qt.point(0, 0)
|
||||
end: Qt.point(300, 0)
|
||||
gradient: Gradient {
|
||||
GradientStop { position: 1.0; color: "#333333" }
|
||||
GradientStop { position: 0.0; color: "black" }
|
||||
}
|
||||
// button decorations that are subject to leftMargin offsets
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: parent.getOffset() + 20 * scaleRatio
|
||||
height: parent.height
|
||||
width: button.checked ? 20: 10
|
||||
color: "#00000000"
|
||||
|
||||
// dot if unchecked
|
||||
Rectangle {
|
||||
id: dot
|
||||
anchors.centerIn: parent
|
||||
width: 8 * scaleRatio
|
||||
height: 8 * scaleRatio
|
||||
radius: 4 * scaleRatio
|
||||
color: button.dotColor
|
||||
visible: !button.checked
|
||||
}
|
||||
|
||||
// arrow if checked
|
||||
Image {
|
||||
anchors.centerIn: parent
|
||||
anchors.left: parent.left
|
||||
source: "../images/menuArrow.png"
|
||||
visible: button.checked
|
||||
}
|
||||
|
||||
// button text
|
||||
Text {
|
||||
id: label
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.right
|
||||
anchors.leftMargin: 8 * scaleRatio
|
||||
font.family: "Arial"
|
||||
font.bold: true
|
||||
font.pixelSize: 16 * scaleRatio
|
||||
color: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
|
||||
// menu button right arrow
|
||||
Image {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 20 * scaleRatio
|
||||
anchors.leftMargin: parent.getOffset()
|
||||
source: "../images/right.png"
|
||||
opacity: button.checked ? 1.0 : 0.4
|
||||
}
|
||||
|
||||
Text {
|
||||
id: symbolText
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: 11 * scaleRatio
|
||||
font.bold: true
|
||||
color: button.checked || buttonArea.containsMouse ? "#FFFFFF" : dot.color
|
||||
visible: appWindow.ctrlPressed
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: buttonArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
if(parent.checked)
|
||||
return
|
||||
button.doClick()
|
||||
parent.checked = true
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -94,79 +162,4 @@ Rectangle {
|
|||
// we get the value of checked before the change
|
||||
ScriptAction { script: if (under) under.numSelectedChildren += checked > 0 ? -1 : 1 }
|
||||
}
|
||||
|
||||
Item {
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: parent.getOffset()
|
||||
width: 46 * scaleRatio
|
||||
|
||||
Rectangle {
|
||||
id: dot
|
||||
anchors.centerIn: parent
|
||||
width: 8 * scaleRatio
|
||||
height: width
|
||||
radius: height / 2
|
||||
|
||||
Rectangle {
|
||||
anchors.centerIn: parent
|
||||
width: 8 * scaleRatio
|
||||
height: width
|
||||
radius: height / 2
|
||||
color: "#1C1C1C"
|
||||
visible: !button.checked && !buttonArea.containsMouse
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
id: symbolText
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: 11 * scaleRatio
|
||||
font.bold: true
|
||||
color: button.checked || buttonArea.containsMouse ? "#FFFFFF" : dot.color
|
||||
visible: appWindow.ctrlPressed
|
||||
}
|
||||
}
|
||||
|
||||
// Rectangle {
|
||||
// anchors.left: parent.left
|
||||
// anchors.top: parent.top
|
||||
// anchors.bottom: parent.bottom
|
||||
// width: 1
|
||||
// color: "#DBDBDB"
|
||||
// visible: parent.checked
|
||||
// }
|
||||
|
||||
// menu button arrow
|
||||
Image {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 20 * scaleRatio
|
||||
anchors.leftMargin: parent.getOffset()
|
||||
source: "../images/right.png"
|
||||
}
|
||||
|
||||
// menu button text
|
||||
Text {
|
||||
id: label
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: parent.getOffset() + 38 * scaleRatio
|
||||
font.family: "Arial"
|
||||
font.pixelSize: 16 * scaleRatio
|
||||
color: "#FFFFFF"
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: buttonArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
if(parent.checked)
|
||||
return
|
||||
button.doClick()
|
||||
parent.checked = true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
BIN
images/menuArrow.png
Executable file
BIN
images/menuArrow.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
1
qml.qrc
1
qml.qrc
|
|
@ -177,5 +177,6 @@
|
|||
<file>images/balanceGradient.jpg</file>
|
||||
<file>images/titlebarGradient.jpg</file>
|
||||
<file>images/titlebarLogo.png</file>
|
||||
<file>images/menuArrow.png</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
|
|||
Loading…
Reference in a new issue