feat(Menu): add `ActionMenu`

tests/languages/en.ts

@@ -5,11 +5,23 @@
     <name>CallControls</name>
     <message>
         <source>homeEntry</source>
-        <translation type="unfinished">Home</translation>
+        <translation type="obsolete">Home</translation>
     </message>
     <message>
         <source>contactsEntry</source>
-        <translation type="unfinished">Contacts</translation>
+        <translation type="obsolete">Contacts</translation>
+    </message>
+    <message>
+        <source>acceptAudioCall</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <source>acceptVideoCall</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <source>hangup</source>
+        <translation type="unfinished">End call</translation>
     </message>
 </context>
 <context>

tests/languages/fr.ts

@@ -5,11 +5,23 @@
     <name>CallControls</name>
     <message>
         <source>homeEntry</source>
-        <translation type="unfinished">Accueil</translation>
+        <translation type="obsolete">Accueil</translation>
     </message>
     <message>
         <source>contactsEntry</source>
-        <translation type="unfinished">Contacts</translation>
+        <translation type="obsolete">Contacts</translation>
+    </message>
+    <message>
+        <source>acceptAudioCall</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <source>acceptVideoCall</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <source>hangup</source>
+        <translation type="unfinished">Fin d&apos;appel</translation>
     </message>
 </context>
 <context>

tests/resources.qrc

@@ -49,7 +49,8 @@
     <file>ui/modules/Common/Image/Icon.qml</file>
     <file>ui/modules/Common/Image/RoundedImage.qml</file>
     <file>ui/modules/Common/InvertedMouseArea.qml</file>
-    <file>ui/modules/Common/Menu.qml</file>
+    <file>ui/modules/Common/Menu/ActionMenu.qml</file>
+    <file>ui/modules/Common/Menu/Menu.qml</file>
     <file>ui/modules/Common/Paned.qml</file>
     <file>ui/modules/Common/Popup/AbstractDropDownMenu.qml</file>
     <file>ui/modules/Common/Popup/DropDownDynamicMenu.qml</file>
@@ -71,7 +72,8 @@
     <file>ui/modules/Common/Styles/Form/TextButtonAStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/TextButtonBStyle.qml</file>
     <file>ui/modules/Common/Styles/Form/TransparentComboBoxStyle.qml</file>
-    <file>ui/modules/Common/Styles/MenuStyle.qml</file>
+    <file>ui/modules/Common/Styles/Menu/ActionMenuStyle.qml</file>
+    <file>ui/modules/Common/Styles/Menu/MenuStyle.qml</file>
     <file>ui/modules/Common/Styles/PanedStyle.qml</file>
     <file>ui/modules/Common/Styles/PopupStyle.qml</file>
     <file>ui/modules/Common/Styles/qmldir</file>

tests/ui/modules/Common/Animations/CaterpillarAnimation.qml

