Added scroll bar for DropDownType

amnezia-vpn · May 1, 2023 · 68b2745 · 68b2745
1 parent c7acd63
commit 68b2745
Showing 1 changed file with 72 additions and 57 deletions.
diff --git a/client/ui/qml/Controls2/DropDownType.qml b/client/ui/qml/Controls2/DropDownType.qml
@@ -19,7 +19,6 @@ Item {
 
     property alias menuModel: menuContent.model
 
-    width: buttonContent.implicitWidth
     height: buttonContent.implicitHeight
 
     Rectangle {
@@ -136,89 +135,105 @@ Item {
             color: Qt.rgba(14/255, 14/255, 17/255, 0.8)
         }
 
-        Column {
+        Header2TextType {
+            id: header
+            width: parent.width
+
+            text: "Данные для подключения"
+            wrapMode: Text.WordWrap
+
             anchors.top: parent.top
             anchors.left: parent.left
             anchors.right: parent.right
             anchors.topMargin: 16
+            anchors.leftMargin: 16
+            anchors.rightMargin: 16
+        }
 
-            spacing: 16
+        FlickableType {
+            anchors.top: header.bottom
+            anchors.topMargin: 16
+            contentHeight: col.implicitHeight
 
-            Header2TextType {
-                width: parent.width
+            Column {
+                id: col
+                anchors.top: parent.top
+                anchors.left: parent.left
+                anchors.right: parent.right
 
-                text: "Данные для подключения"
-                wrapMode: Text.WordWrap
+                spacing: 16
 
-                leftPadding: 16
-                rightPadding: 16
-            }
+                ButtonGroup {
+                    id: radioButtonGroup
+                }
 
-            ButtonGroup {
-                id: radioButtonGroup
-            }
+                ListView {
+                    id: menuContent
+                    width: parent.width
+                    height: menuContent.contentItem.height
+
+                    currentIndex: -1
 
-            ListView {
-                id: menuContent
-                width: parent.width
-                height: menuContent.contentItem.height
+                    clip: true
+                    interactive: false
 
-                currentIndex: -1
+                    delegate: Item {
+                        implicitWidth: menuContent.width
+                        implicitHeight: radioButton.implicitHeight
 
-                clip: true
-                interactive: false
+                        RadioButton {
+                            id: radioButton
 
-                delegate: Item {
-                    implicitWidth: menuContent.width
-                    implicitHeight: radioButton.implicitHeight
+                            implicitWidth: parent.width
+                            implicitHeight: radioButtonContent.implicitHeight
 
-                    RadioButton {
-                        id: radioButton
+                            hoverEnabled: true
 
-                        implicitWidth: parent.width
-                        implicitHeight: radioButtonContent.implicitHeight
+                            ButtonGroup.group: radioButtonGroup
 
-                        hoverEnabled: true
+                            indicator: Rectangle {
+                                anchors.fill: parent
+                                color: radioButton.hovered ? "#2C2D30" : "#1C1D21"
+                            }
 
-                        ButtonGroup.group: radioButtonGroup
+                            RowLayout {
+                                id: radioButtonContent
+                                anchors.fill: parent
 
-                        indicator: Rectangle {
-                            anchors.fill: parent
-                            color: radioButton.hovered ? "#2C2D30" : "#1C1D21"
-                        }
+                                anchors.rightMargin: 16
+                                anchors.leftMargin: 16
 
-                        RowLayout {
-                            id: radioButtonContent
-                            anchors.fill: parent
+                                z: 1
 
-                            anchors.rightMargin: 16
-                            anchors.leftMargin: 16
+                                Text {
+                                    id: text
 
-                            z: 1
+                                    text: modelData
+                                    color: "#D7D8DB"
+                                    font.pixelSize: 16
+                                    font.weight: 400
+                                    font.family: "PT Root UI VF"
 
-                            Text {
-                                id: text
+                                    height: 24
 
-                                text: modelData
-                                color: "#D7D8DB"
-                                font.pixelSize: 16
-                                font.weight: 400
-                                font.family: "PT Root UI VF"
+                                    Layout.fillWidth: true
+                                    Layout.topMargin: 20
+                                    Layout.bottomMargin: 20
+                                }
 
-                                height: 24
+                                Image {
+                                    source: "qrc:/images/controls/check.svg"
+                                    visible: radioButton.checked
+                                    width: 24
+                                    height: 24
 
-                                Layout.fillWidth: true
-                                Layout.topMargin: 20
-                                Layout.bottomMargin: 20
+                                    Layout.rightMargin: 8
+                                }
                             }
 
-                            Image {
-                                source: "qrc:/images/controls/check.svg"
-                                visible: radioButton.checked
-                                width: 24
-                                height: 24
-
-                                Layout.rightMargin: 8
+                            onClicked: {
+                                root.text = modelData
+                                menu.visible = false
                             }
                         }
                     }