[ui] Rework of MessageDialog for CompatibilityManager and SensorDBDialog

Author: Just-Kiel

meshroom/ui/qml/Controls/MessageDialog.qml

@@ -12,6 +12,8 @@ Dialog {
     property alias icon: iconLabel
     property alias canCopy: copyButton.visible
     property alias preset: presets.state
+    property alias content: contentComponent.sourceComponent
+    property alias textMetrics: textMetrics
 
     default property alias children: layout.children
 
@@ -47,7 +49,6 @@ Dialog {
         }
 
         RowLayout {
-            width: parent.width
             // Icon
             Label {
                 id: iconLabel
@@ -58,7 +59,6 @@ Dialog {
 
             Label {
                 id: titleLabel
-                Layout.fillWidth: true
                 text: title + " - " + Qt.application.name + " " + Qt.application.version
                 font.bold: true
             }
@@ -75,7 +75,7 @@ Dialog {
         }
     }
 
-    ColumnLayout {
+    contentItem: ColumnLayout {
         id: layout
         // Text
         spacing: 12
@@ -84,20 +84,41 @@ Dialog {
             font.bold: true
             visible: text != ""
             onLinkActivated: function(link) { Qt.openUrlExternally(link) }
+
+            Layout.preferredWidth: titleLabel.width
+            wrapMode: Text.WordWrap
         }
         // Detailed text
         Label {
             id: detailedLabel
             text: text
             visible: text != ""
             onLinkActivated: function(link) { Qt.openUrlExternally(link) }
+
+            Layout.preferredWidth: titleLabel.width
+            wrapMode: Text.WordWrap
         }
         // Additional helper text
         Label {
             id: helperLabel
             visible: text != ""
             onLinkActivated: function(link) { Qt.openUrlExternally(link) }
+
+            Layout.preferredWidth: titleLabel.width
+            wrapMode: Text.WordWrap
         }
+
+        Loader {
+            id: contentComponent
+
+            Layout.fillWidth: true
+        }
+    }
+
+    TextMetrics {
+        id: textMetrics
+
+        text: "A"
     }
 
     StateGroup {

meshroom/ui/qml/GraphEditor/CompatibilityManager.qml

@@ -55,7 +55,7 @@ MessageDialog {
                 + "This operation is undoable and can also be done manually in the Graph Editor."
                 : ""
 
-    ColumnLayout {
+    content: ColumnLayout {
         spacing: 16
 
         ListView {
@@ -66,6 +66,20 @@ MessageDialog {
             clip: true
             model: nodesModel
 
+            property int longestLabel: {
+                var longest = 0
+                for (var i = 0; i < issueCount; ++i) {
+                    var n = nodesModel.at(i)
+                    if (n.defaultLabel.length > longest)
+                        longest = n.defaultLabel.length
+                }
+                return longest
+            }
+
+            property int upgradableLabelWidth: {
+                return "Upgradable".length * root.textMetrics.width
+            }
+
             ScrollBar.vertical: MScrollBar { id: scrollbar }
 
             spacing: 4
@@ -77,9 +91,9 @@ MessageDialog {
                 background: Rectangle { color: Qt.darker(parent.palette.window, 1.15) }
                 RowLayout {
                     width: parent.width
-                    Label { text: "Node"; Layout.preferredWidth: 150; font.bold: true }
+                    Label { text: "Node"; Layout.preferredWidth: listView.longestLabel * root.textMetrics.width; font.bold: true }
                     Label { text: "Issue"; Layout.fillWidth: true; font.bold: true }
-                    Label { text: "Upgradable"; font.bold: true }
+                    Label { text: "Upgradable"; Layout.preferredWidth: listView.upgradableLabelWidth; font.bold: true }
                 }
             }
 
@@ -92,14 +106,16 @@ MessageDialog {
                 anchors.horizontalCenter: parent != null ? parent.horizontalCenter : undefined
 
                 Label {
-                    Layout.preferredWidth: 150
+                    Layout.preferredWidth: listView.longestLabel * root.textMetrics.width
                     text: compatibilityNodeDelegate.node ? compatibilityNodeDelegate.node.defaultLabel : ""
                 }
                 Label {
                     Layout.fillWidth: true
                     text: compatibilityNodeDelegate.node ? compatibilityNodeDelegate.node.issueDetails : ""
                 }
                 Label {
+                    Layout.preferredWidth: listView.upgradableLabelWidth
+                    horizontalAlignment: Text.AlignHCenter
                     text: compatibilityNodeDelegate.node && compatibilityNodeDelegate.node.canUpgrade ? MaterialIcons.check : MaterialIcons.clear
                     color: compatibilityNodeDelegate.node && compatibilityNodeDelegate.node.canUpgrade ? "#4CAF50" : "#F44336"
                     font.family: MaterialIcons.fontFamily

meshroom/ui/qml/ImageGallery/SensorDBDialog.qml

@@ -17,21 +17,19 @@ MessageDialog {
     icon.text: MaterialIcons.camera
     icon.font.pointSize: 10
 
-    modal: true
     parent: Overlay.overlay
     canCopy: false
 
     title: "Sensor Database"
     text: "Add missing Camera Models to the Sensor Database to improve your results."
-    detailedText: "If a warning is displayed on your images, adding your Camera Model to the Sensor Database\n"+
-                  "can help fix it and improve your reconstruction results."
+    detailedText: "If a warning is displayed on your images, adding your Camera Model to the Sensor Database can help fix it and improve your reconstruction results."
     helperText: 'To update the Sensor Database (<a href="https://github.com/alicevision/meshroom/wiki/Add-Camera-to-database">complete guide</a>):<br>' +
                 ' - Look for the "sensor width" in millimeters of your Camera Model<br>' +
                 ' - Add a new line in the Database following this pattern: Make;Model;SensorWidthInMM<br>' +
-                ' - Click on "' + rebuildIntrinsics.text + '" once the Database has been saved<br>' +
+                ' - Click on "Update Intrinsics" once the Database has been saved<br>' +
                 ' - Contribute to the <a href="https://github.com/alicevision/AliceVision/blob/develop/src/aliceVision/sensorDB/cameraSensors.db">online Database</a>'
 
-    ColumnLayout {
+    content: ColumnLayout {
         RowLayout {
             Layout.fillWidth: true
             spacing: 2
@@ -63,13 +61,14 @@ MessageDialog {
                 onClicked: Qt.openUrlExternally(sensorDatabase)
             }
         }
-    }
-    Button {
-        id: rebuildIntrinsics
-        text: "Update Intrinsics"
-        enabled: !readOnly
-        onClicked: updateIntrinsicsRequest()
-        Layout.alignment: Qt.AlignCenter
+
+        Button {
+            id: rebuildIntrinsics
+            text: "Update Intrinsics"
+            enabled: !readOnly
+            onClicked: updateIntrinsicsRequest()
+            Layout.alignment: Qt.AlignCenter
+        }
     }
     standardButtons: Dialog.Close
     onAccepted: close()