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!