[Interest] Qml Tooltips

Jérôme Godbout jerome at bodycad.com
Fri Oct 9 19:40:40 CEST 2015


For people who may get interested into making tootips too without accessing
the Qml private API:

Here's what I end up doing (a simplified version of one that does load the
item into a Loader container), I can now display any Items no more Z
fighting, have a single timer.

Hope this help some peoples ;-)

// ToolTipArea.qml (I place those inside the Item I want to make a tooltips
for
MouseArea
{
id: component
property string text
property Item content: Text { parent = null; text: component.text; }
property int interval: 750
anchors.fill: parent
hoverEnabled: true
propagateComposedEvents: true
preventStealing: true
acceptedButtons: Qt.NoButton
onExited: hide()
onCanceled: hide()
function hide()
{
if(ToolTipTimer.content == component.content)
ToolTipTimer.hide();
}
function show()
{
if(ToolTipTimer.content != component.content)
{
ToolTipTimer.interval = component.interval;
ToolTipTimer.content = component.content;
}
else
ToolTipTimer.start();
}
onContainsMouseChanged:
{
if(containsMouse)
show();
else
hide();
}
onPositionChanged:
{
hide();
if(containsMouse)
show();
}
}

// Make this ToolTipTimer as singleton into qmldir, use a single timer for
all tooltips
pragma Singleton
import QtQuick 2.3
import QtQuick.Controls 1.2

MouseArea
{
id: component

parent: Application.rootItem // Expose the root Item for the QQuickView
into c++ Application singleton anchors.fill: parent
visible: false z: 1000000
acceptedButtons: Qt.AllButtons

property Item content
property alias interval: timer_.interval
property alias running: timer_.running
onContentChanged:
{
if(content == null)
hide();
else
start();
}

onPressed : { hide(); mouse.accepted = false; }

function hide()
{
timer_.stop();
visible = false;
if(content) content.parent = null;
content = null;
}
function start()
{
timer_.restart();
}
function display()
{
if(!content) return;
content.parent = component;
var pos = Application.cursorPosition(); // Expose Q_INVOKABLE into
Application singleton that do the following: return qquick_view->
mapFromGlobal(QCursor::pos()); content.x = pos.x; content.y = pos.y;
visible = true;
}
Timer
{
id: timer_
running: component.content
interval: 750
onTriggered: component.display()
}
}

On Thu, Oct 8, 2015 at 10:17 AM, Jérôme Godbout <jerome at bodycad.com> wrote:

> Thanks you very much, it work very well.
>
> let's hope this Private API make it public some day with possible style
> customization. I can now remove the ugly z ordering of many component now,
> make the scripts way more clean.
>
> regards,
> Jerome
>
> On Thu, Oct 8, 2015 at 7:31 AM, Nicolas Kniebihler <
> nicolas.kniebihler at dualo.org> wrote:
>
>>  Hi Jerome,
>>
>> I don't know if that answers your question, but I personally use the way
>> QML shows tooltips above Buttons:
>>
>> MyTooltip.qml:
>>
>> import QtQuick 2.3
>>
>> import QtQuick.Controls 1.2
>>
>> import QtQuick.Controls.Private 1.0
>>
>> MouseArea {
>>
>>     id: behavior
>>
>>     property string tooltip
>>
>>     hoverEnabled: true
>>
>>     propagateComposedEvents: true
>>
>>     onExited: Tooltip.hideText()
>>
>>     onCanceled: Tooltip.hideText()
>>
>>     Timer {
>>
>>         interval: 1000
>>
>>         running: behavior.containsMouse && !behavior.pressed && tooltip.length
>>
>>         onTriggered: Tooltip.showText(behavior, Qt.point(behavior.mouseX, behavior.mouseY), tooltip)
>>
>>     }
>>
>> }
>>
>>
>> Example:
>>
>> Label {
>>
>>     text: "My label"
>>
>>         MyTooltip {
>>
>>         anchors.fill: parent
>>
>>         tooltip: qsTr("My tooltip")
>>
>>     }
>>
>> }
>>
>>
>> This way I can show a tooltip above any component (not just Buttons).
>>
>> Nicolas
>>
>>
>> _______________________________________________
>> Interest mailing list
>> Interest at qt-project.org
>> http://lists.qt-project.org/mailman/listinfo/interest
>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20151009/5bdd8a6b/attachment.html>


More information about the Interest mailing list