Add example for QQuickWebEngineTooltipRequest

Implement an example usage in customdialogs application and extend
the documentation.

Change-Id: Ibc240cf94ac939335455f4eac3d52ffec2ba7ff6
Reviewed-by: Leena Miettinen <riitta-leena.miettinen@qt.io>
Reviewed-by: Allan Sandfeld Jensen <allan.jensen@qt.io>

1 files changed, 43 insertions, 1 deletions

diff --git a/examples/webengine/customdialogs/WebView.qml b/examples/webengine/customdialogs/WebView.qml
index 0715bc709..d754ea7dc 100644
--- a/examples/webengine/customdialogs/WebView.qml
+++ b/examples/webengine/customdialogs/WebView.qml
@@ -49,7 +49,7 @@
 ****************************************************************************/
 
 import QtQuick 2.0
-import QtWebEngine 1.4
+import QtWebEngine 1.10
 
 WebEngineView {
 
@@ -57,6 +57,32 @@ WebEngineView {
     property bool useDefaultDialogs: true
     signal openForm(var form)
 
+    Rectangle {
+        id: tooltip
+        width: 200
+        height: 30
+        z: 50
+        visible: false
+        color: "gray"
+        border.color: "black"
+        border.width: 2
+        radius: 3
+
+        property string text: ""
+
+        Text {
+            x: 0
+            y: 0
+            color: "#ffffff"
+            text: parent.text
+            font.pointSize: 12
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            font.bold: false
+        }
+
+    }
+
     onContextMenuRequested: function(request) {
         // we only show menu for links with #openMenu
         if (!request.linkUrl.toString().endsWith("#openMenu")) {
@@ -72,6 +98,22 @@ WebEngineView {
                      properties: {"request": request}});
     }
 
+    onTooltipRequested: function(request) {
+        if (useDefaultDialogs)
+            return;
+
+        if (request.type == TooltipRequest.Show) {
+            tooltip.visible = true;
+            tooltip.x = request.x;
+            tooltip.y = request.y;
+            tooltip.text = request.text;
+        } else {
+            tooltip.visible = false;
+        }
+
+        request.accepted = true;
+    }
+
     onAuthenticationDialogRequested: function(request) {
         if (useDefaultDialogs)
             return;