Added Snackbar qtquick object (#369)

Signed-off-by: ahcorde <[email protected]>
Signed-off-by: Louise Poubel <[email protected]>

Co-authored-by: Louise Poubel <[email protected]>

include/ignition/gui/MainWindow.hh

@@ -568,6 +568,12 @@ namespace ignition
  /// \brief Displays a message to the user
  signals: void notify(const QString &_message);
 
+ /// \brief Displays a message to the user
+ /// \param[in] _message Message to show
+ /// \param[in] _duration Time in milliseconds that the message will
+ /// appear
+ signals: void notifyWithDuration(const QString &_message, int _duration);
+
  /// \internal
  /// \brief Private data pointer
  private: std::unique_ptr<MainWindowPrivate> dataPtr;

include/ignition/gui/qml/IgnSnackBar.qml

@@ -0,0 +1,87 @@
+/*
+ * Copyright (C) 2022 Open Source Robotics Foundation
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+*/
+
+import QtGraphicalEffects 1.0
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+import QtQuick.Controls.Material 2.2
+import QtQuick.Dialogs 1.0
+import QtQuick.Layouts 1.3
+import QtQuick.Window 2.2
+
+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
+
+ background: Rectangle {
+ color: Material.background
+ layer.enabled: true
+ layer.effect: DropShadow {
+ color: "#aa000000"
+ samples: 9
+ spread: 0
+ radius: 8.0
+ }
+ }
+
+ // 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
+
+ function setText(_message) {
+ notificationText.text = _message
+ if (duration > 0)
+ {
+ timer.restart()
+ }
+ }
+
+ function setTextDuration(_message, _duration) {
+ notificationText.text = _message
+ duration = _duration
+ if (duration > 0)
+ {
+ timer.restart()
+ }
+ }
+
+ Column {
+ id: notificationColumn
+ spacing: 20
+
+ Label {
+ id: notificationText
+ width: snackbar.availableWidth
+ wrapMode: Label.Wrap
+ font.pixelSize: 18
+ }
+ }
+ Timer {
+ id: timer
+ interval: snackbar.duration
+ onTriggered: {
+ if (!running) {
+ snackbar.close();
+ }
+ }
+ }
+}

include/ignition/gui/qml/Main.qml

@@ -102,7 +102,11 @@ ApplicationWindow
  Connections {
  target: MainWindow
  onNotify: {
- notificationText.text = _message
+ notificationDialog.setText(_message)
+ notificationDialog.open()
+ }
+ onNotifyWithDuration: {
+ notificationDialog.setTextDuration(_message, _duration)
  notificationDialog.open()
  }
  }
@@ -319,29 +323,8 @@ ApplicationWindow
  }
  }
 
- /**
- * TODO: change to a snackbar / toast
- */
- Dialog {
+ IgnSnackBar {
  id: notificationDialog
- modal: true
- focus: true
- x: (window.width - width) / 2
- y: window.height / 6
- width: Math.min(window.width, window.height) / 3 * 2
- contentHeight: notificationColumn.height
-
- Column {
- id: notificationColumn
- spacing: 20
-
- Label {
- id: notificationText
- width: notificationDialog.availableWidth
- wrapMode: Label.Wrap
- font.pixelSize: 18
- }
- }
  }
 
  Timer {

include/ignition/gui/resources.qrc

@@ -6,6 +6,7 @@
  <file>qml/IgnCardSettings.qml</file>
  <file>qml/IgnHelpers.qml</file>
  <file>qml/IgnRulers.qml</file>
+ <file>qml/IgnSnackBar.qml</file>
  <file>qml/IgnSortFilterModel.qml</file>
  <file>qml/IgnSpinBox.qml</file>
  <file>qml/IgnSplit.qml</file>
@@ -24,6 +25,7 @@
  <!-- This qmldir file defines a QML module that can be imported -->
  <file alias="qmldir">qml/qmldir</file>
  <!-- Add any QML components referenced in the qmldir file here -->
+ <file alias="IgnSnackBar.qml">qml/IgnSnackBar.qml</file>
  <file alias="IgnSpinBox.qml">qml/IgnSpinBox.qml</file>
 </qresource>
 </RCC>

src/plugins/image_display/ImageDisplay.cc

@@ -31,6 +31,7 @@
 #include <ignition/transport/Node.hh>
 
 #include "ignition/gui/Application.hh"
+#include "ignition/gui/MainWindow.hh"
 
 namespace ignition
 {
@@ -195,7 +196,10 @@ void ImageDisplay::OnTopic(const QString _topic)
  this))
  {
  ignerr << "Unable to subscribe to topic [" << topic << "]" << std::endl;
+ return;
  }
+ App()->findChild<MainWindow *>()->notifyWithDuration(
+ QString::fromStdString("Subscribed to: " + topic), 4000);
 }
 
 /////////////////////////////////////////////////

src/plugins/screenshot/Screenshot.cc

@@ -173,6 +173,9 @@ void Screenshot::SaveScreenshot()
  this->dataPtr->dirty = false;
 
  this->SetSavedScreenshotPath(QString::fromStdString(savePath));
+
+ App()->findChild<MainWindow *>()->notifyWithDuration(
+ QString::fromStdString("Saved image to:" + savePath), 4000);
 }
 
 /////////////////////////////////////////////////

src/plugins/screenshot/Screenshot.qml

@@ -30,11 +30,6 @@ ToolBar {
  color: "transparent"
  }
 
- Connections {
- target: Screenshot
- onSavedScreenshot: savedPathPopup.open()
- }
-
  RowLayout {
  spacing: 2
 
@@ -85,16 +80,5 @@ ToolBar {
  close()
  }
  }
-
- Popup {
- id: savedPathPopup
- parent: ApplicationWindow.overlay
- x: 0
- y: 100
- Text {
- text: "Screenshot saved: " + Screenshot.savedScreenshotPath
- }
- }
-
  }
 }

src/plugins/teleop/Teleop.cc

@@ -140,8 +140,19 @@ void Teleop::OnTopicSelection(const QString &_topic)
  this->dataPtr->node.Advertise<ignition::msgs::Twist>
  (this->dataPtr->topic);
  if(!this->dataPtr->cmdVelPub)
- ignerr << "Error when advertising topic: " <<
- this->dataPtr->topic << std::endl;
+ {
+ App()->findChild<MainWindow *>()->notifyWithDuration(
+ QString::fromStdString("Error when advertising topic: " +
+ this->dataPtr->topic), 4000);
+ ignerr << "Error when advertising topic: " <<
+ this->dataPtr->topic << std::endl;
+ }
+ else
+ {
+ App()->findChild<MainWindow *>()->notifyWithDuration(
+ QString::fromStdString("Subscribing to topic: '" +
+ this->dataPtr->topic + "'"), 4000);
+ }
 }
 
 /////////////////////////////////////////////////