mirror of
https://github.com/monero-project/monero-gui.git
synced 2026-04-08 14:27:25 -04:00
fixes + addressbook v1 + transfer v1
This commit is contained in:
marcin
@@ -40,7 +40,7 @@ Rectangle {
|
||||
font.pixelSize: 11
|
||||
font.bold: true
|
||||
color: button.checked || buttonArea.containsMouse ? "#FFFFFF" : dot.color
|
||||
visible: appWindow.ctrlPressed
|
||||
visible: appWindow.altPressed
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -8,14 +8,14 @@ Item {
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: "#DBDBDB"
|
||||
radius: 10
|
||||
radius: 4
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
anchors.topMargin: 1
|
||||
color: "#FFFFFF"
|
||||
radius: 10
|
||||
radius: 4
|
||||
|
||||
Item {
|
||||
anchors.top: parent.top
|
||||
|
||||
233
components/StandardDropdown.qml
Normal file
233
components/StandardDropdown.qml
Normal file
@@ -0,0 +1,233 @@
|
||||
import QtQuick 2.0
|
||||
|
||||
Item {
|
||||
id: dropdown
|
||||
property string shadowPressedColor
|
||||
property string shadowReleasedColor
|
||||
property string pressedColor
|
||||
property string releasedColor
|
||||
property string textColor: "#FFFFFF"
|
||||
property alias currentIndex: column.currentIndex
|
||||
property bool expanded: false
|
||||
height: 37
|
||||
|
||||
onExpandedChanged: if(expanded) appWindow.currentItem = dropdown
|
||||
function hide() { dropdown.expanded = false }
|
||||
function containsPoint(px, py) {
|
||||
if(px < 0)
|
||||
return false
|
||||
if(px > width)
|
||||
return false
|
||||
if(py < 0)
|
||||
return false
|
||||
if(py > height + droplist.height)
|
||||
return false
|
||||
return true
|
||||
}
|
||||
|
||||
Item {
|
||||
id: head
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
height: 37
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: parent.height - 1
|
||||
y: dropdown.expanded || droplist.height > 0 ? 0 : 1
|
||||
color: dropdown.expanded || droplist.height > 0 ? dropdown.shadowPressedColor : dropdown.shadowReleasedColor
|
||||
radius: 4
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: parent.height - 1
|
||||
y: dropdown.expanded || droplist.height > 0 ? 1 : 0
|
||||
color: dropdown.expanded || droplist.height > 0 ? dropdown.pressedColor : dropdown.releasedColor
|
||||
radius: 4
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.bottom: parent.bottom
|
||||
height: 3
|
||||
width: 3
|
||||
color: dropdown.pressedColor
|
||||
visible: dropdown.expanded || droplist.height > 0
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.bottom: parent.bottom
|
||||
height: 3
|
||||
width: 3
|
||||
color: dropdown.pressedColor
|
||||
visible: dropdown.expanded || droplist.height > 0
|
||||
}
|
||||
|
||||
Text {
|
||||
id: firstColText
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 12
|
||||
elide: Text.ElideRight
|
||||
font.family: "Arial"
|
||||
font.bold: true
|
||||
font.pixelSize: 12
|
||||
color: "#FFFFFF"
|
||||
text: repeater.model.get(column.currentIndex).column1
|
||||
}
|
||||
|
||||
Text {
|
||||
id: secondColText
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: separator.left
|
||||
anchors.rightMargin: 12
|
||||
width: dropdown.expanded ? w : (separator.x - 12) - (firstColText.x + firstColText.width + 5)
|
||||
font.family: "Arial"
|
||||
font.pixelSize: 12
|
||||
color: "#FFFFFF"
|
||||
text: repeater.model.get(column.currentIndex).column2
|
||||
|
||||
property int w: 0
|
||||
Component.onCompleted: w = implicitWidth
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: separator
|
||||
anchors.right: dropIndicator.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
height: 18
|
||||
width: 1
|
||||
color: "#FFFFFF"
|
||||
}
|
||||
|
||||
Item {
|
||||
id: dropIndicator
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
width: 32
|
||||
|
||||
Image {
|
||||
anchors.centerIn: parent
|
||||
source: "../images/whiteDropIndicator.png"
|
||||
rotation: dropdown.expanded ? 180 : 0
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: dropArea
|
||||
anchors.fill: parent
|
||||
onClicked: dropdown.expanded = !dropdown.expanded
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: droplist
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: head.bottom
|
||||
clip: true
|
||||
height: dropdown.expanded ? column.height : 0
|
||||
color: dropdown.pressedColor
|
||||
radius: 4
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
width: 3; height: 3
|
||||
color: dropdown.pressedColor
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
width: 3; height: 3
|
||||
color: dropdown.pressedColor
|
||||
}
|
||||
|
||||
Behavior on height {
|
||||
NumberAnimation { duration: 100; easing.type: Easing.InQuad }
|
||||
}
|
||||
|
||||
ListModel {
|
||||
id: testModel
|
||||
ListElement { column1: "LOW"; column2: "( fee: 0.0002 )" }
|
||||
ListElement { column1: "MEDIUM"; column2: "( fee: 0.0004 )" }
|
||||
ListElement { column1: "HIGH"; column2: "( fee: 0.0008 )" }
|
||||
}
|
||||
|
||||
Column {
|
||||
id: column
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
property int currentIndex: 0
|
||||
|
||||
Repeater {
|
||||
id: repeater
|
||||
model: testModel
|
||||
|
||||
delegate: Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: 30
|
||||
radius: index === repeater.count - 1 ? 4 : 0
|
||||
color: itemArea.containsMouse || index === column.currentIndex || itemArea.containsMouse ? dropdown.releasedColor : dropdown.pressedColor
|
||||
|
||||
Text {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.right: col2Text.left
|
||||
anchors.leftMargin: 12
|
||||
anchors.rightMargin: column2.length > 0 ? 12 : 0
|
||||
font.family: "Arial"
|
||||
font.bold: true
|
||||
font.pixelSize: 12
|
||||
color: "#FFFFFF"
|
||||
text: column1
|
||||
}
|
||||
|
||||
Text {
|
||||
id: col2Text
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 45
|
||||
font.family: "Arial"
|
||||
font.pixelSize: 12
|
||||
color: "#FFFFFF"
|
||||
text: column2
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
width: 3; height: 3
|
||||
color: parent.color
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
width: 3; height: 3
|
||||
color: parent.color
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: itemArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
dropdown.expanded = false
|
||||
column.currentIndex = index
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -83,92 +83,98 @@ Item {
|
||||
anchors.rightMargin: 10
|
||||
source: "../images/dropIndicator.png"
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onPressed: dropdown.expanded = !dropdown.expanded
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: dropArea
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: head.bottom
|
||||
height: dropdown.expanded ? column.height : 0
|
||||
onHeightChanged: if(height === 0) dropdown.collapsed()
|
||||
clip: true
|
||||
MouseArea {
|
||||
anchors.left: head.left
|
||||
anchors.right: head.right
|
||||
anchors.top: head.top
|
||||
height: head.height + dropArea.height
|
||||
hoverEnabled: true
|
||||
onEntered: dropdown.expanded = true
|
||||
onExited: dropdown.expanded = false
|
||||
|
||||
Behavior on height {
|
||||
NumberAnimation { duration: 100; easing.type: Easing.InQuad }
|
||||
}
|
||||
|
||||
Column {
|
||||
id: column
|
||||
Item {
|
||||
id: dropArea
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
y: head.height
|
||||
height: dropdown.expanded ? column.height : 0
|
||||
onHeightChanged: if(height === 0) dropdown.collapsed()
|
||||
clip: true
|
||||
|
||||
ListModel {
|
||||
id: dataModel
|
||||
ListElement { name: "<b>Add to adress book</b>"; icon: "../images/dropdownOption1.png" }
|
||||
ListElement { name: "<b>Send to same destination</b>"; icon: "../images/dropdownSend.png" }
|
||||
ListElement { name: "<b>Find similar transactions</b>"; icon: "../images/dropdownSearch.png" }
|
||||
Behavior on height {
|
||||
NumberAnimation { duration: 100; easing.type: Easing.InQuad }
|
||||
}
|
||||
|
||||
Repeater {
|
||||
id: repeater
|
||||
model: dataModel
|
||||
Column {
|
||||
id: column
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
|
||||
delegate: Rectangle {
|
||||
id: delegate
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
height: 30
|
||||
color: delegateArea.containsMouse ? "#F0EEEE" : "#DBDBDB"
|
||||
radius: index === repeater.count - 1 ? 5 : 0
|
||||
ListModel {
|
||||
id: dataModel
|
||||
ListElement { name: "<b>Add to adress book</b>"; icon: "../images/dropdownOption1.png" }
|
||||
ListElement { name: "<b>Send to same destination</b>"; icon: "../images/dropdownSend.png" }
|
||||
ListElement { name: "<b>Find similar transactions</b>"; icon: "../images/dropdownSearch.png" }
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
Repeater {
|
||||
id: repeater
|
||||
model: dataModel
|
||||
|
||||
delegate: Rectangle {
|
||||
id: delegate
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
width: 5
|
||||
height: 5
|
||||
color: delegate.color
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
width: 5
|
||||
height: 5
|
||||
color: delegate.color
|
||||
}
|
||||
height: 30
|
||||
color: delegateArea.containsMouse ? "#F0EEEE" : "#DBDBDB"
|
||||
radius: index === repeater.count - 1 ? 5 : 0
|
||||
|
||||
Image {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 10
|
||||
source: icon
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: delegateArea
|
||||
hoverEnabled: true
|
||||
anchors.fill: parent
|
||||
onEntered: {
|
||||
var pos = rootItem.mapFromItem(delegate, 30, -20)
|
||||
tipItem.text = name
|
||||
tipItem.x = pos.x
|
||||
if(tipItem.height > 30)
|
||||
pos.y -= tipItem.height - 30
|
||||
tipItem.y = pos.y
|
||||
tipItem.visible = true
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
width: 5
|
||||
height: 5
|
||||
color: delegate.color
|
||||
}
|
||||
onExited: tipItem.visible = false
|
||||
onClicked: {
|
||||
dropdown.optionClicked(index)
|
||||
tipItem.visible = false
|
||||
dropdown.expanded = false
|
||||
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
width: 5
|
||||
height: 5
|
||||
color: delegate.color
|
||||
}
|
||||
|
||||
Image {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 10
|
||||
source: icon
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: delegateArea
|
||||
hoverEnabled: true
|
||||
anchors.fill: parent
|
||||
propagateComposedEvents: true
|
||||
onEntered: {
|
||||
var pos = rootItem.mapFromItem(delegate, 30, -20)
|
||||
tipItem.text = name
|
||||
tipItem.x = pos.x
|
||||
if(tipItem.height > 30)
|
||||
pos.y -= tipItem.height - 30
|
||||
tipItem.y = pos.y
|
||||
tipItem.visible = true
|
||||
}
|
||||
onExited: tipItem.visible = false
|
||||
onClicked: {
|
||||
dropdown.optionClicked(index)
|
||||
tipItem.visible = false
|
||||
dropdown.expanded = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user