设置Qml TabBar选项卡颜色？

Question

我尝试使用此代码设置TabBar标签背景颜色，但只更改了选定的标签颜色。如何为其他标签设置颜色？另外，如何为标签设置文字颜色？

TabBar {
    id: tabBar

    currentIndex: swipeView.currentIndex

    background: Rectangle {
        color: "#f4d37c"
    }

    TabButton {
        id: cardsTabButton
        height: Style.line2Height
        text: qsTr("Cards")
    }

    TabButton {
        id: errorsTabButton
        height: Style.line2Height
        text: qsTr("Errors")
    }
}

（选中了左侧标签）

Answer 1

您可以自定义任何QML.2控件，包括TabBar。有关详细信息，请参阅this页面。简单的例子：

TabBar {
    id: tabBar
    anchors.fill: parent
    background: Rectangle {
        color: "yellow"
    }
    TabButton {
        height: 30
        text: "Tab1"
        background: Rectangle {
            color: tabBar.currentIndex == 0 ? "orange" : "green"
            radius: 10
        }
    }
    TabButton {
        height: 30
        text: "Tab2"
        background: Rectangle {
            color: tabBar.currentIndex == 1 ? "purple" : "lightblue"
            radius: 10
        }
    }
}