Added array to snackbar qml (#370)

Signed-off-by: ahcorde <[email protected]> Signed-off-by: Louise Poubel <[email protected]> Co-authored-by: Louise Poubel <[email protected]>
gazebosim · Mar 25, 2022 · 3cd66a8 · 3cd66a8
1 parent c14f379
commit 3cd66a8
Show file tree

Hide file tree

Showing 6 changed files with 120 additions and 35 deletions.
diff --git a/include/ignition/gui/MainWindow.hh b/include/ignition/gui/MainWindow.hh
@@ -566,9 +566,14 @@ namespace ignition
       signals: void configChanged();
 
       /// \brief Displays a message to the user
+      /// The message will appear in a snackbar, this message requires to
+      /// click on the botton "Dismiss" to close the dialog.
       signals: void notify(const QString &_message);
 
       /// \brief Displays a message to the user
+      /// The message will appear in a snackbar, this message disappear when
+      /// the duration is over, or if the user clicks outside or escape before
+      /// that.
       /// \param[in] _message Message to show
       /// \param[in] _duration Time in milliseconds that the message will
       /// appear

diff --git a/include/ignition/gui/qml/IgnSnackBar.qml b/include/ignition/gui/qml/IgnSnackBar.qml
@@ -23,14 +23,49 @@ import QtQuick.Dialogs 1.0
 import QtQuick.Layouts 1.3
 import QtQuick.Window 2.2
 
+/*
+ To use the snackbar you need to call the methods in the MainWindow class:
+  - notify(message)
+  - notifyWithDuration(message, duration)
+
+For example:
+  // This code will show the message "Message" during one second
+  App()->findChild<MainWindow *>()->notifyWithDuration("Message", 1000);
+
+  // This code will show the message "Message2" but the dialog will be there
+  // until you press the button "Dismiss"
+  App()->findChild<MainWindow *>()->notifyWithDuration("Message2");
+*/
+
 Popup {
   id: snackbar
   modal: duration == 0
   focus: duration == 0
   x: (window.width - width) / 2
   y: window.height - window.height / 6
   width: window.width - window.width / 6
-  contentHeight: notificationColumn.height
+  contentHeight: Math.max(dismissButton.height, notificationText.height)
+  padding: 10
+
+  // If the popup has a Dismiss button, only close by pressing that.
+  // Otherwise, use the default behavior.
+  closePolicy: duration == 0 ? Popup.NoAutoClose :
+      Popup.CloseOnEscape | Popup.CloseOnPressOutside
+
+  // Array that contains a dictionary with two keys "text" and "duration"
+  // This structure keeps the message to show using FIFO
+  property var popupArray: []
+
+  // Duration of the snackbar. If duration is equal to zero then
+  // you should click on the button "Dismiss" to close the dialog",
+  // otherwise you need to wait the duration defined.
+  property int duration: 0
+
+  // This method is called when the dialog is closed
+  onClosed: {
+    timer.stop()
+    checkArray();
+  }
 
   background: Rectangle {
     color: Material.background
@@ -43,45 +78,92 @@ Popup {
     }
   }
 
-  // Duration of the snackbar. If duration is equal to zero then
-  // you should click somewhere in Ignition Gazebo to close it.
-  property int duration: 4000
+  // this function is called when notify() or notifyWithDuration() are called
+  function setTextDuration(_message, _duration) {
+    popupArray.push({"text": _message, "duration": _duration})
+    checkArray();
+  }
 
-  function setText(_message) {
-    notificationText.text = _message
-    if (duration > 0)
+  // This method check if the popupArray has remaining messages to show.
+  function checkArray()
+  {
+    if (popupArray.length == 0)
     {
-      timer.restart()
+      return
     }
-  }
 
-  function setTextDuration(_message, _duration) {
-    notificationText.text = _message
-    duration = _duration
-    if (duration > 0)
+    if(!timer.running)
     {
-      timer.restart()
+      if (popupArray.length > 0)
+      {
+        var values = popupArray[0]
+        notificationText.text = values.text
+        duration = values.duration
+        snackbar.open()
+
+        // Note that objects cannot be individually added to or removed from
+        // the list once created; to modify the contents of a list, it must be
+        // reassigned to a new list.
+        var newpopupArray = []
+        for (var i = 1; i < popupArray.length; i++)
+        {
+          newpopupArray.push(popupArray[i])
+        }
+
+        if (newpopupArray != undefined)
+        {
+          popupArray = newpopupArray
+        }
+        else
+        {
+          popupArray = []
+        }
+        if (duration > 0)
+        {
+          timer.restart()
+        }
+      }
     }
   }
 
-  Column {
-    id: notificationColumn
-    spacing: 20
+  contentItem: RowLayout {
+    id: contentLayout
+    height: dismissButton.height
+    anchors.verticalCenter: snackbar.verticalCenter
 
-    Label {
+    Text {
       id: notificationText
-      width: snackbar.availableWidth
-      wrapMode: Label.Wrap
-      font.pixelSize: 18
+      color: Material.theme == Material.Light ? "black" : "white"
+      wrapMode: Text.Wrap
+      font.pixelSize: 15
+      Layout.fillWidth: true
+      Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+    }
+    Button {
+      id: dismissButton
+      visible: duration == 0
+      flat: true
+      Layout.margins: 0
+      Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
+      background: Rectangle {
+        color: parent.down ? Material.color(Material.accent, Material.Shade400) :
+               (parent.hovered ? Material.color(Material.accent, Material.Shade200) :
+               "transparent")
+      }
+      font.pixelSize: 12
+      text: "Dismiss"
+      onClicked: snackbar.close()
     }
   }
   Timer {
-      id: timer
-      interval: snackbar.duration
-      onTriggered: {
-          if (!running) {
-              snackbar.close();
-          }
-      }
+    id: timer
+    interval: snackbar.duration
+    onTriggered: {
+        if (!running) {
+            snackbar.close();
+        }
+        checkArray();
+    }
   }
+
 }
diff --git a/include/ignition/gui/qml/Main.qml b/include/ignition/gui/qml/Main.qml
@@ -102,12 +102,10 @@ ApplicationWindow
   Connections {
     target: MainWindow
     onNotify: {
-      notificationDialog.setText(_message)
-      notificationDialog.open()
+      notificationDialog.setTextDuration(_message, 0)
     }
     onNotifyWithDuration: {
       notificationDialog.setTextDuration(_message, _duration)
-      notificationDialog.open()
     }
   }
 

diff --git a/src/plugins/image_display/ImageDisplay.cc b/src/plugins/image_display/ImageDisplay.cc
@@ -199,7 +199,7 @@ void ImageDisplay::OnTopic(const QString _topic)
     return;
   }
   App()->findChild<MainWindow *>()->notifyWithDuration(
-    QString::fromStdString("Subscribed to: " + topic), 4000);
+    QString::fromStdString("Subscribed to: <b>" + topic + "</b>"), 4000);
 }
 
 /////////////////////////////////////////////////

diff --git a/src/plugins/screenshot/Screenshot.cc b/src/plugins/screenshot/Screenshot.cc
@@ -175,7 +175,7 @@ void Screenshot::SaveScreenshot()
   this->SetSavedScreenshotPath(QString::fromStdString(savePath));
 
   App()->findChild<MainWindow *>()->notifyWithDuration(
-    QString::fromStdString("Saved image to:" + savePath), 4000);
+    QString::fromStdString("Saved image to: <b>" + savePath + "</b>"), 4000);
 }
 
 /////////////////////////////////////////////////

diff --git a/src/plugins/teleop/Teleop.cc b/src/plugins/teleop/Teleop.cc
@@ -150,8 +150,8 @@ void Teleop::OnTopicSelection(const QString &_topic)
   else
   {
     App()->findChild<MainWindow *>()->notifyWithDuration(
-      QString::fromStdString("Subscribing to topic: '" +
-        this->dataPtr->topic + "'"), 4000);
+      QString::fromStdString("Subscribing to topic: '<b>" +
+        this->dataPtr->topic + "</b>'"), 4000);
   }
 }