Столкнулся с такой проблемой: когда количество строк в TableView меньше высоты TableView то оставшуюся высоту заполняют пустые строки окрашенные в цвет первого элемента. Как можно отсечь пустые строки?
Код который я написал:
import QtQuick 2.15
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls 2.0 as QQ2
Window {
visible: true
width: 640
height: 300
x: (Screen.width - width) / 2
y: (Screen.height - height) / 2
color: "gray"
ListModel {
id: listModel
ListElement {
name: qsTr("Alyce")
age: 18
from: qsTr("Raccoon city")
}
ListElement {
name: qsTr("Leon Kennedy")
age: 19
from: qsTr("Raccoon city")
}
ListElement {
name: qsTr("Claire Redfield")
age: 20
from: qsTr("Raccoon city")
}
ListElement {
name:qsTr("Chris Redfield")
age: 21
from: qsTr("Raccoon city")
}
}
TableView {
id: tableView
anchors.fill: parent
backgroundVisible: false
clip: true
model: listModel
TableViewColumn {
role: "name"
title: qsTr("name")
width: tableView.contentItem.width / tableView.columnCount
delegate: itemDelegateText
}
TableViewColumn {
role: "age"
title: qsTr("age")
width: tableView.contentItem.width / tableView.columnCount
delegate: itemDelegateText
}
TableViewColumn {
role: "from"
title: qsTr("From")
width: tableView.contentItem.width / tableView.columnCount
delegate: itemDelegateText
}
headerDelegate: Rectangle {
height: 30
color: "#FAEBD7"
Text {
id: headerName
anchors.fill: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
text: styleData.value
font { pointSize: 15; bold: true }
}
}
Component{
id: itemDelegateText
Text {
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: styleData.selected ? "gray" : "black"
elide: styleData.elideMode
text: styleData.value
font { pointSize: 12; bold: true }
}
}
rowDelegate: QQ2.ItemDelegate {
id: rowRectangle
height: 30
hoverEnabled: true
clip: true
//property color rowColor: styleData.selected ? "#FFDEAD" : (styleData.alternate ? "#F0FFF0" : "#E6E6FA")
function setColor() {
var item = listModel.get(styleData.row).name
if (item === "Alyce")
return "green"
else if (item === "Leon Kennedy")
return "yellow"
else if (item === "Claire Redfield")
return "red"
return "tomato"
}
background: Rectangle {
anchors.fill: rowRectangle
clip: true
color: rowRectangle.hovered ? "skyblue" : setColor()
}
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
if (tableView.rowCount > styleData.row) {
tableView.selection.clear()
tableView.selection.select(styleData.row)
console.log(listModel.get(styleData.row).name)
}
}
}
}
}
}