diff options
Diffstat (limited to 'examples/webengine')
14 files changed, 80 insertions, 66 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; diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-auth1.png b/examples/webengine/customdialogs/doc/images/customdialogs-auth1.png Binary files differindex 2bde8bd8e..5e8f8d6bd 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-auth1.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-auth1.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-auth2.png b/examples/webengine/customdialogs/doc/images/customdialogs-auth2.png Binary files differindex ce358fca0..41828d36d 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-auth2.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-auth2.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-color1.png b/examples/webengine/customdialogs/doc/images/customdialogs-color1.png Binary files differindex a51d1bdd3..9208045b2 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-color1.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-color1.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-color2.png b/examples/webengine/customdialogs/doc/images/customdialogs-color2.png Binary files differindex 3b0b2e986..9087fdf14 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-color2.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-color2.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-file1.png b/examples/webengine/customdialogs/doc/images/customdialogs-file1.png Binary files differindex 0ff39bf38..ba8bdf78c 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-file1.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-file1.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-file2.png b/examples/webengine/customdialogs/doc/images/customdialogs-file2.png Binary files differindex e56078c44..aa25579d7 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-file2.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-file2.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-prompt1.png b/examples/webengine/customdialogs/doc/images/customdialogs-prompt1.png Binary files differindex 988b4deea..e36ba4a13 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-prompt1.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-prompt1.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-prompt2.png b/examples/webengine/customdialogs/doc/images/customdialogs-prompt2.png Binary files differindex 085339378..2c8d92649 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs-prompt2.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs-prompt2.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs-tooltip.png b/examples/webengine/customdialogs/doc/images/customdialogs-tooltip.png Binary files differnew file mode 100644 index 000000000..498de9595 --- /dev/null +++ b/examples/webengine/customdialogs/doc/images/customdialogs-tooltip.png diff --git a/examples/webengine/customdialogs/doc/images/customdialogs.png b/examples/webengine/customdialogs/doc/images/customdialogs.png Binary files differindex 13322d2f6..c42114a16 100644 --- a/examples/webengine/customdialogs/doc/images/customdialogs.png +++ b/examples/webengine/customdialogs/doc/images/customdialogs.png diff --git a/examples/webengine/customdialogs/doc/src/customdialogs.qdoc b/examples/webengine/customdialogs/doc/src/customdialogs.qdoc index 5c550ed5e..6319ce53b 100644 --- a/examples/webengine/customdialogs/doc/src/customdialogs.qdoc +++ b/examples/webengine/customdialogs/doc/src/customdialogs.qdoc @@ -140,6 +140,38 @@ To keep things simple, we do not provide any logic on component completion, and we simply close the form on any action. + \section2 Tooltip Requests + + \l [QML]{TooltipRequest} is a request object that is passed as a + parameter of the WebEngineView::tooltipRequested signal. We use the + \c onTooltipRequested signal handler to handle requests for + custom tooltip menus at specific positions: + + \quotefromfile webengine/customdialogs/WebView.qml + \skipto WebEngineView + \printuntil { + \dots 4 + \skipto onTooltipRequested + \printuntil } + \printuntil } + \printuntil } + \dots 4 + \skipuntil onFileDialogRequested + \skipuntil }}); + \skipuntil } + \skipto } + \printline } + + The second text field from the top on our page triggers the request. Next, + we check whether we should use the default menu. If not, we accept the + request and show a custom QML element as tooltip: + + \image customdialogs-tooltip.png + + \quotefromfile webengine/customdialogs/WebView.qml + \skipto Rectangle + \printuntil } + \section2 Authentication Dialog Requests \image customdialogs-auth1.png diff --git a/examples/webengine/customdialogs/index.html b/examples/webengine/customdialogs/index.html index 490dd79fd..69c0e6b21 100644 --- a/examples/webengine/customdialogs/index.html +++ b/examples/webengine/customdialogs/index.html @@ -11,6 +11,9 @@ <td><div class="div"><a href="#openMenu" class="link">Right click on text to see link context menu</a></div></td> </tr> <tr> + <td><div class="div"><p title="I am a tooltip.">Hover this text to display a tooltip</a></div></td> + </tr> + <tr> <td><button class="button" onclick="window.location = 'http://localhost.:5555/OPEN_AUTH'"> Open Authentication Dialog</button></td> </tr> diff --git a/examples/webengine/lifecycle/doc/src/lifecycle.qdoc b/examples/webengine/lifecycle/doc/src/lifecycle.qdoc index 4151d0597..d10e617e3 100644 --- a/examples/webengine/lifecycle/doc/src/lifecycle.qdoc +++ b/examples/webengine/lifecycle/doc/src/lifecycle.qdoc @@ -38,6 +38,8 @@ properties of the \l {WebEngineView} can be used to reduce the CPU and memory usage of background tabs in a tabbed browser. + For an overview of the lifecycle feature, see \l {Page Lifecycle API}. + \include examples-run.qdocinc \section1 UI Elements of the Example @@ -53,71 +55,6 @@ window also has a \l {Drawer} for changing settings. The drawer can be opened by clicking the "⋮" button on the tool bar. - \section1 Overview of Lifecycle States - - Each \l {WebEngineView} item can be in one of three \e {lifecycle states}: - active, frozen, or discarded. These states, like the sleep states of a CPU, - control the resource usage of web views. - - The \e {active} state is the normal, unrestricted state of a web view. All - visible web views are always in the active state, as are all web views that - have not yet finished loading. Only invisible, idle web views can be - transitioned to other lifecycle states. - - The \e {frozen} state is a low CPU usage state. In this state, most HTML - task sources are suspended (frozen) and, as a result, most DOM event - processing and JavaScript execution will also be suspended. The web view - must be invisible in order to be frozen as rendering is not possible in this - state. - - The \e {discarded} state is an extreme resource-saving state. In this state, - the browsing context of the web view will be discarded and the corresponding - renderer subprocess shut down. CPU and memory usage in this state is reduced - virtually to zero. On exiting this state the web page will be automatically - reloaded. The process of entering and exiting the discarded state is similar - to serializing the browsing history of the web view and destroying the view, - then creating a new view and restoring its history. - - See also \l {WebEngineView::LifecycleState}. The equivalent in the Widgets - API is \l {QWebEnginePage::LifecycleState}. - - \section2 The \c {lifecycleState} and \c {recommendedState} Properties - - The \l {WebEngineView::}{lifecycleState} property of the \l {WebEngineView} - type is a read-write property that controls the current lifecycle state of - the web view. This property is designed to place as few restrictions as - possible on what states can be transitioned to. For example, it is allowed - to freeze a web view that is currently playing music in the background, - stopping the music. In order to implement a less aggressive resource-saving - strategy that avoids interrupting user-visible background activity, the \l - {WebEngineView::} {recommendedState} property must be used. - - The \l {WebEngineView::}{recommendedState} property of the \l - {WebEngineView} type is a read-only property that calculates a safe limit on - the \l {WebEngineView::}{lifecycleState} property, taking into account the - current activity of the web view. So, in the example of a web view playing - music in the background, the recommended state will be \c {Active} since a - more aggressive state would stop the music. If the application wants to - avoid interrupting background activity, then it should avoid putting the web - view into a more aggressively resource-saving lifecycle state than what's - given by \l {WebEngineView::}{recommendedState}. - - See also \l {WebEngineView::lifecycleState} and \l - {WebEngineView::recommendedState}. The equivalents in the Widgets API are \l - {QWebEnginePage::lifecycleState} and \l {QWebEnginePage::recommendedState}. - - \section2 The Page Lifecycle API - - The \l {WebEngineView::}{lifecycleState} property is connected to the \l - {https://wicg.github.io/page-lifecycle/spec.html}{Page Lifecycle API}, a - work-in-progress extension to the HTML standard that specifies two new DOM - events, \c {freeze} and \c {resume}, and adds a new \c - {Document.wasDiscarded} boolean property. The \c {freeze} and \c {resume} - events are fired when transitioning from the \c {Active} to the \c {Frozen - state}, and vice-versa. The \c {Document.wasDiscarded} property is set to \c - {true} when transition from the \c {Discarded} state to the \c {Active} - state. - \section1 Lifecycle States in the Example The example implements two ways of changing the lifecycle state: manual and |
