qml: add HelpDialog and HelpButton for showing additional info

2024-02-23 10:28:11 +01:00
parent 5e472117df
commit b0227c7e03
3 changed files with 88 additions and 0 deletions
@@ -0,0 +1,60 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import QtQuick.Controls.Material
+
+ElDialog {
+    id: dialog
+
+    header: Item { }
+
+    property string text
+    property string heading
+
+    z: 1 // raise z so it also covers dialogs using overlay as parent
+
+    anchors.centerIn: parent
+
+    padding: 0
+
+    width: rootPane.width
+
+    Overlay.modal: Rectangle {
+        color: "#55000000"
+    }
+
+    Pane {
+        id: rootPane
+        width: rootLayout.width + leftPadding + rightPadding
+        padding: constants.paddingLarge
+
+        ColumnLayout {
+            id: rootLayout
+            width: dialog.parent.width * 2/3
+
+            RowLayout {
+                Image {
+                    source: Qt.resolvedUrl('../../../icons/info.png')
+                    Layout.preferredWidth: constants.iconSizeSmall
+                    Layout.preferredHeight: constants.iconSizeSmall
+                }
+                Label {
+                    text: dialog.heading
+                    font.underline: true
+                    font.italic: true
+                }
+            }
+            TextArea {
+                id: message
+                Layout.fillWidth: true
+                readOnly: true
+                text: dialog.text
+                wrapMode: TextInput.WordWrap
+                textFormat: TextEdit.RichText
+                background: Rectangle {
+                    color: 'transparent'
+                }
+            }
+        }
+    }
+}