GUI Freezes When Loop is Started



  • Hello guys,

    I am trying to code a LED light transition application.
    I have 2 functions to proceed.
    One is for the delay, one is for the transition.

        function delayme(duration) {
            var timeStart = new Date().getTime();
            while (new Date().getTime() - timeStart < duration) {
            }
        }
    
        function transitme(r,g,b){
            for(var i=0;i<255;i++){
                myColor=Qt.rgba(r/255, g+i/255, b/255,1);
                sendColor(myColor);
                delayme(100);
                console.log("loop no:" +i);
            }
        }
    

    So, if I call the function as transitme(255,0,0) the lights do change
    from red to yellowish, but when de loop starts, GUI freezes so you cannot
    see the transitting.

    note:
    myColor is the colour variable that you see in GUI.
    sendColor() is the function to send the colours to the LEDs.
    me is someone that does not understand from threads


  • Qt Champions 2018

    @closx Loops in GUI thread block the GUI.
    Instead of using such a loop use a timer with regular timeout and on each timeout run the code which you have now in your loop.



  • @jsulm Thanks for the light-speed answer!
    I have already tried using a timer. The fact is, I need an index number that I can use.
    So I can change colours in time. I think, I do not have an index value in timers.

    note:
    Tried to write a c++ function with a loop and integrate it with qml, too. Result is just the same.


  • Qt Champions 2018

    @closx said in GUI Freezes When Loop is Started:

    The fact is, I need an index number that I can use

    Then use one. Just define a variable, initialize it with 0 before staring the timer and each time the timeout comes increase it.



  • @jsulm Alright,
    I have written a timer like this,

        Timer{
            id:transitme
            interval: 1000; //made it 1 second to test it
            running: false;
            repeat: true
            onTriggered: function(){
                var index=0;
                myColor=Qt.rgba(255/255, index/255, 0/255,1);
                sendColor(myColor);
                console.log("Index is: " + index);
                index++;
            }
        }
    

    and I am calling it with

    transitme.running=true;
    transitme.running.false;
    

    but the index is always zero as I guessed. Where else can I define the
    index, so it will not be re-created in every single loop?


  • Qt Champions 2018

    @closx said in GUI Freezes When Loop is Started:

    Where else can I define the
    index, so it will not be re-created in every single loop?

    Like

    Timer{
        property var index: 0
    

    https://doc.qt.io/qt-5/qml-var.html



  • @jsulm U are da king!

    I am dealing with QML for months, and just learning the property variables! That kinda saved my life mate!
    Thank you very much!


 

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