Qml while i do hoverEnabled: true then unable to retain other property of component .

[vivekmalik2466]

on select trackDelegate trackRowDelegate (all track) must be selected .but

here trackRowDelegate unable to select while once mouse hove.

i

@Component {
id: trackRowDelegate
Item {
id: item
width: tracksDetail.width
height: row.height

        function altColor(i) {
            var colors = [ "#E4DDE8", "#00000000" ];
            return colors[i];
        }

        Rectangle {
            id: background
            width:  parent.width + 7
            height: parent.height
            color: altColor(index%2)
            opacity: 0.5
        }
        Rectangle {
            id: backgroundSelected
            width:  parent.width + 7
            height: parent.height
            color: "#d341a5"
            opacity: (selected === false ? 0 : 0.3)
        }

        MouseArea {
            id: markerAreaTracks;
            anchors.fill: parent;
            hoverEnabled: true

            onClicked:{
                if(backgroundSelected.opacity == 0.3) {
                    model.modelData.selected = false;
                    backgroundSelected.opacity  = 0.2;
                } else {
                    model.modelData.selected = true;
                    backgroundSelected.opacity = 0.3;
                }
            }
            onEntered: {
                if(backgroundSelected.opacity != 0.3) {
                    backgroundSelected.opacity = 0.2;
                }
            }
            onExited: {
                if(backgroundSelected.opacity != 0.3) {
                    backgroundSelected.opacity = 0;
                }
            }
        }
        Row {
            id: row
            height: rowHeight
            width: parent.width
            spacing: 5
            Item {
                width: 5
                height: 1
            }
           
          
            Text {
                width: parent.width * (60/100)
                text: model.modelData.tracktitle
                font.family: fontFamilyNormal
                verticalAlignment: Text.AlignVCenter
                smooth:true
                clip: true
            }
            Loader { sourceComponent: columnSeparator; height: parent.height }

            Component {
                id: columnSeparator
                Rectangle {
                    width: 1
                    color: "#d9d3d3"
                    opacity: 1
                }
            }
        }
    }
}

@

[vivekmalik2466]

on selecting this bellow mention component i am unable to select those track on which my mouse once over.

@Component {
id: trackDelegate

    Item {
        id: parentItem
        width: list.width - 50
        height: (albumsDetail.height < minHeight ? minHeight : albumsDetail.height)
        anchors.left: parent.left
        visible: visibility

        Item {
            id: albumsDetail
           
            Image {
                id: artwork
                height: 100
                width: 100
                source: coverart
                smooth: true
                z: 9
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.top: parent.top
                anchors.topMargin: 8
            }

            BorderImage {
                id: artworkShadow
                height: artwork.height
                width: artwork.width
                smooth: true
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.horizontalCenterOffset: 4
                anchors.top: parent.top
                anchors.topMargin: 12
                z: 4
                opacity:0.7
                source: "qrc:/resources/images/image-shadow.png"
            }

            BorderImage {
                id: artworkSelected
                height: artwork.height + 20
                width: artwork.width + 20
                smooth: true
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.horizontalCenterOffset: 2
                anchors.top: parent.top
                z: 0
                opacity: (selected === false ? 0 : 1)
                source: "qrc:/resources/images/artwork-selected.png"
            }

            MouseArea {
                id: markerArea;
                anchors.fill: artwork;
                hoverEnabled: true

                onClicked:{
                    if(selected === true) {
                        selected = false;
                        artworkSelected.opacity  = 0.7;
                    } else {
                        selected = true;
                        artworkSelected.opacity = 1;
                    }
                }
                onEntered: {
                    if(artworkSelected.opacity != 1) {
                        artworkSelected.opacity = 0.7;
                    }
                }
                onExited: {
                    if(artworkSelected.opacity != 1) {
                        artworkSelected.opacity = 0;
                    }
                }
            }

         




        }
        Item {
            id: tracksDetail
            width: parent.width - albumsDetail.width - 100
            height: lstTracksDetail.height
            anchors.top: parent.top
            anchors.topMargin: 10
            anchors.left: albumsDetail.right
            anchors.leftMargin: 100
            ListView {
                id: lstTracksDetail
                height: (tracklist.length * rowHeight) + 20
                interactive: false
                model: tracklist
                anchors.top: parent.top
                anchors.topMargin: 10
                delegate: trackRowDelegate
            }
        }
        Loader { sourceComponent: rowSeparator; width: parent.width + 10;
            anchors.bottom: (tracksDetail.height < albumsDetail.height ? albumsDetail.top : tracksDetail.top)
            visible: (index === 0 ? false : true)
        }
        Component {
            id: rowSeparator
            Rectangle {
                height: 1
                color: "#000000"
                opacity: 0.1
            }
        }
    }
}@