Hi,
Please help me how to properly implement mouse over in this item
I'm stuck here, i don't know where to put the hover
The hover filename is "level-on-over-vertical.png" and "level-off-over-vertical.png"
Once disabled == true, hover should not be working
Item
{
id: levelItem
anchors.leftMargin: 30
anchors.fill: parent
Row
{
id: levelRow
Repeater
{
id:levelRepeater
model: 15
Image {
source: "../images/level-" + fillSource() + "vertical.png"
id: levelImg
fillMode: Image.PreserveAspectFit
function fillSource() {
var source
if (!disabled) {
source = index <= level? "on-" : "off-"
} else {
source = index <= level? "disabled-" : "off-"
}
return source
}
}
}
}
MouseArea
{
id: levelArea
anchors.fill: levelRow
function xToIndex(xPos) { return xPos/25 }
function setDisabled(xPos){
if (disabled)
disabled= !disabled
level= xToIndex(xPos)
}
onClicked: setDisabled(mouse.x)
onPositionChanged: {
if ((mouse.x >= 0 && mouse.x <= 375) &&
(mouse.y >= 0 && mouse.y <= 55)) {
level= xToIndex(mouse.x);
}
}
}
}
Item
{
id: levelItem
anchors.leftMargin: 30
anchors.fill: parent
Row
{
id: levelRow
Repeater
{
id:levelRepeater
model: 15
Image {
source: "../images/level-" + fillSource() + "vertical.png"
id: levelImg
fillMode: Image.PreserveAspectFit
function fillSource() {
var source
if (!disabled) {
source = index <= level? "on-" : "off-"
} else {
source = index <= level? "disabled-" : "off-"
}
return source
}
}
}
}
MouseArea
{
id: levelArea
anchors.fill: levelRow
function xToIndex(xPos) { return xPos/25 }
function setDisabled(xPos){
if (disabled)
disabled= !disabled
level= xToIndex(xPos)
}
onClicked: setDisabled(mouse.x)
onPositionChanged: {
if ((mouse.x >= 0 && mouse.x <= 375) &&
(mouse.y >= 0 && mouse.y <= 55)) {
level= xToIndex(mouse.x);
}
}
}
}
To copy to clipboard, switch view to plain text mode
Any help is greatly appreciated. TIA.
Bookmarks