QML中tableview处理点击事件同时能保证选中行高亮和文字变化

最新推荐文章于 2024-07-06 08:50:50 发布

西伦

最新推荐文章于 2024-07-06 08:50:50 发布

阅读量3.2k

点赞数

分类专栏： QML 文章标签： QML TableView

本文链接：https://blog.csdn.net/hu_linux/article/details/55049931

版权

该篇博客介绍了如何在QML中使用TableView组件处理点击事件，同时确保选中行显示高亮效果和文字颜色变化。示例代码展示了设置TableColumn、定义ListModel，以及在itemDelegate中监听点击事件，通过styleData属性改变文字样式和背景色的方法。

摘要由CSDN通过智能技术生成

import QtQuick 2.5import QtQuick.Controls 1.4ApplicationWindow { visible: true width: 640 height: 480 title: qsTr("Hello World") TableView { id: tableView; anchors.fill: parent; TableViewColumn { role: "title" title: "Title" width: tableView.width /2; } TableViewColumn { role: "author" title: "Author" width: tableView.width /2; } model: libraryModel itemDelegate: Rectangle { color: styleData.selected ? "lightgreen": "white"; width: tableView.width /2; height: 60; property bool isSelect: styleData.pressed; onIsSelectChanged: { if(!isSelect){ return ; } console.log("row = " + styleData.row); console.log("isSelect = " + isSelect); //处理点击事件 } Text { text: styleData.value; anchors.centerIn: parent; font.bold: styleData.selected; color: styleData.selected ? "red": "black"; } } } ListModel { id: libraryModel ListElement { title: "A Masterpiece" author: "Gabriel" } ListElement { title: "Brilliance" author: "Jens" } ListElement { title: "Outstanding" author: "Frederik" } ListElement { title: "Outstanding" author: "Frederik" } ListElement { title: "Outstanding" author: "Frederik" } }}