(1)方法一：點選某一選項，某一個選項的顏色就立即會發生變化

ListView {
id : m_listView
anchors.fill: parent
anchors.margins: 20
clip: true
model: ["A","B","C","D","E"]
delegate: m_listDelegate
spacing: 5
focus: true
}

Component {
id: m_listDelegate

Rectangle {
width: ListView.view.width
height: 40
color: ListView.isCurrentItem?"#157efb":"#53d769" //選中顏色設定
border.color: Qt.lighter(color, 1.1)
Text {
anchors.centerIn: parent
font.pixelSize: 10
text: modelData + index
}

MouseArea {
anchors.fill: parent
onClicked: m_listView.currentIndex = index  //實現item切換
}
}
}
 

(2)方法二：點選某一選項，某一個選項的顏色就會從別的選項移動過來，移動的比較慢就跟動畫一樣。

ListView {
id : m_listView
anchors.fill: parent
anchors.margins: 20
clip: true
model: ["A","B","C","D","E"]
delegate: m_listDelegate

highlight: Rectangle{
        color: "lightblue"//高亮條
    }
 highlightFollowsCurrentItem: true//高亮條隨著item的變化而移動
spacing: 5
focus: true
}

Component {
id: m_listDelegate

Rectangle {
width: ListView.view.width
height: 40
border.color: Qt.lighter(color, 1.1)
Text {
anchors.centerIn: parent
font.pixelSize: 10
text: modelData + index
}

MouseArea {
anchors.fill: parent
onClicked: m_listView.currentIndex = index  //實現item切換
}
}
}