Qt QML。将工具提示放置在其他元素之上的问题

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

按钮。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
            }
        }
    }
}

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
        }

    }
}

main.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
            }
        }
    }
}

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轴不起作用

您需要将工具提示拉到

按钮.qml

组件之外，或者编写一个黑客程序，将工具提示

QDeclarativeItem

从它所属的

QDeclarativeScene

分离到位于弹出窗口中的

QDeclarativeScene

（a

QDeclarativeView

-即具有适当属性的

QWidget

。

此解决方案看起来很不雅观，但我会尝试一下。是否可以不使用额外的QWidget，而只将工具提示移到单独的.qml中（因为我看不出如何一眼就能做到）分离

qml

=分离组件。重要的是在

按钮

s之前的同一组件中实例化的项目

工具提示

。您需要为

按钮

s提供其id，以便它们知道要显示什么。移动是可能的，尽管不必要。