5

我试图在 ListView 中突出显示当前选定的项目。下面是我正在使用的代码;出于某种原因,虽然类似的代码在此应用程序的另一个 ListView 中完美运行,但此处的 SelectedRectangle 项从未显示,尽管所选项目应更改时。

Rectangle {
    id: deviceTree
    width: (window.width * 2) / 3
    height: 400

    border {
        width: 2
        color: "black"
    }

    ListView {
        id: deviceTreeView

        model: deviceTreeModel
        delegate: deviceTreeDelegate
        highlight: SelectionRectangle {}

        anchors.fill: parent
        anchors.margins: 6
    }

    Component {
        id: deviceTreeDelegate

        Rectangle {
            border.color: "#CCCCCC"
            width: deviceTree.width
            height: 30

            smooth: true
            radius: 2

            MouseArea {
                anchors.fill: parent
                onClicked: { deviceTreeView.currentIndex = index; window.selectedDeviceChanged(deviceName) }
            }
        }
    }
}

选定矩形.qml

Rectangle
{
    id: selectionRectangle

    color: "lightsteelblue"
    smooth: true
    radius: 5
}

解决方案: deviceTreeDelegate 中的矩形默认为白色,并与选择矩形重叠。使用该属性将其设置为透明,以便可以看到选择。

4

2 回答 2

12

这是因为默认的 Rectangle 颜色为白色,并且高光堆叠在委托下方。将 Rectangle 颜色设置为“透明”将允许突出显示通过代理可见。

于 2012-07-04T10:34:47.330 回答
0

Your code gets two mistakes :

  1. The component for the highlight property. The name of the type of the component is the same than the name of the QML file where it is defined. You defined it in a file named SelectedRectangle.qml so you have to write highlight: SelectionRectangle {} in your main QML file
  2. The type of the highlight member is Component. So the component that you use for this member should have got a type which inherits Component. Or you use a QML component that inherits Rectangle and Rectangle does not inherit Component. You should enclose your SelectedRectangle in a Component object, just like you did for the delegate.

Finally, you should write something like this for your highlight component :

highlight: Component {
    SelectedRectangle {}
}
于 2012-07-02T22:05:33.157 回答