QML States : Not able to see any transition, rectangle always remains in state1



  • Code :

    @
    import QtQuick 1.0
    import com.nokia.meego 1.0

    PageStackWindow {
    id: rootWindow
    initialPage: page1

    Page {
        id: page1
        anchors.fill: parent
    
    
        Rectangle {
            id: rectItem
            width: 20
            height: 20
            color: "Red"
        }
    
    
        states: [
            State {
                name: "state1"
                PropertyChanges {
                    target: rectItem; x: 0; y:20
                }
            },
            State {
                name: "state2"
                PropertyChanges {
                    target: rectItem; x: 100; y: 100
                }
            }
        ]
    
        state: "state1"
    
        transitions: [
            Transition {
                from: "state1"
                to: "state2"
                PropertyAnimation { duration: 1000; properties: "x";
                    easing.type: Easing.InOutQuad }
            }
        ]
        Component.onCompleted: {
            timer.running = true;
        }
    }
    Timer {
        id: timer
        interval: 3000; running: false; repeat: true
        triggeredOnStart: true
        onTriggered: {
            console.log("timer")
            state = state === "state2" ? "state1" : "state2"
            console.log(state +  "state");
        }
    }
    

    }
    @

    [EDIT: code formatting, Volker]



  • Sorry for previous formatting error , please find code below and please help me

    [EDIT: removed doubled code. Please edit the original post (link is to the right, below username and avatar) to change it in the future, thanks. Volker]



  • What is this state = state === ?

    I used the following, and it worked!
    @
    state = (state == "state2")? "state1": "state2"
    @

    Enjoy!
    Bill



  • Hi Bill,

    Its still not working :( M testing on N9 device.

    Regards,
    Sonal



  • [quote author="billouparis" date="1329218245"]
    What is this state = state === ?
    [/quote]

    JavaScript has an equality operator <code>==</code> and an identiy operator <code>===</code> - both do comparison, but the latter one not doing implicit type conversion.

    <code>state = state === ... ? ... :</code> is an conditional assignment as known from C++.

    [quote author="sonal1687" date="1329219216"]Its still not working[/quote]

    Do you get any console output so you can make sure the timer is fired?



  • Ok I tested it so:

    @state = state === "state2" ? "state1": "state2"@
    and it worked too indeed, sorry for this!

    So the issue must be somewhere else. In my case I tested it on desktop PC, and simply removed the Nokia component you're using, and replaced it with a simple Item / Rectangle elements combo.

    Bill



  • Ok so it is working in desktop... Yes I do get console output that state is changing after every 3 seconds but I see no visual change in position of rectangle.

    -Sonal-



  • I got it : after putting state as page1.state :)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.