feat(Popup/DropDownMenu): better attributes to deal with relative items

tests/ui/modules/Common/Paned.qml

@@ -27,9 +27,9 @@ Item {
   property alias childA: contentA.data
   property alias childB: contentB.data
   property bool defaultClosed: false
+  property bool resizeAInPriority: false
   property int closingEdge: Qt.LeftEdge // `LeftEdge` or `RightEdge`.
   property int defaultChildAWidth
-  property bool resizeAInPriority: false
 
   // User limits: string or int values.
   // By default: no limits.
@@ -251,7 +251,6 @@ Item {
     onDoubleClicked: _inverseClosingState()
     onMouseXChanged: pressed &&
       _applyLimitsOnUserMove(mouseX - _mouseStart)
-
     onPressed: _mouseStart = mouseX
 
     Rectangle {

tests/ui/modules/Common/Popup/DropDownMenu.qml

@@ -9,11 +9,19 @@ import Utils 1.0
 // ===================================================================
 
 Rectangle {
-  property bool drawOnRoot: false
-  property int entryHeight // Only with a ListView child.
-  property int maxMenuHeight // Only with a ListView child.
+  // Attributes used only with a ListView child.
+  property int entryHeight
+  property int maxMenuHeight
+
+  // Optionnal parameter, if defined and if a click is detected
+  // on it, menu is not closed.
   property var launcher
+
+  // Optionnal parameters, set the position of Menu relative
+  // to this item.
   property var relativeTo
+  property int relativeX: 0
+  property int relativeY: 0
 
   default property alias _content: content.data
 
@@ -25,9 +33,9 @@ Rectangle {
       return
     }
 
-    if (drawOnRoot) {
-      this.x = relativeTo.mapToItem(null, relativeTo.width, 0).x
-      this.y = relativeTo.mapToItem(null, relativeTo.width, 0).y
+    if (relativeTo != null) {
+      this.x = relativeTo.mapToItem(null, relativeX, relativeY).x
+      this.y = relativeTo.mapToItem(null, relativeX, relativeY).y
     }
 
     visible = true
@@ -49,6 +57,11 @@ Rectangle {
       return content.height
     }
 
+    console.assert(
+      entryHeight != null,
+      '`entryHeight` must be defined when used with `ListView`.'
+    )
+
     var height = model.count * entryHeight
     return (maxMenuHeight !== undefined && height > maxMenuHeight)
       ? maxMenuHeight
@@ -61,12 +74,14 @@ Rectangle {
 
   Keys.onEscapePressed: hideMenu()
 
+  // Set parent menu to root.
   Component.onCompleted: {
-    if (drawOnRoot) {
+    if (relativeTo != null) {
       parent = Utils.getTopParent(this)
     }
   }
 
+  // Menu content.
   Rectangle {
     id: content
 
@@ -79,6 +94,7 @@ Rectangle {
     }
   }
 
+  // Inverted mouse area to detect click outside menu.
   InvertedMouseArea {
     anchors.fill: parent
     enabled: parent.visible

tests/ui/modules/Common/SearchBox.qml

@@ -21,8 +21,8 @@ Item {
 
   property alias placeholderText: searchField.placeholderText
 
-  signal menuClosed ()
-  signal menuOpened ()
+  signal menuClosed
+  signal menuOpened
 
   function _hideMenu () {
     menu.hideMenu()

tests/ui/modules/Linphone/Call/CallControls.qml

@@ -50,13 +50,14 @@ RowLayout {
   }
 
   DropDownMenu {
-    drawOnRoot: true
     id: menu
+
     entryHeight: 22
     height: 100
-    width: 120
     launcher: button
     relativeTo: button
+    relativeX: button.width
+    width: 120
 
     Rectangle {
       color: 'red'