Solved Problem with TableView and alternatingRowColors
-
hi!
i have this table view with this model:
ListModel { id: libraryModel ListElement { npu: "A Masterpiece" conto: "Gabriel" } ListElement { npu: "Brilliance" conto: "Jens" } ListElement { npu: "Outstanding" conto: "Frederik" } } Rectangle { id: rectangle1 x: 0 y: 70 width: 900 height: 830 color: "#ffffff" TableView { id: lw x: 0 y: 0 width: 900 height: 816 alternatingRowColors: true TableViewColumn { role: "npu" title: "NPU" width: 400 } TableViewColumn { role: "conto" title: "CONTO" width: 400 } model: libraryModel }
the problem is that I do not see the rows with alternating colors.
They are always white.
can you tell me where I'm wrong? -
Hi,
usingWindow { id: rectangle1 width: 900 height: 830 color: "#ffffff" visible: true ListModel { id: libraryModel ListElement { npu: "A Masterpiece" conto: "Gabriel" } ListElement { npu: "Brilliance" conto: "Jens" } ListElement { npu: "Outstanding" conto: "Frederik" } } TableView { id: lw anchors.fill: parent alternatingRowColors: true TableViewColumn { role: "npu" title: "NPU" width: rectangle1.width / 2 } TableViewColumn { role: "conto" title: "CONTO" width: rectangle1.width / 2 } model: libraryModel } }
I get the right behavior. What OS/Qt version are you using ?
-
hi!
i'm using linux with qt 5.6.
i have this structure:
main.qmlimport QtQuick 2.4 import QtQuick.Controls 1.3 import QtQuick.Dialogs 1.2 ApplicationWindow { visible: true width: 900 height: 900 minimumWidth: 900 minimumHeight: 900 maximumWidth: 900 maximumHeight: 900 title: qsTr("Cimoda Admin") menuBar: MenuBar { Menu { title: qsTr("File") MenuItem { text: qsTr("&Open") onTriggered: console.log("Open action triggered"); } MenuItem { text: qsTr("Exit") shortcut: "Ctrl+Q" onTriggered: Qt.quit(); } } } MainForm { anchors.fill: parent } }
MainForm.ui.qml
import QtQuick 2.4 import QtQuick.Controls 1.3 import QtQuick.Layouts 1.1 Item { width: 900 height: 900 id: root TabView { id: tv width: parent.width height: parent.height Tab { id: tabClienti title: "Clienti" source: "Clienti.qml" } } }
Clienti.qml
import QtQuick 2.1 import QtQuick.Controls 1.0 import QtQuick.Dialogs 1.2 import "script.js" as Script Item { id: root Rectangle { x: 0 y: 0 width: parent.width height: 70 TextField { id: txtCerca x: 8 y: 22 width: 164 height: 26 anchors.verticalCenter: parent.verticalCenter placeholderText: qsTr("CONTO") font.capitalization: Font.AllUppercase text: "CLFD" } Button { x: 800 y: 21 text: qsTr("Cerca") anchors.verticalCenter: parent.verticalCenter onClicked: { Script.cercaConto(txtCerca.text) } } } Rectangle { x: 0 y: 70 width: parent.width height: 820 TableView { id: lw x: 0 y: 0 width: parent.width height: parent.height alternatingRowColors: true TableViewColumn { role: "npu" title: "NPU" width: root.width / 2 } TableViewColumn { role: "conto" title: "CONTO" width: root.width / 2 } onDoubleClicked: { var comp = Qt.createComponent("Cliente.qml"); var wind = comp.createObject(root); wind.show(clientiModel.get(row).npu); } model: clientiModel } } ListModel { id: clientiModel } MessageDialog { id: messageDialog function show(title, text) { messageDialog.title = title; messageDialog.text = text; messageDialog.open(); } } }
the table is totally white, no borders or colored stripes.
-
i also tried this in another window.
whit the same result.import QtQuick 2.3 import QtQuick.Controls 1.2 ApplicationWindow { visible: true width: 800 height: 800 minimumWidth: 800 minimumHeight: 800 maximumWidth: 800 maximumHeight: 800 title: qsTr("Cliente") Rectangle { id: rectangle1 width: parent.width height: parent.height color: "#ffffff" visible: true ListModel { id: libraryModel ListElement { npu: "A Masterpiece" conto: "Gabriel" } ListElement { npu: "Brilliance" conto: "Jens" } ListElement { npu: "Outstanding" conto: "Frederik" } } TableView { id: lw anchors.fill: parent alternatingRowColors: true TableViewColumn { role: "npu" title: "NPU" width: rectangle1.width / 2 } TableViewColumn { role: "conto" title: "CONTO" width: rectangle1.width / 2 } model: libraryModel } } }
-
You can try by setting a TableViewStyle so you ensure that you have two different colors.
-
ok this seems to work:
TableView { id: lw x: 0 y: 0 width: parent.width height: parent.height TableViewColumn { role: "npu" title: "NPU" width: clientiRoot.width / 2 movable: false } TableViewColumn { role: "conto" title: "CONTO" width: clientiRoot.width / 2 movable: false } onDoubleClicked: { var choosed = clientiModel.get(row).npu; var comp = Qt.createComponent("Cliente.qml"); var wind = comp.createObject(clientiRoot, {"npu": choosed}); wind.show(); } model: clientiModel style: TableViewStyle { backgroundColor: "#fff" alternateBackgroundColor: "#ccc" } }
thanks!!!