Change the color of the button by clicking on it.

I want change botton color, with click on it.
like picture under.
Attachment 11743
my code:

Code:

---

import QtQuick 2.0
import QtQuick.Controls 1.1
Item {
    width: 100; height: 100
	property bool bImgChange: true
 
    Component.onCompleted: {
        for (var i = 0; i < 5; i++)
             repeater.append({"name": i})
    }
 
	Row {
		Repeater {
			model: ListModel {
				id: repeater
			}	
 
		Button {
			id:dokme
			y:20
			width:20
			height:20
				Text{
					text:name
					anchors.centerIn: parent
				}
 
			}
		}
	}		
}

---

The image looks like you want the button to change when it is pressed, not after it has been clicked.

Can you clarify which you want?

Cheers,
_

I want to change the color of the button.
Of course , The button that was clicked.
And other buttons restored.
like picture under.
Attachment 11743

So, restating the very same information that left some questions open is helping answering these questions how?

Cheers,
_

see this code:

Code:

---

import QtQuick 2.0
import QtQuick.Controls 1.1
Item {
    width: 100; height: 100
    Component.onCompleted: {
        for (var i = 0; i < 5; i++){
             repeater.append({"name": i})
		}
    }
 
	Row {
		Repeater {
			model: ListModel {
				id: repeater
			}	
 
		Button {
			id:dokme
			y:20
			width:20
			height:20
				Text{
					text:name
					anchors.centerIn: parent
				}
 
 
			onClicked: {
				rang(this)
 
			}
			function rang(e){
				this.iconSource = "b.gif"
			}				
		}
		}
	}		
}

---

see this code.
When the button is clicked.
Button color changes.
But not like that image.

---

Added after 1 24 minutes:

The problem was solved:

Code:

---

import QtQuick 2.0
import QtQuick.Controls 1.1
Item {
    width: 100; height: 100
    Component.onCompleted: {
        for (var i = 0; i < 5; i++){
             repeater.append({"name": i})
		}
    }
 
	Row {
		Repeater {
			model: ListModel {
				id: repeater
			}	
 
		Button {
			id:dokme
			y:20
			width:20
			height:20
 
				Text{
					id:man
					color: activeFocus ? "red" : "#000000"
					text:activeFocus ? "<b>"+name+"</b>" : name
					anchors.centerIn: parent
				}
			onClicked: {
				  man.forceActiveFocus();
			}				
		}
		}
	}		
}

---

So it had nothing to do with click at all.

Cheers,
_