Like this:

@
Rectangle{
id:"test_id"
...
Component.onComplated{
test_id.state="your state"
}
}
@

in your demo,you should change Test_id.state="State1" to mouseArea1.state="State1"

read QML states manual u may understand it

!http://farm9.staticflickr.com/8545/8938019077_5c2dccb53c_o.jpg(image)!

in qtquick 2.0 I can read text from a database but I can't get it to show in in a specific state only in all states. how can I call my function reading in the database in a specific state for example 'state1'

@Text {
text: "?"
anchors.horizontalCenter: parent.horizontalCenter
function get_db() {
var db = LocalStorage.openDatabaseSync("DB1", "1.0", "The Example QML SQL!", 1000000);
db.transaction(
function(tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS Greeting(salutation TEXT, salutee TEXT)');
for ( var z=0; z<10; z++){
// tx.executeSql('INSERT INTO Greeting VALUES(?, ?)', [ z, z ]);
}
// tx.executeSql('INSERT INTO Greeting VALUES(?, ?)', [ 'hello', 'world' ]);
var rs = tx.executeSql('SELECT * FROM Greeting');
var r = ""
for(var i = 0; i < rs.rows.length; i++) {
r += rs.rows.item(i).salutation + ", " + rs.rows.item(i).salutee + "\n"
}
text = r
})}
Component.onCompleted: get_db()
}

states: [

State {
    name: "State1"
    PropertyChanges {
        target: mousearea1
        x: 608
        y: 1022
    }

    PropertyChanges {
        target: image5
        x: 760
        y: 980
    }

    PropertyChanges {
        target: image1
        x: 245
        y: 345
        width: 298
        height: 271
        fillMode: "PreserveAspectFit"
        source: "images/item.png"
        opacity: 1

    }

    PropertyChanges {
        target: mousearea2
        width: 130
        height: 190
        opacity: 1
          onClicked: page.state = 'base state'
    }

    PropertyChanges {
        target: image2
        x: 543
        y: 345
        width: 154
        height: 271
        fillMode: "PreserveAspectFit"
        source: "images/item.png"
        opacity: 1
    }
}

]@

Cheers,
Chris.