transfer v2 + checkbox

bitmonero.pro.user

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtCreator 3.1.2, 2014-07-10T20:07:14. -->
+<!-- Written by QtCreator 3.1.2, 2014-07-11T00:19:38. -->
 <qtcreator>
  <data>
   <variable>ProjectExplorer.Project.ActiveTarget</variable>
@@ -54,8 +54,8 @@
  <data>
   <variable>ProjectExplorer.Project.Target.0</variable>
   <valuemap type="QVariantMap">
-   <value type="QString" key="ProjectExplorer.ProjectConfiguration.DefaultDisplayName">Desktop Qt 5.3.0 MinGW 32bit</value>
+   <value type="QString" key="ProjectExplorer.ProjectConfiguration.DefaultDisplayName">Desktop Qt 5.3 MinGW 32bit</value>
-   <value type="QString" key="ProjectExplorer.ProjectConfiguration.DisplayName">Desktop Qt 5.3.0 MinGW 32bit</value>
+   <value type="QString" key="ProjectExplorer.ProjectConfiguration.DisplayName">Desktop Qt 5.3 MinGW 32bit</value>
    <value type="QString" key="ProjectExplorer.ProjectConfiguration.Id">qt.53.win32_mingw482_kit</value>
    <value type="int" key="ProjectExplorer.Target.ActiveBuildConfiguration">0</value>
    <value type="int" key="ProjectExplorer.Target.ActiveDeployConfiguration">0</value>

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()
+        }
+    }
+}

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 {

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
+                }
+            }
+        }
+    }
+}

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
+        anchors.topMargin: 5
-        width: (parent.width - 17) / 2
+        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("<style type='text/css'>a {text-decoration: none; color: #FF6C3C; font-size: 14px;}</style>\
+                    Address <font size='2'>  ( Type in  or select from </font> <a href='#'>Address</a><font size='2'> book )</font>")
+
+        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 <font size='2'>( Optional )</font>")
+    }
+
+    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
+        }
+    }
 }

qml.qrc

@@ -60,5 +60,10 @@
         <file>images/moneroIcon.png</file>
         <file>components/StandardDropdown.qml</file>
         <file>images/whiteDropIndicator.png</file>
+        <file>components/PrivacyLevel.qml</file>
+        <file>images/privacyTick.png</file>
+        <file>components/CheckBox.qml</file>
+        <file>images/checkedIcon.png</file>
+        <file>images/uncheckedIcon.png</file>
     </qresource>
 </RCC>