diff --git a/bitmonero.pro.user b/bitmonero.pro.user index 2edad78d..46969c8e 100644 --- a/bitmonero.pro.user +++ b/bitmonero.pro.user @@ -1,6 +1,6 @@ - + ProjectExplorer.Project.ActiveTarget @@ -54,8 +54,8 @@ ProjectExplorer.Project.Target.0 - Desktop Qt 5.3.0 MinGW 32bit - Desktop Qt 5.3.0 MinGW 32bit + Desktop Qt 5.3 MinGW 32bit + Desktop Qt 5.3 MinGW 32bit qt.53.win32_mingw482_kit 0 0 diff --git a/components/CheckBox.qml b/components/CheckBox.qml new file mode 100644 index 00000000..f075e83c --- /dev/null +++ b/components/CheckBox.qml @@ -0,0 +1,54 @@ +import QtQuick 2.0 + +Item { + id: checkBox + property alias text: label.text + property bool checked: false + signal clicked() + height: 25 + width: label.x + label.width + clip: true + + Rectangle { + anchors.left: parent.left + height: parent.height - 1 + width: 25 + radius: 4 + y: 0 + color: "#DBDBDB" + } + + Rectangle { + anchors.left: parent.left + height: parent.height - 1 + width: 25 + radius: 4 + y: 1 + color: "#FFFFFF" + + Image { + anchors.centerIn: parent + source: checkBox.checked ? "../images/checkedIcon.png" : + "../images/uncheckedIcon.png" + } + } + + Text { + id: label + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: 25 + 12 + font.family: "Arial" + font.pixelSize: 14 + font.letterSpacing: -1 + color: "#525252" + } + + MouseArea { + anchors.fill: parent + onClicked: { + checkBox.checked = !checkBox.checked + checkBox.clicked() + } + } +} diff --git a/components/Label.qml b/components/Label.qml index 46197718..81b2c6c2 100644 --- a/components/Label.qml +++ b/components/Label.qml @@ -4,8 +4,10 @@ Item { id: item property alias text: label.text property alias color: label.color + property alias textFormat: label.textFormat property string tipText: "" property int fontSize: 12 + signal linkActivated() width: icon.x + icon.width height: icon.height @@ -17,6 +19,7 @@ Item { font.family: "Arial" font.pixelSize: parent.fontSize color: "#555555" + onLinkActivated: item.linkActivated() } Image { diff --git a/components/PrivacyLevel.qml b/components/PrivacyLevel.qml new file mode 100644 index 00000000..f5ada015 --- /dev/null +++ b/components/PrivacyLevel.qml @@ -0,0 +1,123 @@ +import QtQuick 2.0 + +Item { + id: item + property int fillLevel: 0 + height: 70 + clip: true + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + height: 24 + radius: 4 + color: "#DBDBDB" + } + + Rectangle { + id: bar + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.topMargin: 1 + height: 24 + radius: 4 + color: "#FFFFFF" + + Rectangle { + id: fillRect + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.margins: 4 + radius: 2 + color: { + if(item.fillLevel < 3) return "#FF6C3C" + if(item.fillLevel < repeater.count - 1) return "#FFE00A" + return "#36B25C" + } + width: row.x + } + + MouseArea { + anchors.fill: parent + function positionBar() { + var xDiff = 999999 + var index = -1 + for(var i = 0; i < repeater.count; ++i) { + var tmp = Math.abs(repeater.modelItems[i].x + row.x - mouseX) + if(tmp < xDiff) { + xDiff = tmp + index = i + } + } + + if(index !== -1) { + fillRect.width = Qt.binding(function(){ return repeater.modelItems[index].x + row.x; }) + item.fillLevel = index + } + } + + onClicked: positionBar() + onMouseXChanged: positionBar() + } + } + + Row { + id: row + anchors.right: bar.right + anchors.rightMargin: 8 + anchors.top: bar.bottom + anchors.topMargin: -1 + spacing: ((bar.width - 8) / 2) / 10 + + Repeater { + id: repeater + model: 14 + property var modelItems: new Array() + + delegate: Item { + id: delegate + width: 1 + height: 48 + property bool mainTick: index === 0 || index === 3 || index === repeater.count - 1 + + Component.onCompleted: repeater.modelItems[index] = delegate + + Image { + anchors.horizontalCenter: parent.horizontalCenter + anchors.top: parent.top + visible: parent.mainTick + source: "../images/privacyTick.png" + + Text { + anchors.right: parent.right + anchors.rightMargin: 12 + anchors.bottom: parent.bottom + anchors.bottomMargin: 2 + font.family: "Arial" + font.bold: true + font.pixelSize: 12 + color: "#4A4949" + text: { + if(index === 0) return qsTr("LOW") + if(index === 3) return qsTr("MEDIUM") + if(index === repeater.count - 1) return qsTr("HIGH") + return "" + } + } + } + + Rectangle { + anchors.top: parent.top + anchors.topMargin: 14 + width: 1 + color: "#DBDBDB" + height: index === 8 ? 16 : 8 + visible: !parent.mainTick + } + } + } + } +} diff --git a/images/checkedIcon.png b/images/checkedIcon.png new file mode 100644 index 00000000..690412b0 Binary files /dev/null and b/images/checkedIcon.png differ diff --git a/images/privacyTick.png b/images/privacyTick.png new file mode 100644 index 00000000..5366f0fb Binary files /dev/null and b/images/privacyTick.png differ diff --git a/images/uncheckedIcon.png b/images/uncheckedIcon.png new file mode 100644 index 00000000..60d7cf46 Binary files /dev/null and b/images/uncheckedIcon.png differ diff --git a/pages/Transfer.qml b/pages/Transfer.qml index 3aa47c46..97520747 100644 --- a/pages/Transfer.qml +++ b/pages/Transfer.qml @@ -10,20 +10,24 @@ Rectangle { anchors.top: parent.top anchors.margins: 17 text: qsTr("Amount") + fontSize: 14 } Label { id: transactionPriority anchors.top: parent.top anchors.topMargin: 17 + fontSize: 14 x: (parent.width - 17) / 2 + 17 text: qsTr("Transaction prority") } Row { anchors.top: amountLabel.bottom - anchors.topMargin: 17 - width: (parent.width - 17) / 2 + anchors.topMargin: 5 + anchors.left: parent.left + anchors.leftMargin: 7 + width: (parent.width - 17) / 2 + 10 Item { width: 37 height: 37 @@ -41,10 +45,11 @@ Rectangle { } StandardDropdown { + id: priorityDropdown anchors.top: transactionPriority.bottom anchors.right: parent.right anchors.rightMargin: 17 - anchors.topMargin: 17 + anchors.topMargin: 5 anchors.left: transactionPriority.left shadowReleasedColor: "#FF4304" shadowPressedColor: "#B32D00" @@ -52,4 +57,94 @@ Rectangle { pressedColor: "#FF4304" z: 1 } + + Label { + id: privacyLabel + anchors.left: parent.left + anchors.right: parent.right + anchors.top: priorityDropdown.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 30 + fontSize: 14 + text: qsTr("Privacy Level") + } + + PrivacyLevel { + id: privacyLevelItem + anchors.left: parent.left + anchors.right: parent.right + anchors.top: privacyLabel.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 5 + } + + Label { + id: addressLabel + anchors.left: parent.left + anchors.right: parent.right + anchors.top: privacyLevelItem.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 30 + fontSize: 14 + + textFormat: Text.RichText + text: qsTr("\ + Address ( Type in or select from Address book )") + + onLinkActivated: console.log("link activated") + } + + LineEdit { + id: addressLine + anchors.left: parent.left + anchors.right: parent.right + anchors.top: addressLabel.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 5 + } + + Label { + id: paymentLabel + anchors.left: parent.left + anchors.right: parent.right + anchors.top: addressLine.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 17 + fontSize: 14 + text: qsTr("Payment ID ( Optional )") + } + + Row { + anchors.left: parent.left + anchors.right: parent.right + anchors.top: paymentLabel.bottom + anchors.leftMargin: 17 + anchors.rightMargin: 17 + anchors.topMargin: 5 + spacing: 17 + + LineEdit { + width: 156 + } + + StandardButton { + id: sendButton + width: 60 + text: qsTr("SEND") + shadowReleasedColor: "#FF4304" + shadowPressedColor: "#B32D00" + releasedColor: "#FF6C3C" + pressedColor: "#FF4304" + } + + CheckBox { + text: qsTr("Add to Address book") + anchors.bottom: sendButton.bottom + } + } } diff --git a/qml.qrc b/qml.qrc index 33a68b66..8514067f 100644 --- a/qml.qrc +++ b/qml.qrc @@ -60,5 +60,10 @@ images/moneroIcon.png components/StandardDropdown.qml images/whiteDropIndicator.png + components/PrivacyLevel.qml + images/privacyTick.png + components/CheckBox.qml + images/checkedIcon.png + images/uncheckedIcon.png