[vlc-commits] qml: provide modal dialogs instantiable from QML

Pierre Lamot git at videolan.org
Thu Feb 20 13:56:43 CET 2020


vlc | branch: master | Pierre Lamot <pierre at videolabs.io> | Wed Feb 12 15:01:56 2020 +0100| [95bf7366c9362d6d840a8453120c734653979e27] | committer: Jean-Baptiste Kempf

qml: provide modal dialogs instantiable from QML

  This dialog allows to ask simple Yes/No questions, such as action
  confirmation, with a simple callback mechanism.

  The modal dialog need to be attached to the root widget to be displayed
  properly.

  Using vlc_dialog_wait_question for this would block the UI.

Signed-off-by: Jean-Baptiste Kempf <jb at videolan.org>

> http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=95bf7366c9362d6d840a8453120c734653979e27
---

 modules/gui/qt/Makefile.am                         |   1 +
 .../gui/qt/dialogs/dialogs/qml/CustomDialog.qml    | 107 +++++++++++++++++++++
 modules/gui/qt/dialogs/dialogs/qml/Dialogs.qml     |  10 ++
 modules/gui/qt/maininterface/qml/MainInterface.qml |   1 +
 modules/gui/qt/medialibrary/qml/VideoDisplay.qml   |  15 +--
 modules/gui/qt/vlc.qrc                             |   1 +
 6 files changed, 123 insertions(+), 12 deletions(-)

diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am
index 896545ea3c..3c5b3dfdca 100644
--- a/modules/gui/qt/Makefile.am
+++ b/modules/gui/qt/Makefile.am
@@ -542,6 +542,7 @@ libqt_plugin_la_RES = \
 
 #QML and JS resources
 libqt_plugin_la_QML = \
+	gui/qt/dialogs/dialogs/qml/CustomDialog.qml \
 	gui/qt/dialogs/dialogs/qml/Dialogs.qml \
 	gui/qt/dialogs/dialogs/qml/ModalDialog.qml \
 	gui/qt/dialogs/help/qml/About.qml \
