Hover over header of a tableView columns - hover

Question

I have a simple TableView with 4 TableViewColumns, I'm not usually working with qml, so I'm not really sure how to work properly inside this code.
What I want is that I need a mouse-over the TableView headers (column names). I checked all over and did not found any of a certain simple solution to my problem.
I have tried to use a tool-tip inside the TableVIewColumn but it never shows up, and I have seen that Mouse Area is not supported inside the TableViewColumn. Maybe the solution is simple but I am not aware of it for
the moment.
Rectangle {
width: parent.width
height: parent.height
TableView {
id: table
width: parent.width
height: parent.height
headerVisible: true
TableViewColumn {
id: time
role: "t-stamp"
title: "Time"
width: 60
}
TableViewColumn {
id: d
role: "id"
title: "SignId"
width: 40
}
TableViewColumn {
id: sid
role: "s-id"
title: "StratId"
width: 50
}
TableViewColumn {
id: stratname
role: "strat_name"
title: "StratName"
width: 200
}
Connections{
target: MessageTabelModel
onUpdateView:{
table.resizeColumnsToContents()
}
}
model: MessageTabelModel
}
}

Answer 1

TableView has a headerDelegate property that contains mouse information:
In the header delegate you have access to the following special
properties:
styleData.value - the value or text for this item
styleData.column -
the index of the column
styleData.pressed - true when the column is
being pressed
styleData.containsMouse - true when the column is under
the mouse
styleData.textAlignment - the horizontal text alignment of
the column (since QtQuickControls 1.1)
So you can use styleData.containsMouse for your needs, for example with a simple basic text:
headerDelegate: Text {
color: styleData.containsMouse ? "red" : "black"
text: styleData.value
// ...
}
Or if you want more customization:
headerDelegate: Rectangle {
height: 20
implicitWidth: headerText.paintedWidth
border.color: "black"
// ...
Text {
id: headerText
color: styleData.containsMouse ? "red" : "black"
text: styleData.value
anchors.fill: parent
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
}