QML。在其他元素之上定位工具提示的问题

时间:2014-02-13 13:28:21

标签: qt qml qt-quick

我正在开发一个QML应用程序,它本质上是一个带有一组按钮的工具栏。当我将鼠标悬停在按钮上时,我想显示工具提示。但是现在工具提示被绘制在除了调用它之外的每个按钮下方。这是一个显示问题的简单示例

Button.qml

import QtQuick 1.1

Rectangle 
{
    property color buttonColor: "red"
    property color onHoverColor: "green"
    property color borderColor: "blue"


    property bool needTooltip: buttonMouseArea.containsMouse

    id: button
    width: 65
    height: 82

    radius: 1
    color: buttonColor

    signal buttonPressed()

    MouseArea{
        id: buttonMouseArea
        anchors.fill: parent    
        onClicked: buttonPressed()
        onPressed: button.color = borderColor
        onReleased: button.color = onHoverColor
        hoverEnabled: true

        onEntered: button.color = onHoverColor
        onExited:  button.color = buttonColor
     }

    Rectangle {
        id: tooltip
        width: 75; height: 20
        z: parent.z +10
        visible: false
        color: "peachpuff"
        Text {
            anchors.centerIn: parent
            text: "My Tooltip"
        }

        states: State {
            name: "inuse"
            when: needTooltip
            PropertyChanges {
                target: tooltip
                visible: true
                x: buttonMouseArea.mouseX + 5
                y: buttonMouseArea.mouseY - 25
            }
        }
    }
}

main.qml

import QtQuick 1.1

Rectangle {
    width: 1500
    height: 200

    Row
    {
        height: 80

        anchors.centerIn: parent
        spacing: 30

        Button{
            id: settingsButton;
        }
        Button{
            id: listButton;
        }
        Button{
            id: someOtherButton
        }

    }
}

如何将工具提示显示在程序中的所有其他内容之上?弄乱按钮和工具提示的z轴不起作用

1 个答案:

答案 0 :(得分:1)

您需要将工具提示拉出Button.qml组件之外,或编写一个将工具提示QDeclarativeItem从其所属的QDeclarativeScene分离到QDeclarativeScene的黑客攻击位于弹出窗口中(QDeclarativeView - 即具有适当属性的QWidget