@@ -9,9 +9,9 @@ Row {
 
   property color sphereColor: CaterpillarAnimationStyle.sphere.color
   property int animationDuration: CaterpillarAnimationStyle.animation.duration
-  property int animationSpace: CaterpillarAnimationStyle.animation.space
   property int nSpheres: CaterpillarAnimationStyle.nSpheres
   property int sphereSize: CaterpillarAnimationStyle.sphere.size
+  property int animationSpace: CaterpillarAnimationStyle.animation.space
 
   spacing: CaterpillarAnimationStyle.spacing
 

tests/ui/modules/Common/Menu/ActionMenu.qml

+import QtQuick 2.7
+import QtQuick.Layouts 1.3
+
+import Common.Styles 1.0
+
+// ===================================================================
+// Basic actions menu.
+// ===================================================================
+
+ColumnLayout {
+  id: menu
+
+  signal clicked (int entry)
+
+  spacing: ActionMenuStyle.spacing
+
+  property int entryHeight
+  property int entryWidth
+  property var entries
+
+  Repeater {
+    model: entries
+
+    Rectangle {
+      color: ActionMenuStyle.entry.color
+      height: menu.entryHeight
+      width: menu.entryWidth
+
+      Text {
+        anchors {
+          left: parent.left
+          leftMargin: ActionMenuStyle.entry.leftMargin
+          right: parent.right
+          rightMargin: ActionMenuStyle.entry.rightMargin
+        }
+
+        color: ActionMenuStyle.entry.text.color
+        font.pointSize: ActionMenuStyle.entry.text.fontSize
+        height: parent.height
+        text: modelData
+        verticalAlignment: Text.AlignVCenter
+      }
+
+      MouseArea {
+        anchors.fill: parent
+        hoverEnabled: true
+
+        onClicked: menu.clicked(index)
+      }
+    }
+  }
+}

tests/ui/modules/Common/Menu.qml → tests/ui/modules/Common/Menu/Menu.qml

 import QtQuick 2.7
 import QtQuick.Layouts 1.3
 
+import Common 1.0
 import Common.Styles 1.0
 
 // ===================================================================
@@ -14,8 +15,6 @@ ColumnLayout {
   property int entryWidth
   property var entries
 
-  property int fontSize: MenuStyle.entry.text.fontSize
-
   property int _selectedEntry: 0
 
   signal entrySelected (int entry)
@@ -50,23 +49,15 @@ ColumnLayout {
         spacing: MenuStyle.entry.spacing
 
         Icon {
-          Layout.preferredHeight: modelData.icon
-            ? (modelData.iconSize != null
-               ? modelData.iconSize
-               : MenuStyle.entry.iconSize
-              ) : 0
-          Layout.preferredWidth: modelData.icon
-            ? (modelData.iconSize != null
-               ? modelData.iconSize
-               : MenuStyle.entry.iconSize
-              ) : 0
-          icon: modelData.icon || ''
+          Layout.preferredHeight: MenuStyle.entry.iconSize
+          Layout.preferredWidth: MenuStyle.entry.iconSize
+          icon: modelData.icon
         }
 
         Text {
           Layout.fillWidth: true
           color: MenuStyle.entry.text.color
-          font.pointSize: menu.fontSize
+          font.pointSize: MenuStyle.entry.text.fontSize
           height: parent.height
           text: modelData.entryName
           verticalAlignment: Text.AlignVCenter

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

 AbstractDropDownMenu {
   function _computeHeight () {
-    return content.height
+    return _content[0].height
   }
 }

tests/ui/modules/Common/Styles/Menu/ActionMenuStyle.qml

+pragma Singleton
+import QtQuick 2.7
+
+import Common 1.0
+
+// ===================================================================
+
+QtObject {
+  property int spacing: 1
+
+  property QtObject entry: QtObject {
+    property int leftMargin: 4
+    property int rightMargin: 4
+
+    property color color: Colors.i
+
+    property QtObject text: QtObject {
+      property color color: Colors.k
+
+      property int fontSize: 8
+    }
+  }
+}

tests/ui/modules/Common/Styles/qmldir

@@ -6,14 +6,12 @@ module Common.Styles
 singleton CaterpillarAnimationStyle 1.0 Animations/CaterpillarAnimationStyle.qml
 
 singleton CollapseStyle             1.0 CollapseStyle.qml
+
 singleton DialogStyle               1.0 DialogStyle.qml
+
 singleton DroppableTextAreaStyle    1.0 DroppableTextAreaStyle.qml
 
 singleton ForceScrollBarStyle       1.0 ForceScrollBarStyle.qml
-singleton MenuStyle                 1.0 MenuStyle.qml
-singleton PanedStyle                1.0 PanedStyle.qml
-singleton PopupStyle                1.0 PopupStyle.qml
-singleton SearchBoxStyle            1.0 SearchBoxStyle.qml
 
 singleton AbstractTextButtonStyle   1.0 Form/AbstractTextButtonStyle.qml
 singleton ActionBarStyle            1.0 Form/ActionBarStyle.qml
@@ -24,3 +22,12 @@ singleton SmallButtonStyle          1.0 Form/SmallButtonStyle.qml
 singleton TextButtonAStyle          1.0 Form/TextButtonAStyle.qml
 singleton TextButtonBStyle          1.0 Form/TextButtonBStyle.qml
 singleton TransparentComboBoxStyle  1.0 Form/TransparentComboBoxStyle.qml
+
+singleton ActionMenuStyle           1.0 Menu/ActionMenuStyle.qml
+singleton MenuStyle                 1.0 Menu/MenuStyle.qml
+
+singleton PanedStyle                1.0 PanedStyle.qml
+
+singleton PopupStyle                1.0 PopupStyle.qml
+
+singleton SearchBoxStyle            1.0 SearchBoxStyle.qml

tests/ui/modules/Common/qmldir

@@ -49,7 +49,8 @@ RoundedImage         1.0 Image/RoundedImage.qml
 InvertedMouseArea    1.0 InvertedMouseArea.qml
 
 # Menu
-Menu                 1.0 Menu.qml
+ActionMenu           1.0 Menu/ActionMenu.qml
+Menu                 1.0 Menu/Menu.qml
 
 # Paned
 Paned                1.0 Paned.qml

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

@@ -52,32 +52,23 @@ RowLayout {
   DropDownMenu {
     id: menu
 
-    implicitHeight: toto.height
     launcher: button
     relativeTo: button
     relativeX: button.width + 1
-    width: 120
+    implicitWidth: actionMenu.width
 
-    Menu {
-      id: toto
-      entryHeight: 22
-      entryWidth: 98
-      fontSize: 11
-      entries: [{
-        entryName: qsTr('homeEntry')
-      }, {
-        entryName: qsTr('contactsEntry')
-      }]
+    ActionMenu {
+      id: actionMenu
 
-      onEntrySelected: {
-        console.log('entry', entry)
+      entryHeight: 22
+      entryWidth: 120
+      entries: [
+        qsTr('acceptAudioCall'),
+        qsTr('acceptVideoCall'),
+        qsTr('hangup')
+      ]
 
-        if (entry === 0) {
-          setView('Home')
-        } else if (entry === 1) {
-          setView('Contacts')
-        }
-      }
+      onClicked: console.log('entry', entry)
     }
   }
 }