Merge pull request #1346

610682c Added component RadioButton; changed 'settings->daemon mode' checkboxes to use them
c409441 Radio buttons for the welcome wizard

components/RadioButton.qml

@@ -0,0 +1,101 @@
+// Copyright (c) 2014-2018, The Monero Project
+// 
+// All rights reserved.
+// 
+// Redistribution and use in source and binary forms, with or without modification, are
+// permitted provided that the following conditions are met:
+// 
+// 1. Redistributions of source code must retain the above copyright notice, this list of
+//    conditions and the following disclaimer.
+// 
+// 2. Redistributions in binary form must reproduce the above copyright notice, this list
+//    of conditions and the following disclaimer in the documentation and/or other
+//    materials provided with the distribution.
+// 
+// 3. Neither the name of the copyright holder nor the names of its contributors may be
+//    used to endorse or promote products derived from this software without specific
+//    prior written permission.
+// 
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+// EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+// MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL
+// THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+// PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT,
+// STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF
+// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+import QtQuick 2.0
+import QtQuick.Layouts 1.1
+
+import "../components" as MoneroComponents
+
+RowLayout {
+    id: radioButton
+    property alias text: label.text
+    property bool checked: false
+    property int fontSize: 14 * scaleRatio
+    property alias fontColor: label.color
+    signal clicked()
+    height: 26 * scaleRatio
+    // legacy properties
+    property var checkedColor: "white"
+    property var borderColor: checked ? Qt.rgba(1, 1, 1, 0.35) : Qt.rgba(1, 1, 1, 0.25)
+
+    function toggle(){
+        radioButton.checked = !radioButton.checked
+        radioButton.clicked()
+    }
+
+    RowLayout {
+        Layout.fillWidth: true
+        Rectangle {
+            id: button
+            anchors.left: parent.left
+            y: 0
+            color: "transparent"
+            border.color: borderColor
+            width: radioButton.height
+            height: radioButton.height
+            radius: radioButton.height
+
+            Rectangle {
+                visible: radioButton.checked
+                anchors.horizontalCenter: parent.horizontalCenter
+                anchors.verticalCenter: parent.verticalCenter
+                color: checkedColor
+                width: 10 * scaleRatio
+                height: 10 * scaleRatio
+                radius: 10
+                opacity: 0.8
+            }
+
+            MouseArea {
+                anchors.fill: parent
+                cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    toggle()
+                }
+            }
+        }
+
+        Text {
+            id: label
+            anchors.left: button.right
+            anchors.leftMargin: !isMobile ? 10 : 8
+            color: MoneroComponents.Style.defaultFontColor
+            font.family: MoneroComponents.Style.fontRegular.name
+            font.pixelSize: radioButton.fontSize
+            wrapMode: Text.Wrap
+
+            MouseArea {
+                anchors.fill: parent
+                cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    toggle()
+                }
+            }
+        }
+    }
+}

pages/Settings.qml

@@ -209,7 +209,7 @@ Rectangle {
         }
 
         ColumnLayout {
-            CheckBox {
+            RadioButton {
                 id: remoteDisconnect
                 checked: !persistentSettings.useRemoteNode
                 text: qsTr("Local Node") + translationManager.emptyString
@@ -220,7 +220,7 @@ Rectangle {
                 }
             }
 
-            CheckBox {
+            RadioButton {
                 id: remoteConnect
                 checked: persistentSettings.useRemoteNode
                 text: qsTr("Remote Node") + translationManager.emptyString

qml.qrc

@@ -207,5 +207,6 @@
         <file>images/rightArrowInactive.png</file>
         <file>js/Windows.js</file>
         <file>js/Utils.js</file>
+        <file>components/RadioButton.qml</file>
     </qresource>
 </RCC>

wizard/WizardOptions.qml

@@ -227,9 +227,6 @@ ColumnLayout {
                 wrapMode: Text.WordWrap
             }
         }
-
-
-
     }
 
     ColumnLayout {
@@ -238,18 +235,17 @@ ColumnLayout {
         Layout.topMargin: 30 * scaleRatio
         Layout.alignment: Qt.AlignCenter
         Layout.fillWidth: true
-        spacing: 50 * scaleRatio
+        spacing: 38 * scaleRatio
 
         Rectangle {
             width: 100 * scaleRatio
-            CheckBox {
+            RadioButton {
                 id: testNet
                 text: qsTr("Testnet") + translationManager.emptyString
-                background: "#FFFFFF"
+                checkedColor: Qt.rgba(0, 0, 0, 0.75)
+                borderColor: Qt.rgba(0, 0, 0, 0.45)
                 fontColor: "#4A4646"
                 fontSize: 16 * scaleRatio
-                checkedIcon: "../images/checkedBlackIcon.png"
-                uncheckedIcon: "../images/uncheckedIcon.png"
                 checked: appWindow.persistentSettings.nettype == NetworkType.TESTNET;
                 onClicked: {
                     persistentSettings.nettype = testNet.checked ? NetworkType.TESTNET : NetworkType.MAINNET
@@ -261,14 +257,13 @@ ColumnLayout {
 
         Rectangle {
             width: 100 * scaleRatio
-            CheckBox {
+            RadioButton {
                 id: stageNet
                 text: qsTr("Stagenet") + translationManager.emptyString
-                background: "#FFFFFF"
+                checkedColor: Qt.rgba(0, 0, 0, 0.75)
+                borderColor: Qt.rgba(0, 0, 0, 0.45)
                 fontColor: "#4A4646"
                 fontSize: 16 * scaleRatio
-                checkedIcon: "../images/checkedBlackIcon.png"
-                uncheckedIcon: "../images/uncheckedIcon.png"
                 checked: appWindow.persistentSettings.nettype == NetworkType.STAGENET;
                 onClicked: {
                     persistentSettings.nettype = stageNet.checked ? NetworkType.STAGENET : NetworkType.MAINNET