flickable for wizardController

wizard/WizardController.qml

@@ -26,13 +26,15 @@
 // 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 QtQml 2.0
 import QtQuick 2.7
+import QtQuick.Controls 2.0
 import QtQuick.Controls 1.4
-import QtQuick.Controls.Styles 1.4
+import QtQuick.Layouts 1.1
-import QtQuick.Layouts 1.2
 import QtQuick.Dialogs 1.2
-
+import QtGraphicalEffects 1.0
 import moneroComponents.Wallet 1.0
+
 import "../js/Wizard.js" as Wizard
 import "../js/Windows.js" as Windows
 import "../js/Utils.js" as Utils
@@ -104,6 +106,9 @@ Rectangle {
     // recovery made (restore wallet)
     property string walletRestoreMode: 'seed'  // seed, keys, qr
 
+    // flickable margin
+    property int flickableHeightMargin
+
     property int layoutScale: {
         if(isMobile){
             return 0;
@@ -182,56 +187,89 @@ Rectangle {
             State {
                 name: "wizardLanguage"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardLanguageView }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardLanguageView.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardHome"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardHomeView }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardHomeView.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardCreateWallet1"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardCreateWallet1View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardCreateWallet1View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardCreateWallet2"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardCreateWallet2View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardCreateWallet2View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardCreateWallet3"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardCreateWallet3View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardCreateWallet3View.height + wizardController.flickableHeightMargin + 400 }
             }, State {
                 name: "wizardCreateWallet4"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardCreateWallet4View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardCreateWallet4View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardRestoreWallet1"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardRestoreWallet1View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardRestoreWallet1View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardRestoreWallet2"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardRestoreWallet2View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardRestoreWallet2View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardRestoreWallet3"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardRestoreWallet3View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardRestoreWallet3View.childrenRect.height + wizardController.flickableHeightMargin + 400 }
             }, State {
                 name: "wizardRestoreWallet4"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardRestoreWallet4View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardRestoreWallet4View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardCreateDevice1"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardCreateDevice1View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardCreateDevice1View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardOpenWallet1"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardOpenWallet1View }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardOpenWallet1View.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardModeSelection"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardModeSelectionView }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardModeSelectionView.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardModeRemoteNodeWarning"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardModeRemoteNodeWarningView }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardModeRemoteNodeWarningView.childrenRect.height + wizardController.flickableHeightMargin }
             }, State {
                 name: "wizardModeBootstrap"
                 PropertyChanges { target: wizardStateView; currentView: wizardStateView.wizardModeBootstrapView }
+                PropertyChanges { target: wizardFlickable; contentHeight: wizardStateView.wizardModeBootstrapView.childrenRect.height + wizardController.flickableHeightMargin }
             }
         ]
 
+        Flickable {
+            id: wizardFlickable
+            anchors.fill: parent
+            clip: true
+
+            ScrollBar.vertical: ScrollBar {
+                parent: wizardFlickable.parent
+                anchors.left: parent.right
+                anchors.leftMargin: 3
+                anchors.top: parent.top
+                anchors.topMargin: 4
+                anchors.bottom: parent.bottom
+            }
+
+            onFlickingChanged: {
+                releaseFocus();
+            }
+
             StackView {
                 id: stackView
                 initialItem: wizardStateView.wizardLanguageView
                 anchors.fill: parent
-            clip: false
+                clip: true
 
                 delegate: StackViewDelegate {
                     pushTransition: StackViewTransition {
@@ -255,6 +293,7 @@ Rectangle {
                 }
             }
         }
+	}
 
     //Open Wallet from file
     FileDialog {

wizard/WizardDaemonSettings.qml

@@ -48,6 +48,7 @@ ColumnLayout {
 
     MoneroComponents.RadioButton {
         id: localNode
+        Layout.fillWidth: true
         text: qsTr("Start a node automatically in background (recommended)") + translationManager.emptyString
         fontSize: 16 * scaleRatio
         checked: !appWindow.persistentSettings.useRemoteNode && !isAndroid && !isIOS
@@ -59,8 +60,8 @@ ColumnLayout {
     }
 
     ColumnLayout {
-        visible: localNode.checked
         id: blockchainFolderRow
+        visible: localNode.checked
         spacing: 20 * scaleRatio
 
         Layout.topMargin: 8 * scaleRatio
@@ -148,7 +149,6 @@ ColumnLayout {
         ColumnLayout {
             spacing: 8
             Layout.fillWidth: true
-            Layout.bottomMargin: 12 * scaleRatio
 
             MoneroComponents.RemoteNodeEdit {
                 id: bootstrapNodeEdit
@@ -176,10 +176,10 @@ ColumnLayout {
         }
     }
 
-
-    RowLayout {
     MoneroComponents.RadioButton {
         id: remoteNode
+        Layout.fillWidth: true
+        Layout.topMargin: 8 * scaleRatio
         text: qsTr("Connect to a remote node") + translationManager.emptyString
         fontSize: 16 * scaleRatio
         checked: appWindow.persistentSettings.useRemoteNode
@@ -188,13 +188,18 @@ ColumnLayout {
             localNode.checked = false
         }
     }
-    }
 
-    RowLayout {
+    ColumnLayout {
+        visible: remoteNode.checked
+        spacing: 0 * scaleRatio
+
+        Layout.topMargin: 8 * scaleRatio
+        Layout.fillWidth: true
+
         MoneroComponents.RemoteNodeEdit {
-            Layout.minimumWidth: 300 * scaleRatio
-            opacity: remoteNode.checked
             id: remoteNodeEdit
+            Layout.fillWidth: true
+
             property var rna: persistentSettings.remoteNodeAddress
             daemonAddrText: rna.search(":") != -1 ? rna.split(":")[0].trim() : ""
             daemonPortText: rna.search(":") != -1 ? (rna.split(":")[1].trim() == "") ? appWindow.getDefaultDaemonRpcPort(persistentSettings.nettype) : persistentSettings.remoteNodeAddress.split(":")[1] : ""