Problem with TableView and alternatingRowColors

[fermatqt]

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?

[SGaist]

Hi,
using

Window {
    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 ?

[fermatqt]

hi!

i'm using linux with qt 5.6.
i have this structure:
main.qml

import 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.

[fermatqt]

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

[SGaist]

You can try by setting a TableViewStyle so you ensure that you have two different colors.

[fermatqt]

@SGaist

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!!!