From 48add34d574f55e3b8053ba3ae18211999dc786c Mon Sep 17 00:00:00 2001 From: marcin Date: Thu, 21 Aug 2014 12:09:52 +0200 Subject: [PATCH] wizard v1.0 --- bitmonero.pro.user | 2 +- components/CheckBox.qml | 6 +- components/PrivacyLevelSmall.qml | 3 + images/copyToClipboard.png | Bin 0 -> 306 bytes images/greyTriangle.png | Bin 0 -> 312 bytes main.qml | 7 ++ pages/History.qml | 1 - qml.qrc | 6 ++ wizard/WizardConfigure.qml | 151 +++++++++++++++++++++++++++++ wizard/WizardCreateWallet.qml | 160 ++++++++++++++++++++++++++++++- wizard/WizardDonation.qml | 125 ++++++++++++++++++++++++ wizard/WizardFinish.qml | 69 +++++++++++++ wizard/WizardMain.qml | 45 +++++++++ wizard/WizardOptions.qml | 11 ++- wizard/WizardPassword.qml | 141 +++++++++++++++++++++++++++ wizard/WizardWelcome.qml | 10 ++ 16 files changed, 730 insertions(+), 7 deletions(-) create mode 100644 images/copyToClipboard.png create mode 100644 images/greyTriangle.png create mode 100644 wizard/WizardConfigure.qml create mode 100644 wizard/WizardDonation.qml create mode 100644 wizard/WizardFinish.qml create mode 100644 wizard/WizardPassword.qml diff --git a/bitmonero.pro.user b/bitmonero.pro.user index 53b50808..12c88185 100644 --- a/bitmonero.pro.user +++ b/bitmonero.pro.user @@ -1,6 +1,6 @@ - + ProjectExplorer.Project.ActiveTarget diff --git a/components/CheckBox.qml b/components/CheckBox.qml index adc9a232..7486e900 100644 --- a/components/CheckBox.qml +++ b/components/CheckBox.qml @@ -6,6 +6,9 @@ Item { property string checkedIcon property string uncheckedIcon property bool checked: false + property alias background: backgroundRect.color + property int fontSize: 14 + property alias fontColor: label.color signal clicked() height: 25 width: label.x + label.width @@ -21,6 +24,7 @@ Item { } Rectangle { + id: backgroundRect anchors.left: parent.left height: parent.height - 1 width: 25 @@ -41,7 +45,7 @@ Item { anchors.left: parent.left anchors.leftMargin: 25 + 12 font.family: "Arial" - font.pixelSize: 14 + font.pixelSize: checkBox.fontSize font.letterSpacing: -1 color: "#525252" } diff --git a/components/PrivacyLevelSmall.qml b/components/PrivacyLevelSmall.qml index 26ff8ed4..063ce333 100644 --- a/components/PrivacyLevelSmall.qml +++ b/components/PrivacyLevelSmall.qml @@ -2,6 +2,8 @@ import QtQuick 2.0 Item { id: item + property alias interactive: mouseArea.enabled + property alias background: bar.color property int fillLevel: 0 height: 40 clip: true @@ -88,6 +90,7 @@ Item { } MouseArea { + id: mouseArea anchors.fill: parent function positionBar() { var xDiff = 999999 diff --git a/images/copyToClipboard.png b/images/copyToClipboard.png new file mode 100644 index 0000000000000000000000000000000000000000..56e36a2f985aa5d26f9cf991e81cfa14070a32bf GIT binary patch literal 306 zcmeAS@N?(olHy`uVBq!ia0vp^d_XM3!3HF=W8NDADVAa<&kznEsNqQI0P;BtJR*x3 z7`TN%nDNrxx<5ccnG)BClHmNblJdl&R0hYC{G?O`x6Go{^8BLgVg=`5vln|d^#Ik0 zfz&w{r6!hS=I1GdWag$a7+B~V8R{FFe6+}j0;=fpba4!^=-oQ$B5#8Nj|>0f{d{S$ zj$wtuk&SxK*nTMfXv_^2(to(RvON62(kTj=YPT2_jQTI_5nmbHY}mXw)9dEVrz#tr zY~SmIdv9NL^rz?9&g*^gSLgf?Cg8Pmx~S?=U}rJdp7j|)ro=B zITxiSmSpDVDTHL^rZN~<=o=a88=8Ey$cO@}nBeK+7~;`+^z2R11_d6L15@2{&mMZg zy8laMfy#uOWsNtzG&?2~+XaR2BrJa(&ckr!k7V%Ye4o?VhN}5T-&N|Dops+Bt=Ab_ zl$kRxJLz(a^z5g`8$Io$^`C2h4B98<|6J^2NS^5G;?ogRqmMtjqb&9`?xVr?p4~gk w@0^h=G)+Ice~#q-qOzLjf`$xBR!A`T*_#xu43Og82Xq^Qr>mdKI;Vst06xZUjsO4v literal 0 HcmV?d00001 diff --git a/main.qml b/main.qml index f6ff78d7..93eaf162 100644 --- a/main.qml +++ b/main.qml @@ -108,6 +108,9 @@ ApplicationWindow { PropertyChanges { target: middlePanel; visible: false } PropertyChanges { target: titleBar; basicButtonVisible: false } PropertyChanges { target: wizard; visible: true } + PropertyChanges { target: appWindow; width: 930; } + PropertyChanges { target: appWindow; height: 595; } + PropertyChanges { target: resizeArea; visible: false } }, State { name: "normal" @@ -116,6 +119,9 @@ ApplicationWindow { PropertyChanges { target: middlePanel; visible: true } PropertyChanges { target: titleBar; basicButtonVisible: true } PropertyChanges { target: wizard; visible: false } + PropertyChanges { target: appWindow; width: rightPanelExpanded ? 1269 : 1269 - 300; } + PropertyChanges { target: appWindow; height: 800; } + PropertyChanges { target: resizeArea; visible: true } } ] @@ -290,6 +296,7 @@ ApplicationWindow { property int maxWidth: leftPanel.width + 655 + rightPanel.width property int maxHeight: 700 MouseArea { + id: resizeArea hoverEnabled: true anchors.right: parent.right anchors.bottom: parent.bottom diff --git a/pages/History.qml b/pages/History.qml index 17eb130d..26b8c1de 100644 --- a/pages/History.qml +++ b/pages/History.qml @@ -147,7 +147,6 @@ Rectangle { onClicked: { if(checked) tableRect.height = Qt.binding(function(){ return tableRect.collapsedHeight }) else tableRect.height = Qt.binding(function(){ return tableRect.middleHeight }) - } } diff --git a/qml.qrc b/qml.qrc index 03ff35e1..21dd80a9 100644 --- a/qml.qrc +++ b/qml.qrc @@ -89,5 +89,11 @@ images/openAccount.png images/recoverWallet.png wizard/WizardCreateWallet.qml + images/greyTriangle.png + images/copyToClipboard.png + wizard/WizardPassword.qml + wizard/WizardConfigure.qml + wizard/WizardDonation.qml + wizard/WizardFinish.qml diff --git a/wizard/WizardConfigure.qml b/wizard/WizardConfigure.qml new file mode 100644 index 00000000..760ca2b2 --- /dev/null +++ b/wizard/WizardConfigure.qml @@ -0,0 +1,151 @@ +import QtQuick 2.2 +import "../components" + +Item { + opacity: 0 + visible: false + Behavior on opacity { + NumberAnimation { duration: 100; easing.type: Easing.InQuad } + } + + onOpacityChanged: visible = opacity !== 0 + + Row { + id: dotsRow + anchors.top: parent.top + anchors.right: parent.right + anchors.topMargin: 85 + spacing: 6 + + ListModel { + id: dotsModel + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#FFE00A" } + ListElement { dotColor: "#DBDBDB" } + } + + Repeater { + model: dotsModel + delegate: Rectangle { + width: 12; height: 12 + radius: 6 + color: dotColor + } + } + } + + Text { + id: headerText + anchors.left: parent.left + anchors.top: parent.top + anchors.topMargin: 74 + anchors.leftMargin: 16 + width: parent.width - dotsRow.width - 16 + + font.family: "Arial" + font.pixelSize: 28 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#3F3F3F" + text: qsTr("We’re almost there - let’s just configure some Monero preferences") + } + + Column { + anchors.left: parent.left + anchors.right: parent.right + anchors.top: headerText.bottom + anchors.topMargin: 34 + anchors.leftMargin: 16 + anchors.rightMargin: 16 + spacing: 24 + + Column { + anchors.left: parent.left + anchors.right: parent.right + spacing: 12 + + CheckBox { + text: qsTr("Kickstart the Monero blockchain?") + anchors.left: parent.left + anchors.right: parent.right + background: "#F0EEEE" + fontColor: "#4A4646" + fontSize: 18 + checkedIcon: "../images/checkedVioletIcon.png" + uncheckedIcon: "../images/uncheckedIcon.png" + checked: true + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 15 + color: "#4A4646" + wrapMode: Text.Wrap + text: qsTr("It is very important to write it down as this is the only backup you will need for your wallet. " + + "You will be asked to confirm the seed in the next screen to ensure it has copied down correctly.") + } + } + + Column { + anchors.left: parent.left + anchors.right: parent.right + spacing: 12 + + CheckBox { + text: qsTr("Enable disk conservation mode?") + anchors.left: parent.left + anchors.right: parent.right + background: "#F0EEEE" + fontColor: "#4A4646" + fontSize: 18 + checkedIcon: "../images/checkedVioletIcon.png" + uncheckedIcon: "../images/uncheckedIcon.png" + checked: true + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 15 + color: "#4A4646" + wrapMode: Text.Wrap + text: qsTr("Disk conservation mode uses substantially less disk-space, but the same amount of bandwidth as " + + "a regular Monero instance. However, storing the full blockchain is beneficial to the security " + + "of the Monero network. If you are on a device with limited disk space, then this option is appropriate for you.") + } + } + + Column { + anchors.left: parent.left + anchors.right: parent.right + spacing: 12 + + CheckBox { + text: qsTr("Allow background mining?") + anchors.left: parent.left + anchors.right: parent.right + background: "#F0EEEE" + fontColor: "#4A4646" + fontSize: 18 + checkedIcon: "../images/checkedVioletIcon.png" + uncheckedIcon: "../images/uncheckedIcon.png" + checked: true + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 15 + color: "#4A4646" + wrapMode: Text.Wrap + text: qsTr("Mining secures the Monero network, and also pays a small reward for the work done. This option " + + "will let Monero mine when your computer is on mains power and is idle. It will stop mining when you continue working.") + } + } + } +} diff --git a/wizard/WizardCreateWallet.qml b/wizard/WizardCreateWallet.qml index 0aef053c..8407f248 100644 --- a/wizard/WizardCreateWallet.qml +++ b/wizard/WizardCreateWallet.qml @@ -1,4 +1,6 @@ import QtQuick 2.2 +import moneroComponents 1.0 +import QtQuick.Dialogs 1.2 Item { opacity: 0 @@ -13,7 +15,7 @@ Item { id: dotsRow anchors.top: parent.top anchors.right: parent.right - anchors.topMargin: 74 + anchors.topMargin: 85 spacing: 6 ListModel { @@ -38,12 +40,15 @@ Item { id: headerColumn anchors.left: parent.left anchors.right: parent.right + anchors.leftMargin: 16 + anchors.rightMargin: 16 anchors.top: parent.top anchors.topMargin: 74 spacing: 24 Text { - width: headerColumn.width - dotsRow.width - 50 + anchors.left: parent.left + width: headerColumn.width - dotsRow.width - 16 font.family: "Arial" font.pixelSize: 28 wrapMode: Text.Wrap @@ -53,8 +58,11 @@ Item { } Text { + anchors.left: parent.left + anchors.right: parent.right font.family: "Arial" font.pixelSize: 18 + wrapMode: Text.Wrap //renderType: Text.NativeRendering color: "#4A4646" text: qsTr("This is the name of your wallet. You can change it to a different name if you’d like:") @@ -62,9 +70,10 @@ Item { } Item { + id: walletNameItem anchors.top: headerColumn.bottom anchors.horizontalCenter: parent.horizontalCenter - anchors.topMargin: 50 + anchors.topMargin: 24 width: 300 height: 62 @@ -88,4 +97,149 @@ Item { color: "#DBDBDB" } } + + Text { + id: frameHeader + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 16 + anchors.rightMargin: 16 + anchors.top: walletNameItem.bottom + anchors.topMargin: 24 + font.family: "Arial" + font.pixelSize: 18 + //renderType: Text.NativeRendering + color: "#4A4646" + elide: Text.ElideRight + text: qsTr("This is the 24 word mnemonic for your wallet") + } + + Rectangle { + id: wordsRect + anchors.left: parent.left + anchors.right: parent.right + anchors.top: frameHeader.bottom + anchors.topMargin: 16 + height: 182 + border.width: 1 + border.color: "#DBDBDB" + + TextEdit { + id: wordsText + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: tipRect.top + anchors.margins: 16 + font.family: "Arial" + font.pixelSize: 24 + wrapMode: Text.Wrap + selectByMouse: true + readOnly: true + color: "#3F3F3F" + text: "bound class paint gasp task soul forgot past pleasure physical circle appear shore bathroom glove women crap busy beauty bliss idea give needle burden" + } + + Image { + anchors.right: parent.right + anchors.bottom: tipRect.top + source: "qrc:///images/greyTriangle.png" + + Image { + anchors.centerIn: parent + source: "qrc:///images/copyToClipboard.png" + } + + Clipboard { id: clipboard } + MouseArea { + anchors.fill: parent + cursorShape: Qt.PointingHandCursor + onClicked: clipboard.setText(wordsText.text) + } + } + + Rectangle { + id: tipRect + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: 65 + color: "#DBDBDB" + + Text { + anchors.fill: parent + anchors.margins: 16 + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + font.family: "Arial" + font.pixelSize: 15 + color: "#4A4646" + wrapMode: Text.Wrap + text: qsTr("It is very important to write it down as this is the only backup you will need for your wallet. You will be asked to confirm the seed in the next screen to ensure it has copied down correctly.") + } + } + } + + Row { + anchors.left: parent.left + anchors.right: parent.right + anchors.top: wordsRect.bottom + anchors.topMargin: 24 + spacing: 16 + + Text { + anchors.verticalCenter: parent.verticalCenter + font.family: "Arial" + font.pixelSize: 18 + //renderType: Text.NativeRendering + color: "#4A4646" + text: qsTr("Your wallet is stored in") + } + + Item { + anchors.verticalCenter: parent.verticalCenter + width: parent.width - x + height: 34 + + FileDialog { + id: fileDialog + selectMultiple: false + title: "Please choose a file" + onAccepted: { + fileUrlInput.text = fileDialog.fileUrl + fileDialog.visible = false + } + onRejected: { + fileDialog.visible = false + } + } + + TextInput { + id: fileUrlInput + anchors.fill: parent + anchors.leftMargin: 5 + anchors.rightMargin: 5 + clip: true + font.family: "Arial" + font.pixelSize: 18 + color: "#6B0072" + verticalAlignment: Text.AlignVCenter + selectByMouse: true + text: "~/.monero/mywallet/" + onFocusChanged: { + if(focus) { + fileDialog.visible = true + } + } + } + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: 1 + color: "#DBDBDB" + } + } + } } diff --git a/wizard/WizardDonation.qml b/wizard/WizardDonation.qml new file mode 100644 index 00000000..ece5c41a --- /dev/null +++ b/wizard/WizardDonation.qml @@ -0,0 +1,125 @@ +import QtQuick 2.2 +import "../components" + +Item { + opacity: 0 + visible: false + Behavior on opacity { + NumberAnimation { duration: 100; easing.type: Easing.InQuad } + } + + onOpacityChanged: visible = opacity !== 0 + + Row { + id: dotsRow + anchors.top: parent.top + anchors.right: parent.right + anchors.topMargin: 85 + spacing: 6 + + ListModel { + id: dotsModel + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#FFE00A" } + } + + Repeater { + model: dotsModel + delegate: Rectangle { + width: 12; height: 12 + radius: 6 + color: dotColor + } + } + } + + Text { + id: headerText + anchors.left: parent.left + anchors.top: parent.top + anchors.topMargin: 74 + anchors.leftMargin: 16 + width: parent.width - dotsRow.width - 16 + + font.family: "Arial" + font.pixelSize: 28 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#3F3F3F" + text: qsTr("Monero development is solely supported by donations") + } + + Column { + anchors.top: headerText.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 16 + anchors.rightMargin: 16 + anchors.topMargin: 34 + spacing: 12 + + Row { + anchors.left: parent.left + anchors.right: parent.right + spacing: 2 + + CheckBox { + anchors.verticalCenter: parent.verticalCenter + text: qsTr("Enable auto-donations of?") + background: "#F0EEEE" + fontColor: "#4A4646" + fontSize: 18 + checkedIcon: "../images/checkedVioletIcon.png" + uncheckedIcon: "../images/uncheckedIcon.png" + checked: true + } + + Item { + anchors.verticalCenter: parent.verticalCenter + height: 30 + width: 41 + + TextInput { + anchors.fill: parent + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + font.family: "Arial" + font.pixelSize: 18 + color: "#6B0072" + text: "50" + validator: IntValidator { bottom: 0; top: 100 } + } + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: 1 + color: "#DBDBDB" + } + } + + Text { + anchors.verticalCenter: parent.verticalCenter + font.family: "Arial" + font.pixelSize: 18 + color: "#4A4646" + text: qsTr("% of my fee added to each transaction") + } + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 15 + color: "#4A4646" + wrapMode: Text.Wrap + text: qsTr("For every transaction, a small transaction fee is charged. This option lets you add an additional amount, " + + "as a percentage of that fee, to your transaction to support Monero development. For instance, a 50% " + + "autodonation take a transaction fee of 0.005 XMR and add a 0.0025 XMR to support Monero development.") + } + } +} diff --git a/wizard/WizardFinish.qml b/wizard/WizardFinish.qml new file mode 100644 index 00000000..ac9e921e --- /dev/null +++ b/wizard/WizardFinish.qml @@ -0,0 +1,69 @@ +import QtQuick 2.2 + +Item { + opacity: 0 + visible: false + Behavior on opacity { + NumberAnimation { duration: 100; easing.type: Easing.InQuad } + } + + onOpacityChanged: visible = opacity !== 0 + + Row { + id: dotsRow + anchors.top: parent.top + anchors.right: parent.right + anchors.topMargin: 85 + spacing: 6 + + ListModel { + id: dotsModel + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#36B05B" } + } + + Repeater { + model: dotsModel + delegate: Rectangle { + width: 12; height: 12 + radius: 6 + color: dotColor + } + } + } + + Column { + id: headerColumn + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 16 + anchors.rightMargin: 16 + anchors.top: parent.top + anchors.topMargin: 74 + spacing: 24 + + Text { + anchors.left: parent.left + width: headerColumn.width - dotsRow.width - 16 + font.family: "Arial" + font.pixelSize: 28 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#3F3F3F" + text: qsTr("You’re all setup!") + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 18 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#4A4646" + text: qsTr("An overview of your Monero configuration is below:") + } + } +} diff --git a/wizard/WizardMain.qml b/wizard/WizardMain.qml index 922147ca..3b44a23f 100644 --- a/wizard/WizardMain.qml +++ b/wizard/WizardMain.qml @@ -11,6 +11,7 @@ Rectangle { anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right anchors.rightMargin: 50 + visible: wizard.currentPage !== 1 && wizard.currentPage !== 6 width: 50; height: 50 radius: 25 @@ -36,6 +37,10 @@ Rectangle { pages[0] = welcomePage pages[1] = optionsPage pages[2] = createWalletPage + pages[3] = passwordPage + pages[4] = configurePage + pages[5] = donationPage + pages[6] = finishPage if(next === false) { if(currentPage > 0) { @@ -81,6 +86,46 @@ Rectangle { anchors.rightMargin: 50 } + WizardPassword { + id: passwordPage + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: nextButton.left + anchors.left: prevButton.right + anchors.leftMargin: 50 + anchors.rightMargin: 50 + } + + WizardConfigure { + id: configurePage + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: nextButton.left + anchors.left: prevButton.right + anchors.leftMargin: 50 + anchors.rightMargin: 50 + } + + WizardDonation { + id: donationPage + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: nextButton.left + anchors.left: prevButton.right + anchors.leftMargin: 50 + anchors.rightMargin: 50 + } + + WizardFinish { + id: finishPage + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: nextButton.left + anchors.left: prevButton.right + anchors.leftMargin: 50 + anchors.rightMargin: 50 + } + Rectangle { id: prevButton anchors.verticalCenter: parent.verticalCenter diff --git a/wizard/WizardOptions.qml b/wizard/WizardOptions.qml index ffca8d80..f6641437 100644 --- a/wizard/WizardOptions.qml +++ b/wizard/WizardOptions.qml @@ -17,28 +17,37 @@ Item { anchors.right: parent.right anchors.top: parent.top anchors.topMargin: 74 + anchors.leftMargin: 16 + anchors.rightMargin: 16 spacing: 24 Text { + anchors.left: parent.left + anchors.right: parent.right font.family: "Arial" font.pixelSize: 28 //renderType: Text.NativeRendering color: "#3F3F3F" + wrapMode: Text.Wrap text: qsTr("I want") } Text { + anchors.left: parent.left + anchors.right: parent.right font.family: "Arial" font.pixelSize: 18 //renderType: Text.NativeRendering color: "#4A4646" + wrapMode: Text.Wrap text: qsTr("Please select one of the following options:") } } Row { + anchors.verticalCenterOffset: 35 anchors.centerIn: parent - spacing: 50 + spacing: 40 Column { anchors.verticalCenter: parent.verticalCenter diff --git a/wizard/WizardPassword.qml b/wizard/WizardPassword.qml new file mode 100644 index 00000000..e42fa82e --- /dev/null +++ b/wizard/WizardPassword.qml @@ -0,0 +1,141 @@ +import QtQuick 2.2 +import "../components" + +Item { + opacity: 0 + visible: false + Behavior on opacity { + NumberAnimation { duration: 100; easing.type: Easing.InQuad } + } + + onOpacityChanged: visible = opacity !== 0 + + Row { + id: dotsRow + anchors.top: parent.top + anchors.right: parent.right + anchors.topMargin: 85 + spacing: 6 + + ListModel { + id: dotsModel + ListElement { dotColor: "#36B05B" } + ListElement { dotColor: "#FFE00A" } + ListElement { dotColor: "#DBDBDB" } + ListElement { dotColor: "#DBDBDB" } + } + + Repeater { + model: dotsModel + delegate: Rectangle { + width: 12; height: 12 + radius: 6 + color: dotColor + } + } + } + + Column { + id: headerColumn + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 16 + anchors.rightMargin: 16 + anchors.top: parent.top + anchors.topMargin: 74 + spacing: 24 + + Text { + anchors.left: parent.left + width: headerColumn.width - dotsRow.width - 16 + font.family: "Arial" + font.pixelSize: 28 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#3F3F3F" + text: qsTr("Now that your wallet has been created, please set a password for the wallet") + } + + Text { + anchors.left: parent.left + anchors.right: parent.right + font.family: "Arial" + font.pixelSize: 18 + wrapMode: Text.Wrap + //renderType: Text.NativeRendering + color: "#4A4646" + text: qsTr("Note that this password cannot be recovered, and if forgotten you will need to restore your wallet from the mnemonic seed you were just given

+ Your password will be used to protect your wallet and to confirm actions, so make sure that your password is sufficiently secure.") + } + } + + Item { + id: passwordItem + anchors.top: headerColumn.bottom + anchors.horizontalCenter: parent.horizontalCenter + anchors.topMargin: 24 + width: 300 + height: 62 + + TextInput { + anchors.fill: parent + horizontalAlignment: TextInput.AlignHCenter + verticalAlignment: TextInput.AlignVCenter + font.family: "Arial" + font.pixelSize: 32 + renderType: Text.NativeRendering + color: "#35B05A" + passwordCharacter: "•" + echoMode: TextInput.Password + focus: true + } + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: 1 + color: "#DBDBDB" + } + } + + PrivacyLevelSmall { + id: privacyLevel + anchors.left: parent.left + anchors.right: parent.right + anchors.top: passwordItem.bottom + anchors.topMargin: 24 + background: "#F0EEEE" + interactive: false + } + + Item { + id: retypePasswordItem + anchors.top: privacyLevel.bottom + anchors.horizontalCenter: parent.horizontalCenter + anchors.topMargin: 24 + width: 300 + height: 62 + + TextInput { + anchors.fill: parent + horizontalAlignment: TextInput.AlignHCenter + verticalAlignment: TextInput.AlignVCenter + font.family: "Arial" + font.pixelSize: 32 + renderType: Text.NativeRendering + color: "#35B05A" + passwordCharacter: "•" + echoMode: TextInput.Password + focus: true + } + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + height: 1 + color: "#DBDBDB" + } + } +} diff --git a/wizard/WizardWelcome.qml b/wizard/WizardWelcome.qml index 5ddbfe5c..2d5b5dfb 100644 --- a/wizard/WizardWelcome.qml +++ b/wizard/WizardWelcome.qml @@ -14,21 +14,29 @@ Item { anchors.right: parent.right anchors.top: parent.top anchors.topMargin: 74 + anchors.leftMargin: 16 + anchors.rightMargin: 16 spacing: 24 Text { + anchors.left: parent.left + anchors.right: parent.right font.family: "Arial" font.pixelSize: 28 //renderType: Text.NativeRendering color: "#3F3F3F" + wrapMode: Text.Wrap text: qsTr("Welcome") } Text { + anchors.left: parent.left + anchors.right: parent.right font.family: "Arial" font.pixelSize: 18 //renderType: Text.NativeRendering color: "#4A4646" + wrapMode: Text.Wrap text: qsTr("Please choose a language and regional format.") } } @@ -50,6 +58,8 @@ Item { anchors.bottom: parent.bottom anchors.top: headerColumn.bottom anchors.topMargin: 24 + anchors.leftMargin: 16 + anchors.rightMargin: 16 clip: true model: languagesModel