Выделенное свойство QML ItemDelegate не работает

Я хочу настроить цвет выделения в ItemDelegate. Если я использую по умолчанию ItemDelegate с темой Material, тогда все в порядке, и цвет меняется, когда я навожу курсор на этот элемент, но когда я переопределяю фон, он ломается, и цвета больше не меняются.

MyItemDelegate.qml:

import QtQuick 2.11
import QtQuick.Controls.Material 2.4
import QtQuick.Controls 2.4
import QtQuick.Templates 2.4 as T

T.ItemDelegate {
    id: myItemDelegate
    height: 40     
    anchors.left: parent.left
    anchors.right: parent.right

    contentItem: Text {
            text: "Hello"
            anchors.fill: parent
            verticalAlignment: Text.AlignVCenter
            horizontalAlignment: Text.AlignHCenter
        }
    }

    background: Rectangle {
        anchors.fill: myItemDelegate
        color: myItemDelegate.highlighted ? "blue" : "transparent"
    }
}

Почему свойство highlighted не работает? И как я могу настроить этот цвет?


qt qml highlight hover qitemdelegate
person ChabErch    schedule 18.08.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Проблема проста, выделенное свойство создается не с нуля, его необходимо активировать, и самое распространенное, что оно имеет привязку с ListView.isCurrentItem, поэтому необходимо обновить currentItem:

MyItemDelegate.qml

import QtQuick 2.11
import QtQuick.Controls.Material 2.4
import QtQuick.Controls 2.4
import QtQuick.Templates 2.4 as T

T.ItemDelegate {
    id: myItemDelegate
    height: 40
    anchors.left: parent.left
    anchors.right: parent.right
    highlighted: ListView.isCurrentItem // <---
    contentItem: Text {
        text: "Hello"
        anchors.fill: parent
        verticalAlignment: Text.AlignVCenter
        horizontalAlignment: Text.AlignHCenter
    }
    background: Rectangle {
        anchors.fill: myItemDelegate
        color: myItemDelegate.highlighted ? "blue" : "transparent"
    }
}

main.qml

import QtQuick 2.9
import QtQuick.Controls 2.2

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Scroll")
    ListView {
        id: listView
        anchors.fill: parent
        model: 20
        delegate: MyItemDelegate {
            MouseArea{
                anchors.fill: parent
                hoverEnabled: true
                onHoveredChanged: listView.currentIndex = index
            }
        }
    }
}
person eyllanesc    schedule 18.08.2018