[ui] Node: elide attribute names + extend at mouse hover

meshroom/ui/qml/GraphEditor/AttributePin.qml

@@ -1,10 +1,11 @@
 import QtQuick 2.9
 import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
 
 /**
   The representation of an Attribute on a Node.
 */
-Row {
+RowLayout {
     id: root
 
     property var nodeItem
@@ -109,7 +110,33 @@ Row {
     Label {
         id: nameLabel
         text: attribute.name
+        elide: Text.ElideMiddle
+        Layout.fillWidth: true
         font.pointSize: 5
+        horizontalAlignment: attribute.isOutput ? Text.AlignRight : Text.AlignLeft
+
+        // Extend truncated names at mouse hover
+        MouseArea {
+            id: ma
+            anchors.fill: parent
+            enabled: parent.truncated
+            visible: enabled
+            hoverEnabled: true
+            acceptedButtons: Qt.NoButton
+        }
+        Loader {
+            active: ma.containsMouse
+            anchors.right: root.layoutDirection == Qt.LeftToRight ? undefined : nameLabel.right
+            // Non-elided label
+            sourceComponent: Label {
+                leftPadding: root.layoutDirection == Qt.LeftToRight ? 0 : 1
+                rightPadding: root.layoutDirection == Qt.LeftToRight ? 1 : 0
+                text: attribute.name
+                background: Rectangle {
+                    color: palette.window
+                }
+            }
+        }
     }
 
     state: connectMA.pressed ? "Dragging" : ""

meshroom/ui/qml/GraphEditor/Node.qml

@@ -98,19 +98,20 @@ Item {
 
         Item { width: 1; height: 2}
 
-        RowLayout  {
+        Item {
             width: parent.width + 6
+            height: childrenRect.height
             anchors.horizontalCenter: parent.horizontalCenter
 
             Column {
                 id: inputs
-                Layout.fillWidth: true
+                width: parent.width / 2
-                Layout.fillHeight: true
                 Repeater {
                     model: node.attributes
                     delegate: Loader {
                         active: !object.isOutput && object.type == "File"
                                 || (object.type == "ListAttribute" && object.desc.elementDesc.type == "File") // TODO: review this
+                        width: inputs.width
 
                         sourceComponent: AttributePin {
                             id: inPin
@@ -125,8 +126,7 @@ Item {
             }
             Column {
                 id: outputs
-                Layout.fillWidth: true
+                width: parent.width / 2
-                Layout.fillHeight: true
                 anchors.right: parent.right
                 Repeater {
                     model: node.attributes
@@ -134,6 +134,7 @@ Item {
                     delegate: Loader {
                         active: object.isOutput
                         anchors.right: parent.right
+                        width: outputs.width
 
                         sourceComponent: AttributePin {
                             id: outPin