GUI Freezes When Loop is Started

closx

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

jsulm

@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.

closx

@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.

jsulm

@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.

closx

@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?

jsulm

@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

closx

@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!