Howto show button as Active/InActive on click in QML

[pingal]

I would like to show my button as in-active when "clicked". I've created button like below

Button {
    id: myButton
    text: "Active"
    font.pixelSize: 18
    
    onClicked: {
       // What should I do here in order to show my button as inactive when clicked ?
    }
}

I would also like to toggle text of my button when clicked. i.e. From Active to Inactive on click

Example:

[Markkyboy]

You could use 'if/else' to toggle the text of the button when clicked;

        Button {
            id: myButton
            text: "Active"
            anchors.centerIn: parent

            onClicked: {
                if  (myButton.text === "Active")
                     myButton.text = "Inactive"
                else myButton.text = "Active"
            }
        }

[pingal]

And howto fade the color of button in-order to view it as an In-Active ? Just as shown in my first post button "DISABLED"

[Markkyboy]

This post is deleted!

[lemons]

Row {
    spacing: 40
    Button {
        id: button1
        // change text based on enabled property
        text: enabled ? "Enabled" : "Disabled"
        background: Rectangle {
            color: enabled ? "green" : "lightgray"
            // animate the color change
            Behavior on color {
                PropertyAnimation {
                    target: parent
                    duration: 380
                }
            }
        }
        onClicked: {
            // disable the button by setting enabled property to false
            // onClicked event won't trigger as long as enabled = false
            enabled = false
            console.debug("button1 clicked and disabled")
        }
    }
    Button {
        id: button2
        text: "Re-enable button"
        background: Rectangle{
            color: enabled ? "blue" : "lightgray"
        }
        enabled: !button1.enabled
        onClicked: {
            button1.enabled = true
            console.debug("button2 clicked and button1 re-enabled")
        }
    }
}