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

SelectedRectangle.qml

Rectangle
{
    id: selectionRectangle

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

解決策: deviceTreeDelegate の四角形はデフォルトで白で、選択用の四角形と重なっていました。透明に設定されたプロパティを使用して、選択範囲が見えるようにします。

4

2 に答える 2

12

これは、既定の長方形の色が白で、ハイライトがデリゲートの下に重ねられているためです。Rectangle の色を「透明」に設定すると、デリゲートを通してハイライトが見えるようになります。

于 2012-07-04T10:34:47.330 に答える
0

あなたのコードには2つの間違いがあります:

  1. ハイライト プロパティのコンポーネント。コンポーネントのタイプの名前は、それが定義されている QML ファイルの名前と同じです。SelectedRectangle.qml という名前のファイルで定義したのでhighlight: SelectionRectangle {}、メインの QML ファイルに書き込む必要があります。
  2. 強調表示メンバーの型は Component です。したがって、このメンバーに使用するコンポーネントは、Component を継承する型を持っている必要があります。または、Rectangle を継承する QML コンポーネントを使用し、Rectangle は Component を継承しません。デリゲートの場合と同様に、SelectedRectangle を Component オブジェクトで囲む必要があります。

最後に、ハイライト コンポーネントに次のように記述します。

highlight: Component {
    SelectedRectangle {}
}
于 2012-07-02T22:05:33.157 に答える