diff --git a/modules/gui/qt/dialogs/dialogs/qml/CustomDialog.qml b/modules/gui/qt/dialogs/dialogs/qml/CustomDialog.qml
new file mode 100644
index 0000000000..6d96ee14f4
--- /dev/null
+++ b/modules/gui/qt/dialogs/dialogs/qml/CustomDialog.qml
@@ -0,0 +1,107 @@
+/*****************************************************************************
+ * Copyright (C) 2020 VLC authors and VideoLAN
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * ( at your option ) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA.
+ *****************************************************************************/
+
+import QtQuick 2.11
+import QtQuick.Layouts 1.3
+import org.videolan.vlc 0.1
+
+import "qrc:///style/"
+import "qrc:///widgets/" as Widgets
+
+ModalDialog {
+    id: root
+
+    property alias text: content.text
+
+    property alias cancelTxt: cancelBtn.text
+    property alias okTxt: okBtn.text
+
+    property var _acceptCb: undefined
+    property var _rejectCb: undefined
+
+    function ask(text, acceptCb, rejectCb, buttons) {
+        //TODO: use a Promise here when dropping support of Qt 5.11
+        var okTxt = i18n.qtr("OK")
+        var cancelTxt = i18n.qtr("cancel")
+        if (buttons) {
+            if (buttons.cancel) {
+                cancelTxt = buttons.cancel
+            }
+            if (buttons.ok) {
+                okTxt = buttons.ok
+            }
+        }
+        root.cancelTxt = cancelTxt
+        root.okTxt = okTxt
+        root.text = text
+        root._acceptCb = acceptCb
+        root._rejectCb = rejectCb
+        root.open()
+    }
+
+    onAccepted: {
+        if (_acceptCb)
+            _acceptCb()
+    }
+
+    onRejected: {
+        if (_rejectCb)
+            _rejectCb()
+    }
+
+    contentItem: Text {
+        id: content
+        focus: false
+        font.pixelSize: VLCStyle.fontSize_normal
+        color: VLCStyle.colors.text
+        wrapMode: Text.WordWrap
+    }
+
+    footer: FocusScope {
+        focus: true
+        id: questionButtons
+        implicitHeight: VLCStyle.icon_normal
+
+        Rectangle {
+            color: VLCStyle.colors.banner
+            anchors.fill: parent
+            anchors.leftMargin: VLCStyle.margin_xxsmall
+            anchors.rightMargin: VLCStyle.margin_xxsmall
+
+            RowLayout {
+                anchors.fill: parent
+
+                Widgets.TextToolButton {
+                    id: cancelBtn
+                    Layout.fillWidth: true
+                    focus: true
+                    visible: cancelBtn.text !== ""
+                    KeyNavigation.right: okBtn
+                    onClicked: root.reject()
+                }
+
+                Widgets.TextToolButton {
+                    id: okBtn
+                    Layout.fillWidth: true
+                    visible: okBtn.text !== ""
+                    onClicked: root.accept()
+                }
+            }
+        }
+    }
+}
diff --git a/modules/gui/qt/dialogs/dialogs/qml/Dialogs.qml b/modules/gui/qt/dialogs/dialogs/qml/Dialogs.qml
index f6d348f727..d85cdb0a61 100644
--- a/modules/gui/qt/dialogs/dialogs/qml/Dialogs.qml
+++ b/modules/gui/qt/dialogs/dialogs/qml/Dialogs.qml
@@ -30,6 +30,10 @@ Item {
     signal restoreFocus();
     property var bgContent: undefined
 
+    function ask(text, acceptCb, rejectCb, buttons) {
+        customDialog.ask(text, acceptCb, rejectCb, buttons)
+    }
+
     Widgets.DrawerExt {
         id: errorPopup
         anchors {
@@ -274,6 +278,12 @@ Item {
         }
     }
 
+    CustomDialog {
+        id: customDialog
+        rootWindow: root.bgContent
+        onAboutToHide: restoreFocus()
+    }
+
     DialogModel {
         id: dialogModel
         mainCtx: mainctx
diff --git a/modules/gui/qt/maininterface/qml/MainInterface.qml b/modules/gui/qt/maininterface/qml/MainInterface.qml
index f383c90c39..97ba129bd8 100644
--- a/modules/gui/qt/maininterface/qml/MainInterface.qml
+++ b/modules/gui/qt/maininterface/qml/MainInterface.qml
@@ -175,6 +175,7 @@ Rectangle {
     }
 
     DG.Dialogs {
+        id: g_dialogs
         anchors.fill: parent
         bgContent: root
         onRestoreFocus: {
diff --git a/modules/gui/qt/medialibrary/qml/VideoDisplay.qml b/modules/gui/qt/medialibrary/qml/VideoDisplay.qml
index a4272fa42d..f9cdd2e773 100644
--- a/modules/gui/qt/medialibrary/qml/VideoDisplay.qml
+++ b/modules/gui/qt/medialibrary/qml/VideoDisplay.qml
@@ -24,7 +24,6 @@ import org.videolan.medialib 0.1
 
 import "qrc:///util/" as Util
 import "qrc:///widgets/" as Widgets
-import "qrc:///dialogs/" as DG
 import "qrc:///style/"
 
 Widgets.NavigableFocusScope {
@@ -64,16 +63,6 @@ Widgets.NavigableFocusScope {
         view.currentItem.positionViewAtIndex(initialIndex, ItemView.Contain)
     }
 
-    DG.ModalDialog {
-        id: deleteDialog
-        rootWindow: root
-        title: i18n.qtr("Are you sure you want to delete?")
-        standardButtons: Dialog.Yes | Dialog.No
-
-        onAccepted: console.log("Ok clicked")
-        onRejected: console.log("Cancel clicked")
-    }
-
     Widgets.MenuExt {
         id: contextMenu
         property var model: ({})
@@ -116,7 +105,9 @@ Widgets.NavigableFocusScope {
         }
         Widgets.MenuItemExt {
             text: "Delete"
-            onTriggered: deleteDialog.open()
+            onTriggered: g_dialogs.ask(i18n.qtr("Are you sure you want to delete?"), function() {
+                console.log("unimplemented")
+            })
         }
 
         onClosed: contextMenu.parent.forceActiveFocus()
diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc
index f0401c5240..9bff19c1b3 100644
--- a/modules/gui/qt/vlc.qrc
+++ b/modules/gui/qt/vlc.qrc
@@ -288,6 +288,7 @@
         <file alias="About.qml">dialogs/help/qml/About.qml</file>
     </qresource>
     <qresource prefix="/dialogs">
+        <file alias="CustomDialog.qml">dialogs/dialogs/qml/CustomDialog.qml</file>
         <file alias="Dialogs.qml">dialogs/dialogs/qml/Dialogs.qml</file>
         <file alias="ModalDialog.qml">dialogs/dialogs/qml/ModalDialog.qml</file>
         <file alias="EditorDummyButton.qml">dialogs/toolbar/qml/EditorDummyButton.qml</file>



More information about the vlc-commits mailing list