recommended approach for displaying tooltips
Hello,
I have a QML application with a number of buttons and would like to display a “tooltip” when the mouse is over top the button. What is the recommended way to do this with QML?
Thanks,
Cliff
4 replies
Hi,
You should be able to emulate tooltips using the basic QML items. Here’s an example — its not very pretty, and very limited (no delay, only one button, etc), but hopefully it will give you some ideas.
- import QtQuick 1.0
- Rectangle {
- width: 200
- height: 200
- property bool needTooltip: button.hovered
- property real tooltipX: button.x
- property real tooltipY: button.y
- Rectangle {
- id: button
- property bool hovered: ma.containsMouse
- width: 100; height: 100
- anchors.centerIn: parent
- color: "steelblue"
- Text {
- anchors.centerIn: parent
- text: "My Button"
- }
- MouseArea {
- id: ma
- anchors.fill: parent
- hoverEnabled: true
- }
- }
- Rectangle {
- id: tooltip
- width: 75; height: 20
- visible: false
- color: "red"
- Text {
- anchors.centerIn: parent
- text: "My Tooltip"
- }
- states: State {
- name: "inuse"
- when: needTooltip
- PropertyChanges {
- target: tooltip
- visible: true
- x: tooltipX + 12
- y: tooltipY - 30
- }
- }
- }
- }
Regards,
Michael
look at http://qt.gitorious.org/qt-components
As korzhp said, take a look at Qt-Components. There you’ll find a QML implementation of the Mx toolkit; in src/Mx/ you find the implementation of a tooltip. Run examples/mx/test.qml to see it in action in the Mx widgets gallery :-)
You must log in to post a reply. Not a member yet? Register here!