QML button change text color

Lazyos picture Lazyos · Nov 26, 2016 · Viewed 17.4k times · Source

I'm new in QML and i want to personalize my buttons. I succeed to change the background's color and border color. But I don't success at all to change the color of the button's text. I saw we don't use anymore "style" to change the style but "background" and I don't understand everything about it.

Thanks for your help.

Button {
        id: buttonAC
        text: qsTr("AC")
        Layout.fillHeight: true
        Layout.fillWidth: true

        background: Rectangle {
            border.color: "#14191D"
            color: "#24292f"
            // I want to change text color next
        }

        /*Text {
            text: qsTr("AC")
            color: "#F54035"
        }*/
}

Answer

nAkhmedov picture nAkhmedov · Jun 1, 2017

According to the doc

import QtQuick 2.6
import QtQuick.Controls 2.1

Button {
    id: control
    text: qsTr("Button")

    contentItem: Text {
        text: control.text
        font: control.font
        opacity: enabled ? 1.0 : 0.3
        color: control.down ? "#17a81a" : "#21be2b"
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        elide: Text.ElideRight
    }

    background: Rectangle {
        implicitWidth: 100
        implicitHeight: 40
        opacity: enabled ? 1 : 0.3
        border.color: control.down ? "#17a81a" : "#21be2b"
        border.width: 1
        radius: 2
    }
}