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



  • 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
                    }
                }
            }
        }
    }
    

    @



  • 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
                }
            }
        }
    }@

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.